
Como este blog foi construído
Neste post vou contar como este blog foi construído. A ideia era algo simples, barato e fácil de manter, tudo versionado no GitHub.
A stack
O blog usa três peças principais:
- Astro: gerador de sites estáticos. Ele converte os posts em Markdown em HTML puro, o que deixa o site rápido.
- GitHub Pages: hospedagem estática gratuita.
- GitHub Actions: o pipeline que compila o site e faz o deploy a cada push.
Como funciona o deploy
Quando o código chega no branch main, o workflow .github/workflows/deploy.yml roda automaticamente:
- Instala as dependências com
npm ci. - Gera o site com
npm run build(a saída vai paradist/). - Envia a pasta
dist/como artefato do GitHub Pages. - Publica o artefato no endereço do site.
Como o repositório se chama blog, o site fica disponível em:
https://nullpointer-9.github.io/blog/
Detalhe importante: o base path
Como o site vive em um subcaminho (/blog/), o Astro precisa saber disso. No
astro.config.mjs configuramos:
site: 'https://nullpointer-9.github.io',
base: '/blog',
E todos os links internos do site usam import.meta.env.BASE_URL como prefixo, assim continuam
funcionando mesmo mudando o endereço no futuro.