Construir uma aplicação web em NextJS que tenha o comportamento de uma locadora de carros, contendo a página Home, Favoritos, Single page do carro e formulário de reserva com o carro escolhido.
Dar um fork no projeto, clonar o repositório em sua máquina local e criar um branch novo para o seu código.
• Ao acessar a home, trazer a listagem de carros, no estilo carrosel, separadas por pelo menos 3 categorias de marcas (ex: audi, toyota, bmw).
• Na listagem do carro, deverá ter uma opção para adicionar aos favoritos e um botão para saber mais (Single Page).
• Na Single Page, deverá conter as informações do carro escolhido, opção para favoritar e botão para reservar (Formulário de reserva).
• Na página de formulário de reserva, deverá conter as informações do carro escolhido e um formulário com dados básicos de contato (Não precisa enviar o e-mail).
• O formulário deverá ter suas devidas mascaras de input (telefone, cpf, data de nascimento).
• O formulário deverá ter suas devidas validações (não pode enviar vazio, telefone com 11 dígitos, cpf com 11 dígitos, data de nascimento com 10 dígitos).
• Ao acessar a página de favoritos, deverá listar os carros favoritados e ter a opção de remover dos favoritos.
• API de carros: https://api-ninjas.com/api/cars
-
Não é necessário se preocupar com CORS ou implementar um backend para fazer as requisições. A API de carros permite chamadas diretas do navegador.
-
Design de livre escolha.
• Utilizar SASS
• O projeto deve ter uma documentação em readme ensinando a:
- instalar o projeto na máquina (engines, versão de node, qual gerenciador de pacote usar)
- instalar as dependências do projeto
- rodar o ambiente de desenvolvimento
- rodar a build de deploy da aplicação.
• Pode utilizar tanto o Axios quanto o Fetch para requisições.
• Hospedar o projeto em um servidor (Heroku, Vercel, Netlify)
• Utilização de typescript
• Bom uso de context api ou outro gerenciamento de estados
Boa sorte!