Introdução
Documentação moderna com Fumadocs, publicada no GitLab Pages via CI/CD — o projeto dos vídeos do canal Code In Loop.
Este projeto é uma documentação feita com Fumadocs sobre Next.js, exportada como site estático e publicada automaticamente no GitLab Pages por um pipeline de CI/CD.
Ele acompanha dois vídeos do canal Code In Loop: o primeiro monta a documentação, o segundo coloca ela no ar.
Por onde começar
Vídeos do canal
Os dois vídeos que originaram este projeto, na ordem em que foram gravados.
Deploy no GitLab Pages
O .gitlab-ci.yml, o export estático do Next.js e as pegadinhas do caminho.
Componentes
Cards, blocos de código, callouts e o player de vídeo usado aqui.
Referências
Links do Fumadocs, do GitLab Pages, do blog e do canal.
O que tem dentro
| Caminho | Para que serve |
|---|---|
content/docs | As páginas .mdx da documentação — é aqui que você escreve. |
lib/source.ts | Adaptador de conteúdo do Fumadocs (loader()). |
lib/layout.shared.tsx | Opções compartilhadas de layout: navegação, ícones e links. |
app/docs | Layout e rotas da documentação. |
app/api/search/route.ts | Busca estática, pré-gerada no build. |
.gitlab-ci.yml | Pipeline que faz build e publica no GitLab Pages. |
Rodando localmente
bun install
bun run devAbra http://localhost:3000 e edite qualquer arquivo em content/docs — a página
recarrega sozinha.
Prefere npm, pnpm ou yarn?
Funciona igual: troque bun run dev por npm run dev, pnpm dev ou yarn dev.
O pipeline de CI usa Bun apenas porque a imagem oven/bun já vem pronta.
Código-fonte
O repositório fica no GitLab, em
codeinloop/pages/fumadocs-gitlab-pages.
Toda página desta documentação tem um link Editar no GitLab logo abaixo do título.
Mais conteúdo sobre desenvolvimento, DevOps e infraestrutura está no blog codeinloop.com.br.