Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/joaomacaoli/fundaments-app-router
Repositório com os fundamentos dos conceitos de App Router no NextJs
https://github.com/joaomacaoli/fundaments-app-router
Last synced: 7 days ago
JSON representation
Repositório com os fundamentos dos conceitos de App Router no NextJs
- Host: GitHub
- URL: https://github.com/joaomacaoli/fundaments-app-router
- Owner: joaomacaoli
- Created: 2024-08-11T01:06:24.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2024-08-11T01:41:50.000Z (3 months ago)
- Last Synced: 2024-08-11T02:42:53.280Z (3 months ago)
- Language: TypeScript
- Size: 47.9 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Fundaments App Router
Este repositório contém os códigos e exemplos práticos desenvolvidos durante o curso **Next.js App Router e Testes** da Rocketseat. No módulo 1, intitulado **Fundamento do App Router**, exploramos conceitos essenciais do Next.js e a aplicação prática deles.
## 📚 Conteúdos Abordados
### 1. Criando Projeto Next.js
- Configuração inicial de um projeto com Next.js.
- Estrutura básica de pastas e arquivos.
### 2. Rotas e Layout
- Criação de rotas estáticas e dinâmicas.
- Implementação de layouts compartilhados.
### 3. Grupos e Rotas Dinâmicas
- Organização de rotas em grupos.
- Manipulação de rotas dinâmicas.
### 4. Arquitetura do Next.js
- Entendimento da estrutura e arquitetura do Next.js.
- Como o Next.js lida com SSR, SSG e ISR.
### 5. React Server Components
- Utilização de componentes React no lado do servidor.
- Vantagens e limitações dos React Server Components.
### 6. Fetch de Dados nos Componentes
- Técnicas de busca de dados em componentes React.
### 7. Loading e Streaming SSR
- Implementação de loaders e otimização do SSR.
- Streaming de conteúdo para melhorar a performance.
### 8. Abstraindo Client Components
- Criação e abstração de componentes no lado do cliente.
- Organização de componentes reutilizáveis.
### 9. Client Boundaries e Encadeamento
- Implementação de Client Boundaries.
- Encadeamento de componentes para melhorar a UX.
### 10. Árvore de Componentes no Next.js
- Estruturação da árvore de componentes.
- Melhorando a organização e manutenção do código.
### 11. Suspense API no React
- Utilização da Suspense API para lidar com carregamentos assíncronos.
- Melhorando a experiência do usuário com carregamentos mais suaves.
## 🚀 Como Executar o Projeto
1. Clone o repositório:
```bash
git clone https://github.com/joaomacaoli/fundaments-app-router.git
```
2. Instale as dependências:
```bash
cd fundaments-app-router
npm install
```
3. Execute o servidor de desenvolvimento:
```bash
npm run dev
```
4. Abra seu navegador e acesse:
```
http://localhost:3000
```
## 🔗 Links
- [Repositório no GitHub](https://github.com/joaomacaoli/fundaments-app-router)
- [Documentação do Next.js](https://nextjs.org/docs)
- [Curso Rocketseat](https://www.rocketseat.com.br/)
## 🤝 Contribuições
Sinta-se à vontade para fazer um fork do projeto e contribuir com melhorias ou sugestões. Pull requests são sempre bem-vindos! 😄
## 📝 Licença
Este projeto está licenciado sob a [MIT License](LICENSE).