Este projeto foi desenvolvido como parte de um desafio no bootcamp de React JS + Node da Souclode em parceria com TNT Energy Drink e Eletromidia. O objetivo foi criar uma página web totalmente componentizada usando React, inspirada no site da Nintendo, com algumas alterações.
Criar uma página totalmente componentizada utilizando React. A estrutura dos componentes deveria seguir os seguintes requisitos:
- O foco deve estar na estruturação e arquitetura dos componentes.
- A estrutura de componentes deve ser a seguinte:
<App>
: componente principal e pai de todos os componentes da aplicação.<Navbar>
: componente de cabeçalho com logo e links de navegação (sem funcionamento).<Banner>
: seção com conteúdo destacado.<Gallery>
: seção que possui diversos componentes de Card relacionado à temática.<Cards>
: componente que representa o card relacionado à temática.<Footer>
: informações sobre a temática escolhida.
- O componente
<Gallery>
deve utilizar a ideia de map para gerar a lista de Cards de acordo com um array de objetos. - O componente
<Navbar>
deve ter um botão de “Entrar” que, ao ser clicado, exibe um alerta no navegador.
- Componentes
- Estilização CSS com React
- Props
- Renderização condicional
- Listas e Eventos
Você pode acessar a página do projeto no GitHub Pages para ver como ficou: Nintendo-Inspired React Page
Aqui está uma prévia da página desenvolvida, inspirada no site da Nintendo. Esta imagem mostra o layout e o design implementados no projeto, destacando os componentes criados com React.
Fique à vontade para dar opiniões, correções ou sugestões do que mais posso adicionar para treinar minhas habilidades no desenvolvimento com React. Se você tiver dicas ou melhorias, sinta-se encorajado(a) a compartilhar!
Este projeto é apenas para fins educacionais e não possui nenhuma afiliação com a Nintendo. Todas as imagens e marcas da Nintendo utilizadas neste projeto pertencem aos seus respectivos proprietários. Não é minha intenção infringir qualquer direito autoral. Este projeto foi criado com o único propósito de praticar e demonstrar habilidades de desenvolvimento web usando React.