Como construí este blog com agentes de coding

Eu já tive um blog. Tráfego razoável, tema claro, experiência pessoal de verdade: eu escrevia sobre frontend e sobre as coisas que eu mesmo passava na mão. Depois, por motivos não muito importantes, parei de mantê-lo e, de quebra, perdi o domínio.

Por muito tempo me pareceu que a história tinha simplesmente acabado. Mas hoje deu vontade de escrever de novo, já não sobre frontend como profissão, e sim sobre como eu faço projetos reais com agentes de coding. Sem abstrações sobre o futuro do desenvolvimento — através de processos concretos, erros e decisões.

Foi assim que apareceu o techmeat.dev.

Por que comecei isso

A ideia foi espontânea. Eu tinha tokens não usados acumulados, algumas hipóteses que queria testar, e decidi montar um projeto pequeno mas real: um blog onde o próprio processo de construção vira o primeiro material.

Meu workflow normal com agentes é bem mais elaborado: várias etapas de planejamento, review e checkpoints. Aqui simplifiquei de propósito. Queria ver até onde dá para ir se você fixa a direção rápido, prepara o contexto e passa para o agente a maior parte do trabalho inicial.

Não é um processo de referência, é uma versão experimental. Sobre a abordagem mais rigorosa eu provavelmente vou escrever em separado.

Preparação: skills, contexto e regras do projeto

Primeiro instalei as skills necessárias. Para um projeto desses isso pesa mais do que parece: «monta um blog» é um enunciado fraco demais. O agente precisa de regras claras: que tecnologias usar, onde guardar o conteúdo, como pensar SEO, como tratar o design, o que não fazer sem necessidade. O conjunto inicial está fixado no arquivo de trabalho INIT.md.

Depois inicializei o CLAUDE.md, o arquivo com o contexto base do projeto. O rascunho estava em russo, mas para o contexto de trabalho eu o traduzi imediatamente para inglês, para que servisse igualmente em todas as locales e em ferramentas diferentes.

This project is empty for now, but I am going to build my blog here. The project will be based on Astro, and posts will be stored as Markdown files. Each article will go through a multi-stage SEO and GEO preparation workflow using the skills available in the project and the geo-optimizer-skill CLI: https://github.com/Auriti-Labs/geo-optimizer-skill, which is already installed.

The blog will be about building projects with AI coding.

The domain has already been chosen and purchased: techmeat.dev.

The project will be hosted on Cloudflare Pages.

The primary language of the blog will be English, but there will also be translations into other languages, at least 10 popular ones. Translation pages must point to the English version of the same article with canonical links.

The project design must be created using the impeccable skill.

All project documentation must be written in English. Draft documentation may be an exception.

Em seguida copiei o CLAUDE.md para AGENTS.md. Não quero amarrar o projeto a um agente específico: se amanhã eu continuar o desenvolvimento em outra ferramenta, as regras base ficam ao lado do código.

Primeira execução: só fundação

Não pedi para o agente já fazer páginas ou design. No início eu precisava de uma fundação técnica correta: um projeto Astro pronto para Cloudflare Pages, com estrutura limpa e sem iniciativa demais.

O prompt foi propositalmente estreito:

Let's start developing our blog project. First, use the Astro skills and set up the initial project, preparing it for hosting on Cloudflare Pages. There is no need to build pages or do any additional work right now. Only set up the project.

Quanto mais estreito o primeiro pedido, menor a chance de o agente começar a «melhorar» o projeto onde ainda não há decisão tomada. Isso poupa muito nervo: eu precisava de um ponto de partida confiável, não de um mockup bonito.

Brainstorming em vez de design prematuro

Depois liguei o Superpowers e iniciei um brainstorming, pedindo expressamente para não falar de design. Nessa fase, o que precisava ser decidido era de que o blog é feito como produto, não como ele se parece.

O prompt foi assim:

Let's brainstorm in Russian about what my blog should consist of. Here's how I currently see it:

