Gustavo dias - Implementação completa do Blog Apiki.DEV

[gustavodscruz]

Olá, time! 👋

Missão cumprida! Este PR entrega a solução completa para o desafio Blog Apiki.DEV.

O projeto foi forjado em Next.js 15 e App Router, com o objetivo de criar uma aplicação de altíssima performance, totalmente otimizada para SEO e com uma base de código moderna e escalável.

---

**O que foi feito? **

• Página Inicial (/): Exibe os posts da categoria "Desenvolvimento" com um sistema de paginação "Carregar mais". A página é gerada estaticamente e revalidada a cada 24 horas (ISR) para garantir performance e dados atualizados.
• Página de Post (/[slug]): Renderiza o conteúdo completo de cada artigo, gerada estaticamente no build (SSG) para um carregamento instantâneo. Inclui imagem de destaque otimizada e tratamento de erro para posts que não existem.
• Página 404 Personalizada: Uma página de erro amigável e com design moderno, que guia o usuário de volta para a home.
• Otimizações de SEO: Implementação completa de metadados dinâmicos, dados estruturados (JSON-LD), sitemap e robots.txt para garantir a melhor indexação possível.

---

**Como foi construído? **

• Performance em primeiro lugar: Usei Geração Estática (SSG) para todas as páginas de post e Revalidação Estática Incremental (ISR) na home, garantindo que o site seja extremamente rápido e eficiente.
• Arquitetura com App Router: A estrutura segue as convenções mais recentes do Next.js, com Server Components para buscar dados e componentes de cliente para interatividade (como o botão de carregar mais).
• Estilização com CSS Modules: Cada componente tem seu próprio estilo escopado, evitando conflitos e facilitando a manutenção. As variáveis CSS foram usadas para manter a consistência do tema.
• Segurança com TypeScript: Todo o projeto é 100% tipado, desde a resposta da API até os props dos componentes, para um código mais robusto e livre de bugs.

---

**Como testar? **

1. Acesse a página inicial e veja a lista de posts carregar.
2. Clique no botão "Carregar mais" e observe os novos posts sendo adicionados à lista.
3. Clique em um post para navegar até a página de detalhes e verifique se o conteúdo completo é exibido.
4. Tente acessar uma URL que não existe (ex: /pagina-que-nao-existe) para ver a página 404 em ação.
5. Use as ferramentas de desenvolvedor do seu navegador para inspecionar o código-fonte e confirmar a presença das meta tags de SEO e do script JSON-LD.

---

📷 Screenshots

Qualquer dúvida ou sugestão, é só avisar!