React Docs - thinking in React

1. How would you break a mock into a component heirarchy?
   • drawing boxes around components to help visulizing the heirarchy
2. What is the single responsibility principle and how does it apply to components?
   • keep each component simple and doing one thing only
3. What does it mean to build a ‘static’ version of your application?
   • there will be no interactions, everything is fixed and not responsive
4. Once you have a static application, what do you need to add?
   • adding interactions and states
5. What are the three questions you can ask to determine if something is state?
   • Is it passed in from a parent via props? If so, it probably isn’t state.
   • Does it remain unchanged over time? If so, it probably isn’t state.
   • Can you compute it based on any other state or props in your component? If so, it isn’t state.
6. How can you identify where state needs to live?
   • Identify every component
   • Find a common owner component
   • Either the common owner or another component higher up in the hierarchy should own the state
   • If you can’t find a component where it makes sense to own the state, create a new component solely for holding the state and add it somewhere in the hierarchy above the common owner component.

More on Thinking in React

<==Back