Visite o projeto em seu estado atual em: https://paratodos.vercel.app/
Nesse projeto, fui capaz de desenvolver uma aplicação fullstack simples, porém robusta com:
- Diversas etapas de Error Boundaries (utiizando respostas validadas em Backend em Toasts no Frontend).
- Arquitetura backend em MVC com Middlewares de validações.
- Deploy de banco de dados PostgreSQL com abstração em ORM Prisma em Supabase.
- Autenticação e handshakes de autenticação dinamicos, dentro de API prórpria, com JWT e particularidades Server Side do NextJS.
- Armazenamento de informações em Cookies e criação de Sessões de Controle de Usuário.
- Frontend componentizado, estilizado em ChakraUI e responsivo.
- Aplicações de conhecimento em OOP e SOLID, como principio de Single Responsabity e OCP em Classes do Backend e principos de Liskov na criação de Middlewares.
- Funções padrões de frontend, como estado de formulários, validador de senhas, aplicação em tela cheia, dark mode e light mode.
- Desenvolvimento de diversas Design Patterns, como Factories e Observers para manipulçao de objetos, seus eventos e seus estados.
- Testes E2E em padrão TDD dentro do Cypress.
Localmente
git clone git@github.com:rafaelPermec/nextjs-fullstack-to-do-list.git
Entre com o comando em seu terminal, para entrar no diretório principal e instalar as dependências do projeto:
cd nextjs-fullstack-to-do-list && npm install
DATABASE_URL=string
NODE_ENV=development
TOKEN_SECRET=string
DATABASE_TOKEN
é a hash ou URL para subir o banco de dados no local desejado.
Digite um dos comandos abaixo em seu terminal e vá até http://localhost:3000!
npm run start
|| ou ||
npm run dev
Cenário de Testes
Para garantir a qualidade do código, utilizei neste projeto os linters ESLint
nos padrões do NextJS.
Assim o código estará alinhado com as boas práticas de desenvolvimento, sendo mais legível
e de fácil manutenção! Para rodá-lo localmente no projeto, execute o comando abaixo:
npm run lint
Cypress é uma ferramenta de teste de front-end desenvolvida para a web. Você pode rodar o cypress localmente para verificar se seus requisitos estão passando, para isso execute um dos seguintes comandos: Para executar os testes apenas no terminal:
npm run test
ou
npx cypress run
Para executar os testes e vê-los rodando em uma janela de navegador:
npm run cy:open
ou
npx cypress open
Após executar um dos dois comandos acima, será aberta uma janela de navegador e então basta clicar no nome do arquivo de teste que quiser executar (project.spec.js), ou para executar todos os testes clique em Run all specs