ReactJS - Melhores Práticas

Neste capítulo, listaremos as melhores práticas, métodos e técnicas do React que nos ajudarão a permanecer consistentes durante o desenvolvimento do aplicativo.

  • State- O estado deve ser evitado tanto quanto possível. É uma boa prática centralizar o estado e passá-lo para baixo na árvore de componentes como suportes. Sempre que temos um grupo de componentes que precisam dos mesmos dados, devemos definir um elemento de contêiner em torno deles que manterá o estado. O padrão de fluxo é uma boa maneira de lidar com o estado em aplicativos React.

  • PropTypes- Os PropTypes devem sempre ser definidos. Isso ajudará a rastrear todos os adereços no aplicativo e também será útil para qualquer desenvolvedor que esteja trabalhando no mesmo projeto.

  • Render- A maior parte da lógica do aplicativo deve ser movida dentro do método de renderização. Devemos tentar minimizar a lógica nos métodos de ciclo de vida do componente e mover essa lógica no método de renderização. Quanto menos estado e adereços usarmos, mais limpo será o código. Devemos sempre tornar o estado o mais simples possível. Se precisarmos calcular algo a partir do estado ou adereços, podemos fazer isso dentro do método de renderização.

  • Composition- A equipe React sugere o uso de um único princípio de responsabilidade. Isso significa que um componente deve ser responsável por apenas uma funcionalidade. Se alguns dos componentes tiverem mais de uma funcionalidade, devemos refatorar e criar um novo componente para cada funcionalidade.

  • Higher Order Components (HOC)- Versões anteriores do React ofereciam mixins para lidar com funcionalidades reutilizáveis. Como os mixins agora estão obsoletos, uma das soluções é usar o HOC.