Putting it all together

Here are the main steps of building a React App:

1. Define Component Hierarchy:

   • Divide the page into components where each part of the page to do a specific task is considered a seprate component (kown as single responsibility principle), when a component is growing too big, it is good to think of dividing it to sub components.

2. Build A Static Version in React:

   • Where you will have a model of your design but with no interactivity.

3. Identify Interactive Data

   • As long as needed, data needed for interaction will be stored in state not props.

4. Where to Add State?

   • Data needed for a component shall live in it or on a higher level component (remeber one way data flow)

5. Data Flow in Opposit Direction

   • Define what kind of interaction needed from child to parent and pass functions that setState as aprop to the child.