React Design Patterns - Mangayaki/UML GitHub Wiki
Padrões e funcionalidades usadas no Projeto
Controlled Components e Conditional Rendering
Controlled components são uma resposta do React para lidar com o estado de formulários. Esses componentes controlados recebem o estado através de props e podem notificar quaisquer mudanças por meio de callbacks, como o onChange.
Componentes pais podem controlar o estado do componente controlado lidando com o callback e gerenciando seu próprio estado, enquanto os novos valores são passados para o componente controlado como props.
Por padrão, o React tem suporte para componentes controlados e não controlados em formulários. No entanto, é altamente recomendado o uso de componentes controlados.
O trecho de código a seguir mostra um exemplo de componente controlado:
e o uso de Controlled Components nos permite utilizar o conceito de Conditional rendering isso significa que dependendo da ação que for tomada o componente pai pode exibir um componente diferente fazendo com que o nosso site se torne mais dinâmico e performático
React Hooks
os Reacts Hooks foram adicionados na versão 16.8, Essas funções permitem que os desenvolvedores usem o React sem necessidade de classes que foi um padrão bastante usado no React antes das Functions Components viraram um padrão aceito pela comunidade que utilizava a tecnologia.
O React possui diversos Hooks pré-prontos como o useEffect e o useState que são os mais utilizados porém o React tambem permite que criemos nossos proprios Hooks afim de podermos criar a nossa propria logica para gerenciar um estado que queremos alterar