Aparência
Projeto Final: Aplicativo de Gerenciamento de Tarefas
O projeto final para o curso será o desenvolvimento de um aplicativo de gerenciamento de tarefas chamado TaskManager. O objetivo deste aplicativo é permitir que os usuários criem, visualizem, modifiquem e excluam tarefas, além de categorizá-las. O aplicativo usará Vue.js com Pinia para o gerenciamento de estado e terá integração com uma API externa para persistência dos dados. Além disso, o projeto incluirá autenticação de usuários e roteamento avançado com Vue Router.
Requisitos do Projeto
- Autenticação de Usuários: Os usuários devem ser capazes de se registrar e fazer login. A autenticação será manipulada através de uma API externa.
- Gerenciamento de Tarefas: Os usuários devem poder criar, visualizar, editar e deletar tarefas.
- Categorias: As tarefas podem ser categorizadas. Os usuários podem criar e editar categorias.
- Roteamento Avançado: Uso do Vue Router para navegar entre diferentes vistas e estados do aplicativo.
- Estado Global com Pinia: Uso do Pinia para gerenciar o estado da aplicação, incluindo o estado de autenticação e o estado das tarefas.
Tecnologias e Ferramentas
- Vue 3: Framework front-end.
- Pinia: Gerenciamento de estado.
- Vue Router: Gerenciamento de rotas.
- Axios: Para chamadas de API.
- Vite: Como bundler e servidor de desenvolvimento.
- PrimeVue: Para estilização.
- JSON Server ou Firebase: Para back-end simulado ou real.
Etapas do Desenvolvimento
Configuração do Projeto:
- Crie o projeto com Vite e Vue 3.
- Instale e configure Pinia e Vue Router.
- Configure PrimeVue para o projeto.
Desenvolvimento da Interface do Usuário:
- Crie componentes para as tarefas e formulários de tarefa.
- Desenvolva componentes para autenticação (login e registro).
- Implemente a navegação usando Vue Router.
Integração com a API:
- Configure Axios para fazer chamadas HTTP.
- Desenvolva serviços para interagir com a API de autenticação e gerenciamento de tarefas.
Gerenciamento de Estado com Pinia:
- Defina stores para usuários e tarefas.
- Implemente funcionalidades para manipular o estado baseado nas interações do usuário e respostas da API.
Autenticação:
- Implemente o fluxo de autenticação usando JWT ou sessões, dependendo da API.
- Garanta que as rotas sejam protegidas com guardas de rota do Vue Router.
Testes e Depuração:
- Realize testes manuais para garantir que todas as funcionalidades estejam funcionando como esperado.
- Use ferramentas como Vue Devtools para depurar o estado e os componentes.
Deploy:
- Prepare o aplicativo para produção.
- Faça o deploy usando plataformas como Netlify, Vercel ou qualquer servidor que suporte aplicações estáticas.
Documentação e Entrega
- Documentação do Código: Comente o código extensivamente para garantir que seja fácil de entender e manter.
- Documentação do Projeto: Prepare um README com instruções sobre como configurar e executar o projeto localmente.
Este projeto não só testará as habilidades adquiridas durante o curso mas também servirá como um excelente portfólio de trabalho para demonstrar competências práticas em desenvolvimento front-end com Vue.js, Pinia e integrações de API.