https://github.com/fernandozuchi/financial-dashboard
https://github.com/fernandozuchi/financial-dashboard
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/fernandozuchi/financial-dashboard
- Owner: FernandoZuchi
- License: mit
- Created: 2024-08-03T01:16:37.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-08-03T03:06:35.000Z (almost 2 years ago)
- Last Synced: 2024-08-04T04:07:12.753Z (almost 2 years ago)
- Language: TypeScript
- Size: 894 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Next.js App Router
Bem-vindo ao projeto Next.js App Router! Este projeto demonstra os principais recursos do Next.js por meio da construção de uma aplicação web full-stack.
## Introdução
Este projeto envolve a criação de uma versão simplificada de um painel financeiro com as seguintes funcionalidades:
- **Página inicial pública**: Uma página acessível a todos os usuários.
- **Página de login**: Para autenticação de usuários.
- **Páginas do painel protegidas**: Acesso restrito a usuários autenticados.
- **Gerenciamento de faturas**: Usuários podem adicionar, editar e excluir faturas.
Além disso, o projeto inclui a configuração de um banco de dados e cobre tópicos como estilização, otimizações, roteamento, busca de dados, busca e paginação, mutação de dados, tratamento de erros, validação de formulários, acessibilidade, autenticação e metadados.
Este projeto fornece uma base sólida para a construção de suas próprias aplicações full-stack com Next.js.
## Índice
- [Introdução](#introdução)
- [O Que Vamos Construir](#o-que-vamos-construir)
- [Visão Geral](#visão-geral)
- [Dependências](#dependências)
- [Documentação](#documentação)
- [Contribuidores](#contribuidores)
## Introdução
Neste curso, você aprenderá como construir uma aplicação web full-stack usando Next.js. Este curso cobre uma gama de recursos essenciais do Next.js, incluindo roteamento, busca de dados, autenticação e muito mais.
## O Que Vamos Construir
Para este curso, construiremos uma versão simplificada de um painel financeiro que inclui:
- Uma página inicial pública
- Uma página de login
- Páginas do painel protegidas por autenticação
- Funcionalidade para os usuários adicionarem, editarem e excluírem faturas
O painel também terá um banco de dados associado, que você configurará em um capítulo posterior. Ao final do curso, você terá as habilidades essenciais necessárias para começar a construir aplicações full-stack com Next.js.
### Capturas de Tela
## Visão Geral
Aqui está uma visão geral dos recursos que você aprenderá neste curso:
- **Estilização**: As diferentes maneiras de estilizar sua aplicação no Next.js.
- **Otimizações**: Como otimizar imagens, links e fontes.
- **Roteamento**: Como criar layouts e páginas aninhadas usando roteamento baseado no sistema de arquivos.
- **Busca de Dados**: Como configurar um banco de dados na Vercel e as melhores práticas para buscar e transmitir dados.
- **Busca e Paginação**: Como implementar busca e paginação usando parâmetros de URL.
- **Mutação de Dados**: Como mutar dados usando Ações do Servidor React e revalidar o cache do Next.js.
- **Tratamento de Erros**: Como lidar com erros gerais e erros 404 não encontrados.
- **Validação de Formulários e Acessibilidade**: Como fazer validação de formulários no servidor e dicas para melhorar a acessibilidade.
- **Autenticação**: Como adicionar autenticação à sua aplicação usando NextAuth.js e Middleware.
- **Metadados**: Como adicionar metadados e preparar sua aplicação para compartilhamento social.
## Dependências
- Next.js
- React
- NextAuth.js
- Vercel
## Documentação
- https://nextjs.org/learn?utm_source=next-site&utm_medium=homepage-cta&utm_campaign=home
## Contribuidores
- Documentação NextJS
- Fernando Zuchi