Over the past year I’ve been learning React. Here is what I wished I knew before going head first into it.
What you need to know about React Components
React is based on components, which are little building blocks of UI. Try and keep your components small, get them working and then split them up after. It will help you understand the true power of React Components.
Things you might want to avoid when using React
Don’t use Redux when you’re first starting. Hell, you might not even need it all depending on your application. Do not modify your state variables directly, use React’s built in this.setState() method. Because this.props and this.state may be updated asynchronously, you should not rely on their values for calculating the next state.
Constructors, state, and props, oh my!
The constructor is only used when a component needs to handle state and props (data). State is just a fancy term used to describe the local high level variables for your component. Plan how your components will interact so you can lift the state up, which is just storing the state in the containing (parent) components above. Props are just data and state passed through parent components so you don’t have redundant fetching of data, rendering, or re-rendering.
Read about each React lifecycle method and learn their purposes. You’ll want to fetch your data inside componentDidMount().
Using Create React App and Firebase Cloud Firestore will help you avoid spending too much time configuring a custom build. Firebase Cloud Firestore will help you stay focused on learning React without switching back and forth with a server side framework.