Resolução: 1366x768px
O projeto consiste em uma biblioteca do universo canônico de Star Wars.
A partir do código existente, o candidato deverá implementar as funcionalidades propostas, abrindo um pull request no repositório de código contendo os códigos-fontes e o arquivo README.md contendo instruções de como rodar o projeto e quaisquer outras observações que julgar necessário.
O projeto foi desenvolvido utilizando os frameworks Vue v3.x e Vuetify 3.x. Entretanto, é válido usar Vue v2.x, bem como TypeScript ou outra melhoria.
Gerenciador de pacotes: Yarn
Ferramenta de build: Vite
Os dados são fornecidos pela API do SWAPI.
Os dados são retornados em formato JSON.
-
Faça um fork do repositório;
-
Clone o repositório para a sua máquina local;
-
Instale o Yarn (caso não esteja instalado);
-
Rode
yarn installpelo prompt de comando na pasta do projeto; -
Abra um pull request para entregar o teste.
1) Frameworks:
Faça bom uso dos frameworks e crie mais componentes.
2) Implemente a busca:
Ao digitar no campo de busca, os dados devem ser filtrados conforme o seu nome ou título.
3) Desenvolva a paginação dos dados:
A página deve possibilitar a exibição de mais dados paginados.
Fique livre para usar componentes de paginação ou um botão "carregar mais" ou ainda um carregamento automático.
1) Desenvolva a navegação por rotas:
Escolha ao menos dois dos recursos seguintes: films, people, planets, species, starships
ou vehicles, e crie páginas para exibição da listagem dos mesmos.
2) Dashboard:
Crie uma página para exibição de gráficos e mostre ao menos quatro gráficos distintos.
Fique livre para escolher os tipos dos gráficos bem como a complexidade. Você também é livre para usar bibliotecas.
Por exemplo:
Gráfico linha relacionando o peso e a altura das pessoas
3) Estrutura do projeto:
Realizar melhorias na estrutura do projeto.
Uma sugestão aqui seria separar os serviços dos componentes.
1) Organização e padronização de código:
Usar ferramentas de análise de código, ESLint, por exemplo.
2) Internacionalização:
Adaptar para tradução, por exemplo, utilizando Vue I18n.
1) Acabamento:
Quaisquer implementos funcionais e/ou visuais que melhorem a experiência do usuário na página são bem-vindas.
-
Correta implementação das funcionalidades;
-
Legibilidade, simplicidade e manutenibilidade do código;
-
Melhor uso dos frameworks;
-
Histórico de commits.