Olá, na atividade 6 estou com dúvidas sobre criar os componentes e onde destinar cada código de acordo com a opinião do instrutor, ele cita sobre o Forecast porém relata que é um componente e depois tem o ForecastList, o ForecastList seria uma outra pasta ou outro arquivo jsx? a mesma coisa gostaria de saber do ForecastItem, e sobre o styles.css, teria que criar para cada um desses componentes?
Olá, Abner, tudo bem?
No React, o objetivo é justamente dividir a interface em pequenas partes reutilizáveis.
Pense assim:
O componente ForecastItem seria responsável por exibir a previsão de um único dia. Ele receberia as informações (dia da semana, temperatura, etc.) e as mostraria na tela. Você o criaria em um arquivo próprio, como ForecastItem.jsx.
Já o componente ForecastList seria o "pai" que organiza a lista. Ele receberia um array com os dados de todos os dias e usaria a função .map() para renderizar vários componentes ForecastItem, um para cada dia.
Quanto ao arquivo styles.css, você pode seguir duas abordagens:
CSS por Componente: Criar um ForecastItem.css e um ForecastList.css. Isso ajuda a manter os estilos organizados e evita que um estilo afete o outro. É uma prática muito comum em projetos maiores.
CSS Global: Manter um único styles.css pode ser mais simples no início, mas exige mais cuidado para que as classes não entrem em conflito conforme o projeto cresce.
Separar em componentes e organizar os estilos é uma ótima prática que facilita muito a manutenção do código.
Espero ter ajudado! Bons estudos!
Sucesso ✨