Título

Feito para Rocketseat Feito por Arlei F. Farnetani Junior


🚀 Sobre o Projeto

Nesse desafio, você deverá criar uma aplicação para treinar o que aprendeu até agora no ReactJS

Essa será uma aplicação onde o seu principal objetivo é refatorar uma página para listagem de filmes de acordo com gênero.

A aplicação já está totalmente funcional mas grande parte do seu código está diretamente no arquivo App.tsx. Para resolver isso da melhor forma, é necessário dividir a aplicação em pelo menos duas partes principais: sidebar e o conteúdo principal que possui o header e a listagem de filmes.

  • A aplicação possui apenas uma funcionalidade principal que é a listagem de filmes;
  • Na sidebar é possível selecionar qual categoria de filmes deve ser listada;
  • A primeira categoria da lista (que é "Ação") já deve começar como marcada;
  • O header da aplicação possui apenas o nome da categoria selecionada que deve mudar dinamicamente.

Mais detalhes


Template da aplicação

Para te ajudar nesse desafio, criamos para você esse modelo que você deve utilizar como um template do GitHub.

O template está disponível na seguinte URL:

Template da Aplicação feita pela Rocketseat para ser utilizada

Porém, prefiro usar o MEU PRÓPRIO TEMPLATE que possui o Eslint, Prettier, Jest, Husky + Lint-Staged e mais algumas coisas configuradas:

Template em React + Eslint + Prettier + Jest

Usei ele, limpo a app de tasks simples que tem nele e depois venho trazendo as coisas do outro template modelo fornecida pela RocketSeat (acho melhor inclusive para o aprendizado).

🔧 Instalação e Uso

# Abra um terminal e copie este repositório com o comando
git clone https://github.com/farnetani/desafio-02-componetizando-a-aplicacao.git

# ou baixe o repositório clicando em Code > Download ZIP.

# Entre na pasta com
cd <nomedapasta>

# Instale as dependências
yarn install

# Inicie a API Fake
yarn server

# Rode o comando abaixo para startar a aplicação na porta :8080
yarn dev

# Abra o link: http://localhost:8080 no seu navegador

📝 Licença

Esse projeto está sob a licença MIT. Veja o arquivo LICENSE para mais detalhes.

Feito com 💜 por Arlei F. Farnetani Junior

Github Badge Instagram Badge Facebook Badge Gmail Badge Linkedin Badge

Github Badge Github Badge Github Badge Github Badge