Vibe coding um E-commerce do zero usando chatgpt e codex Ep 2

Configurando agentes paralelos no projeto

O segundo episódio da série avança na construção da ShockStop.com.br com uma mudança importante de método: dois agentes de inteligência artificial passam a trabalhar simultaneamente no mesmo projeto. Essa abordagem altera a dinâmica do desenvolvimento, pois exige coordenação entre os agentes e uma definição clara de responsabilidades para evitar conflitos na base de código. A configuração do arquivo AGENTS.md e do comando /init surge como elemento central para dar contexto persistente ao Codex, permitindo que cada agente compreenda o escopo do projeto, as convenções adotadas e o estado atual do repositório antes de executar qualquer tarefa. O vídeo documenta o processo real de integração entre ChatGPT e Codex, mostrando como dividir tarefas de frontend, backend e configuração de plataforma entre múltiplos agentes sem perder consistência.

O arquivo AGENTS.md funciona como uma memória de longo prazo para o Codex. Em vez de repetir o contexto completo a cada prompt, o desenvolvedor registra ali as regras do projeto, a arquitetura escolhida, os plugins utilizados e as decisões de implementação já tomadas. O comando /init, por sua vez, prepara o ambiente para que novos agentes possam ser inicializados rapidamente com o contexto necessário. Essa prática reduz drasticamente o retrabalho e melhora a qualidade das respostas, já que os agentes não dependem apenas do prompt imediato, mas de um histórico estruturado e acessível.

Internacionalização da loja com suporte a três idiomas

Um dos principais entregáveis do episódio é o início do suporte multilingue na loja. O projeto passa a considerar três idiomas: português, inglês e espanhol. A estrutura criada inclui a detecção automática do idioma do navegador ou da localização do visitante, o que permite apresentar a interface no idioma mais adequado desde o primeiro acesso. Esse tipo de implementação envolve decisões sobre arquitetura de rotas, arquivos de tradução, fallback de idioma e como o WordPress e o WooCommerce lidam com conteúdo traduzível.

A detecção automática por navegador ou localização é feita tipicamente por meio de cabeçalhos HTTP ou APIs de geolocalização, mas o vídeo mostra uma abordagem prática e incremental, priorizando uma base funcional que poderá ser expandida nos próximos episódios. A presença de um seletor de moeda também foi iniciada, o que complementa a experiência internacional ao permitir que o visitante visualize preços em sua moeda local. A integração entre idioma e moeda é um desafio relevante em e-commerce, pois exige sincronização entre formato de número, símbolos monetários e regras de arredondamento.

Seletor de moeda e experiência do usuário global

A inclusão de um seletor de moeda é um passo importante para transformar a ShockStop em uma loja realmente internacional. O seletor permite ao usuário alternar entre diferentes moedas sem interferir manualmente nas configurações do navegador. Para isso, é necessário trabalhar com taxas de câmbio, formatos de exibição e persistência da escolha do usuário durante a navegação. Em plataformas WordPress e WooCommerce, plugins especializados costumam oferecer essa funcionalidade, mas a série opta por um caminho mais controlado, com agentes configurando os recursos diretamente ou por meio de soluções leves.

O comportamento esperado é que a moeda selecionada seja mantida ao navegar entre páginas e ao adicionar produtos ao carrinho. Isso exige atenção à sessão do usuário e à compatibilidade com o WooCommerce, que possui sua própria lógica de moeda e arredondamento. A combinação entre detecção de idioma e seleção de moeda forma a base da experiência global do cliente, e o episódio avança nessa frente de forma incremental e documentada.

Evolução do WordPress e WooCommerce com agentes de IA

Outro ponto destacado é a continuação da evolução da loja sobre WordPress e WooCommerce. A escolha dessas tecnologias é estratégica por sua maturidade, grande ecossistema de plugins e facilidade de customização. Porém, à medida que a loja cresce e passa a ter requisitos internacionais, surgem desafios de performance, organização de templates e compatibilidade entre plugins. Os agentes de IA auxiliam na escrita de funções PHP, ajustes de CSS, configuração de hooks do WooCommerce e na criação de uma estrutura de arquivos mais modular.

A integração entre ChatGPT e Codex permite que um agente atue como planejador e revisor de tarefas enquanto o outro executa as alterações no código. Essa divisão de papéis é um padrão comum em workflows modernos de vibe coding, onde a velocidade de iteração é alta e a validação contínua é essencial. O vídeo mostra que o uso de inteligência artificial não élimina a necessidade de decisões humanas sobre arquitetura, UX e priorização, mas acelera a implementação e reduz a carga operacional.

Desafios reais do processo com múltiplos agentes

A série tem como proposta mostrar o processo real, incluindo o que funciona e o que dá errado. Com dois agentes trabalhando no mesmo projeto, surgem riscos de conflitos de edição, divergências de estilo de código e interpretações diferentes dos mesmos requisitos. O episódio documenta como o autor enfrenta essas situações, quais prompts utiliza para alinhar os agentes e como o contexto persistente do AGENTS.md ajuda a mitigar mal-entendidos.

A comunicação entre agentes não é direta: normalmente o humano atua como intermediário, revisando o que cada agente propõe antes de autorizar alterações. Esse fluxo exige atenção para não gerar inconsistências, especialmente quando ambos os agentes modificam arquivos semelhantes. A criação de regras claras de propriedade de arquivos e a divisão de tarefas por área funcional são práticas discutidas no vídeo, e servem como aprendizado para quem deseja montar um fluxo semelhante com ChatGPT e Codex.

Ferramentas e boas práticas para vibe coding

O episódio reforça a utilidade de ferramentas como o arquivo AGENTS.md, o comando /init e a separação de papéis entre agentes. O conceito de vibe coding está presente em toda a série: a ideia de que é possível construir software com instruções em linguagem natural, iterando rapidamente e deixando que a IA cuide de detalhes de implementação. Contudo, o vídeo também deixa claro que boas práticas de engenharia de software continuam relevantes, como versionamento de código, organização de commits e documentação mínima de arquitetura.

A escolha de um projeto real, e não de um exemplo simplificado, permite observar limitações e decisões de contorno que normalmente não aparecem em tutoriais curtos. A presença de um e-commerce com WordPress e WooCommerce adiciona complexidade de plugins, banco de dados e compatibilidade, tornando o cenário mais próximo da realidade de quem trabalha com projetos comerciais.

O que ésperar dos próximos episódios

Com a base multilingue e o seletor de moeda iniciados, os próximos episódios devem aprofundar a experiência de compra internacional. É provável que a série trate de tradução de conteúdo de produtos, estratégias de SEO para múltiplos idiomas, logística de pagamentos internacionais e ajustes de performance. A evolução do AGENTS.md também deve continuar, incluindo novas regras e otimizações conforme o projeto cresce.

A metodologia documentada no vídeo é útil para desenvolvedores, empreendedores e curiosos que desejam entender na prática como múltiplos agentes de IA podem colaborar em um projeto comercial. A transparência sobre erros e acertos torna a série um registro valioso de aprendizado, mostrando que o uso de IA em desenvolvimento é menos sobre mágica e mais sobre processo, iteração e boas decisões de arquitetura.