React & Redux Best Practices

Rafael Rozon
9 min readJul 28, 2019

Intro

This is a collection of thoughts, methods, and practices from myself and other people that I put together to help me, and hopefully other devs, to write clean, maintainable, and scalable front-end code in React and Redux, in particular.

This article is based on my own experiences developing in React and in a lot of reading I did on Medium and all over the internet about React and Redux best practices and project structure. My main focus here is on project structure and maintainability, not so much on components. Although I’ll say a thing or two about that.

I created a repo to illustrate the ideas discussed in this article: Moon React Boilerplate.

My intention is not to prescribe anything or to say that this is the best approach, it’s simply one possible approach among many. Hopefully, it’s useful for you ;)

TL;DR

  • One entity per file. Try to stick to this rule as much as possible
  • namespace redux actions
  • use factory functions or libraries (redux-actions, reduxsauce) to reduce boilerplate code
  • follow the Flux Standard Action spec
  • export all reducers for testing
  • one root route component
  • Link components are…

--

--