Nesta aula, você aprendeu a refatorar o componente Lista para seguir melhores práticas de desenvolvimento, como a separação de responsabilidades, criando um novo componente Item e utilizando props para passar dados.
Problema Inicial
- O componente Lista tinha muitas responsabilidades, incluindo o título, a renderização da lista e a renderização dos itens
(<li>)
. Isso violava o Princípio de Responsabilidade Única (SRP).
Solução: Separação de Responsabilidades
- Criamos um novo componente chamado Item para lidar exclusivamente com a renderização de cada item da lista.