Blog Pessoal

Explore diferentes funcionalidades do Next.js criando um blog pessoal utilizando o MDX!

🔨 Requisitos

Utilize o Next.js na versão mais atual para construir a estrutura do projeto e gerenciar as rotas da aplicação.
Implemente a aplicação pensando na responsividade e adaptabilidade.
Utilize MDX para criar as postagens do blog.
Estilize a aplicação utilizando o TailwindCSS.

Página inicial - lista de postagens

Liste as postagens do blog contendo título, uma breve descrição, a data de publicação e um link que direciona para a postagem completa.
A lista deve ser organizada de forma que as postagens mais recentes apareçam primeiro.

Página da postagem

Crie um arquivo .mdx para cada postagem.
Cada arquivo .mdx criado deverá ser uma rota da aplicação.
Adicione qualquer elemento que achar relevante para a sua postagem, como imagens, headings, listas, links, etc.

Deploy

Faça o deploy da sua implementação no Codante.

🔍 Dicas

Estude sobre a biblioteca @next/mdx, disponibilizada pelo Next.js.
Você pode utilizar o Tailwind Typography para estilizar o conteúdo das postagens de maneira rápida e eficiente.

🎨 Design Sugerido

Temos uma sugestão de design no Figma. Entretanto, fique à vontade para usar sua criatividade e criar um design único.

🔗Link do Figma

👉🏽 Sobre esse mini-projeto

Tecnologias sugeridas

TailwindCSS
Next.js
MDX
TypeScript

Pré-requisitos

HTML, CSS
JavaScript, React

❓ FAQ

Posso utilizar outras ferramentas além do MDX para criar as postagens?

A utilização de arquivos MDX foi pensada para remover a necessidade de um back-end para armazenar as postagens e aproveitar a praticidade de se criar conteúdos utilizando documentos no formato markdown. Isso tudo é facilitado pela biblioteca @next/mdx. A solução final oficial será desenvolvida utilizando essa ferramenta. No entanto, você pode implementar da forma que mais achar conveniente.

Como faço para ver a resolução oficial?

A resolução oficial sempre é disponibilizada no site oficial do Codante. Algumas resoluções são abertas e outras são exclusivas para os nossos membros PRO.