Uma aplicação que simula um e-commerce de produtos, onde contem a página inicial que lista todos os produtos e a página de detalhes de cada produto.
O aplicativo consiste em duas páginas principais: a primeira lista produtos e categorias, enquanto a segunda exibe detalhes específicos de cada produto. Atualmente, esta última é uma página gerada no lado do servidor, utilizando rotas dinâmicas. Até agora, os produtos foram simulados de maneira básica. Contudo, ao longo do curso, implementaremos estratégias para gerar páginas estáticas, consumindo API externa.
As principais técnicas e tecnologias abordadas são:
Next.js
: Framework para React com recursos de SSG.Fetch API
: Realizar requisições HTTP para buscar dados.React Components
: Componentes reutilizáveis.Web server
: Como hospedar o site.
- O principal desafio será converter as rotas dinâmicas da página de detalhes do produto em páginas estáticas exportadas.
Após baixar o projeto, você pode abrir com seu editor de código preferido. Siga estes passos:
- Abra o terminal no diretório do projeto.
- Execute
yarn
para instalar as dependências. - Inicie o servidor de desenvolvimento com
yarn dev
. - Acesse
http://localhost:3000
no navegador para ver o projeto.
Interessado em aprofundar seus conhecimentos em Next.js e SSR? Acesse o curso!