A Engenharia, Metodologia e Filosofia do Projeto Boutique Empresarial
Uma imersão na arquitetura estática de alta performance, governança agêntica baseada em especificações (SDD) e pipeline determinístico de entrega contínua impulsionado por Vite 6, Tailwind v4, Claude Code e AWS CloudFront.
Visão Geral da Arquitetura
O Funil Único & A Stack de Alta Performance
Eliminando o peso de frameworks runtime para garantir carregamento instantâneo e máxima eficiência de conversão.
MPA Estático & Zero-Runtime
Multi-Page Application construída com Vite 6 + Tailwind CSS v4. Código HTML e CSS puros com tempo de carregamento inferior a 1 segundo e zero sobrecarga de frameworks JavaScript no cliente.
Funil de Conversão de 7 Etapas
Foco cirúrgico em conversão: Landing Page do Diagnóstico Gratuito → Formulário conversacional progressivo de 7 etapas → Página de confirmação otimizada.
Backend Serverless GAS
Captura e persistência serverless via Google Apps Script (GAS) integrado de forma assíncrona, eliminando a complexidade e custos de infraestrutura de servidores dedicados.
Fundação Metodológica
Os 4 Pilares da Engenharia Boutique
Specification Driven Development (SDD) & VibeCoding
A documentação estruturada em docs/specs/ atua como Fonte Única da Verdade (SSOT). Nenhuma linha de código é alterada sem uma especificação técnica previamente aprovada.
- ✓ Contratos e ADRs imutáveis
- ✓ Fluxo de implementação ágil (VibeCoding) guiado por especificações
Pipeline Multi-Agente & Matriz de Modelos
Arquitetura agent-driven impulsionada por subagentes especializados (page-auditor, head-fixer, copy-writer, gate-runner).
- ✓ Princípio de FinOps: "Modelo caro decide, modelo barato executa, o gate arbitra"
- ✓ Orquestração com subagentes isolados para qualidade de código
Quality Gate Determinístico (Fail-Closed)
Comando unificado de validação que bloqueia o deploy em caso de qualquer divergência.
- ✓ Build Vite 6 sem erros + suíte Playwright cross-browser (Chromium, Firefox, WebKit)
-
✓ Auditoria automatizada de acessibilidade WCAG 2.1 AA via
axe-core
Agent Readiness & Compatibilidade AEO / WebMCP
Infraestrutura totalmente otimizada para descoberta e consumo machine-readable por Answer Engines e agentes autônomos de IA.
-
✓ Registros
llms.txt, RFC 8288 Link Headers e DNS-AID -
✓ Runtime WebMCP integrado via
navigator.modelContext
Anatomia do Repositório
Explorador da Estrutura de Código
Organização rigorosa de diretórios para separação clara de responsabilidades.
Páginas HTML5, CSS Tailwind v4, scripts conversacionais do formulário e ativos visuais da aplicação.
Especificações técnicas do SDD, contratos de componentes, regras AEO e plano multi-agente (SSOT).
Subagentes especializados com prompts de sistema e regras de escopo para auditoria, testes e cópias.
Manifestos Machine-Readable, Agent Cards, esquemas OAuth e descoberta por bots de inteligência artificial.
Automações do Quality Gate (quality-gate.mjs), auditorias globais de SEO e geradores.
Testes E2E com Playwright, cenários funcionais do formulário e verificações automatizadas de acessibilidade axe-core.
Infraestrutura AWS & CI/CD
Deploy Automatizado, Seguro & Global
Estratégia de distribuição global através de CloudFront, S3 e GitHub Actions autenticado via OIDC sem credenciais de longa duração.
GitHub Actions & AWS IAM
Uso de OpenID Connect (OIDC) para emitir credenciais temporárias de perfil AWS IAM durante a execução do workflow, eliminando segredos estáticos no repositório.
Amazon CloudFront + S3
Hospedagem de ativos estáticos no Amazon S3 protegidos por Origin Access Control (OAC), servidos globalmente via CloudFront CDN com indevida expiração de cache por invalidadores.
CloudFront Functions
Manipulação de cabeçalhos de segurança na borda (CSP, HSTS, X-Frame-Options) e reescrita de URLs limpas sem adição de latência à requisição final do usuário.
Em Síntese • AEO
Resumo Machine-Readable & Perguntas Frequentes
Qual é a stack principal do projeto Boutique Empresarial? ▼
O projeto utiliza uma arquitetura MPA (Multi-Page Application) estática de alta performance desenvolvida com Vite 6, Tailwind CSS v4, HTML5 semântico e CSS puro com zero-runtime JavaScript no cliente. O backend serverless de captura é suportado por Google Apps Script com integração assíncrona.
O que é Specification Driven Development (SDD) e VibeCoding? ▼
SDD é a metodologia onde toda especificação técnica em docs/specs/ atua como fonte única da verdade (SSOT). Nenhuma alteração de código ocorre sem especificação prévia aprovada. O VibeCoding é a agilidade na implementação guiada rigorosamente por esses contratos.
Como funciona o desenvolvimento agêntico multi-modelo? ▼
O repositório utiliza subagentes especializados (.claude/agents/) sob o princípio "modelo caro decide, modelo barato executa, o gate arbitra", garantindo eficiência operacional e FinOps de IA.
O que garante que o código não quebrará em produção (Quality Gate)? ▼
O Quality Gate determinístico fail-closed via npm run gate executa build de produção, testes Playwright cross-browser e auditoria de acessibilidade WCAG 2.1 AA com axe-core. O deploy na AWS só é autorizado pelo GitHub Actions OIDC se o gate estiver 100% verde.