devworkflow

Development workflow

React >> Root State >> Redux

Development flow for new features:

1. Start by creating stateless components, just pure mock, advantage of this approach:

   • We focus on understanding functionallity.
   • We will detect which components need to be broken down into subcomponents.
   • We have something visual that can be discussed.

2. Then migrate to a root component that will contain a mock state plus event functions:

   • This will let us play with data and mocked actions like (just functions in the root state) without having to jump into the redux layer.
   • Once we have it, we will have a clear understanding of the data flow and actions needed to be implemented later on.

3. Move root state and functions to actions, reducer, api's...:

   • Final step, now that we have clear what we want to implement is time to move it to all the needed plumbing.
   • In this step we will follow TDD to implemented containers, actions and reducers.

Unit Testing + TDD

Thumbrules to implement unit testing or follow TDD (exceptions may apply):

• Application components: do not implement unit tests on this component unless there's a reason to do it so.
• Reusable components: implement the component and add a unit tests battery (makes sense in this case, it's something that is going to be reused).
• Containers: follow TDD to implement them.
• Actions: follow TDD to implement them.
• Reducers: follow TDD to implemenent them.