- All pages should share a unified design, but we are not discussing the design itself yet, only common blocks and similar structural elements. The header should include the techmeat.dev name and a language switcher. To clarify, the brainstorming result should describe what the blog should have, not how it should look.
- The home page should show previews of the 10 latest posts with links to the full posts. Maybe it should include something else too; suggest options.
- There should be an About page: something like a CV, but in a more blog-like form.
- There should be a Contacts page with links to my social profiles and GitHub.
- Maybe some other pages are needed; suggest options.
- This should be a very simple blog, mostly informational. I expect to publish materials often.

O brainstorming levou cerca de uma hora. Para um projeto tão pequeno parece muito, mas o tempo se pagou: sem ele eu não teria saído com um plano coerente e uma spec de arquitetura. O agente ajudou a quebrar o blog em páginas, blocos comuns, modelo de idiomas e estrutura de conteúdo.

No final apareceram dois artefatos internos: o plano da primeira versão e a especificação de arquitetura.

Desenvolvimento autônomo, review e fixes

Depois do brainstorming, só restava concordar com a direção e deixar o agente trabalhar. A maior parte da estrutura base apareceu de forma autônoma: rotas, conteúdo Markdown, locales, componentes, RSS, tags, infraestrutura para traduções.

Não foi totalmente sem intervenção manual. Adicionei alguns prompts corretivos: precisei o conjunto de idiomas, pedi para corrigir pequenos bugs e ajustar detalhes que o agente deixou escapar na primeira passada.

Depois pedi ao GPT-5.5 para revisar o código e aplicar os fixes na hora. Quase não me meti no processo: o agente achou várias melhorias úteis, aplicou-as e rodou as checagens. Sinceramente, esta versão eu vibe-codei quase inteira, coisa que normalmente tento evitar. Aqui dava: o projeto é pequeno, o custo de erro é baixo, e o sentido era justamente testar os limites dessa abordagem.

Aqui dá para ver bem como eu enxergo AI coding em geral. O agente não é um botão mágico de «me faça um produto», é um executor muito rápido que precisa de molduras, contexto e review periódico. Com molduras boas, ele tira um volume enorme de trabalho bruto. Com molduras vagas, ele produz incerteza com a mesma rapidez.

Por que adiei o design

Não incluí o design na primeira fase de propósito. Para a parte visual eu tenho um processo separado, e queria passar por ele em separado, sem misturar arquitetura, conteúdo e interface numa só tarefa.

Por isso a primeira versão do blog parece um esqueleto técnico: rotas, localização, posts, tags e infraestrutura de publicação já estão lá, e o sistema visual não está, e isso é normal. Às vezes é mais útil ter primeiro um projeto que funciona e depois pensar com calma em como ele se parece e como passa.

O que quero testar com este blog

techmeat.dev é um laboratório de trabalho, não um simples depósito de notas. Me interessa como o desenvolvimento muda quando há um agente de coding ao seu lado o tempo todo: onde ele acelera o trabalho, onde cria riscos ocultos, e onde ajuda a enxergar uma solução à qual sozinho eu chegaria muito mais tarde.

Três coisas em particular me prendem.

Processo. Não «o agente escreveu o código», mas o que houve antes e depois: quais prompts funcionaram, quais restrições tive de impor, quais decisões é melhor deixar com o humano.

Qualidade. AI-assisted development vira facilmente um fluxo de patches se você não mantiver plano e review. Quero mostrar tanto os resultados que deram certo quanto os pontos em que o agente errou ou em que minha formulação não foi precisa o suficiente.

Repetibilidade. Se a abordagem não pode ser repetida no próximo projeto, isso não é um processo, é um truque pontual. Por isso vou registrar não só o código final, mas também os esquemas de trabalho: como a tarefa foi posta, que arquivos apareceram, que ferramentas participaram, como foram tomadas as decisões.

E o que vem depois

A próxima etapa é design. A continuação deste post será exatamente sobre isso: como eu o fiz, que decisões tomei, o que saiu no fim. Embora como ele vai realmente parecer, eu mesmo ainda não sei.

Por enquanto, para a história, fica registrado como o blog parece hoje: