Folha IA
Folha IA
Início/Zé Mané — Prompts Mestre
Zé Mané — Prompts Mestre

Prompts Mestre: Construindo o CodeGuard AI – Agente de Código com LLMs Locais e Privacidade Total

(há 20 dias)
Prompts Mestre: Construindo o CodeGuard AI – Agente de Código com LLMs Locais e Privacidade Total

E aí, meu povo da tecnologia! Zé Mané na área, e hoje a gente vai desmistificar um problemão que tira o sono de muito CTO por aí: como usar a IA generativa para código sem entregar o ouro da empresa para a nuvem alheia. Chega de papo furado, vamos direto ao ponto com o nosso novo projeto: o CodeGuard AI!

1. O Projeto em 30 Segundos

O CodeGuard AI é a sua fortaleza digital para desenvolvimento de software. Ele resolve o dilema da IA no código, permitindo que desenvolvedores e empresas alavanquem o poder dos Large Language Models (LLMs) para geração, refatoração e otimização de código, tudo isso rodando localmente. Esqueça o envio do seu IP sensível para servidores de terceiros. Com o CodeGuard AI, você mantém seus dados e seu código dentro de casa, garantindo privacidade, segurança e compliance (LGPD, GDPR, HIPAA) enquanto turbina a produtividade. Ele é um agente de programação local, com UI intuitiva, integração com IDEs e foco em performance e segurança.

2. Arquitetura Recomendada

A arquitetura do CodeGuard AI é desenhada para máxima privacidade, performance e escalabilidade, aproveitando o poder do Edge e a robustez de LLMs locais.

Mermaid Error: Parse error on line 2: ... subgraph Cliente (Navegador/IDE) -----------------------^ Expecting 'SEMI', 'NEWLINE', 'SPACE', 'EOF', 'GRAPH', 'DIR', 'subgraph', 'SQS', 'end', 'AMP', 'COLON', 'START_LINK', 'STYLE', 'LINKSTYLE', 'CLASSDEF', 'CLASS', 'CLICK', 'DOWN', 'UP', 'NUM', 'NODE_STRING', 'BRKT', 'MINUS', 'MULT', 'UNICODE_TEXT', got 'PS'

Show Code
graph TD
    subgraph Cliente (Navegador/IDE)
        A[Interface Web (Next.js/Remix)]
        B[Plugin IDE (VS Code/IntelliJ)]
    end

    subgraph Edge (Vercel Edge Functions/Cloudflare Workers)
        C[API Gateway / Proxy]
        D[Autenticação (Auth.js/Supabase Auth)]
        E[Cache (Redis/Edge Cache)]
    end

    subgraph Backend (Next.js API Routes/tRPC)
        F[Servidor de Aplicação (Node.js)]
        G[Gerenciamento de Sessões]
        H[Validação de Requisições]
        I[Orquestrador de LLM Local]
    end

    subgraph Banco de Dados (PlanetScale/Supabase DB)
        J[Drizzle ORM]
        K[Dados de Usuário]
        L[Configurações de LLM]
        M[Histórico de Interações (Opcional)]
    end

    subgraph LLM Local (Máquina do Desenvolvedor)
        N[Ollama Server]
        O[Modelos LLM (Code Llama, Llama 3, etc.)]
        P[Agente de Programação Local]
    end

    subgraph Armazenamento de Arquivos (Cloudflare R2/Vercel Blob)
        Q[Binários de Modelos (Opcional)]
        R[Logs de Auditoria (Opcional)]
    end

    A -- Requisições HTTPS --> C
    B -- Requisições HTTPS --> C
    C -- Autentica & Roteia --> D
    D -- Valida Token --> F
    F -- Consulta/Persiste --> J
    J -- Conecta --> K
    F -- Orquestra --> I
    I -- Comunica via API/IPC --> N
    N -- Carrega --> O
    N -- Executa --> P
    P -- Interage com --> Código Local (IDE)
    F -- Armazena --> Q
    F -- Armazena --> R

Explicação Sucinta: O usuário interage com uma interface web ou um plugin de IDE. As requisições passam por um Edge Function para autenticação e roteamento eficiente. O backend, construído com Next.js/tRPC, gerencia a lógica de negócio e, crucialmente, atua como um orquestrador para o servidor Ollama rodando localmente na máquina do desenvolvedor. Isso garante que o código sensível nunca saia do ambiente local para a nuvem. O banco de dados (PlanetScale/Supabase) armazena configurações e dados de usuário, mas nunca o código-fonte em si.

3. Prompts Mestre por Categoria

Aqui estão os prompts cirúrgicos que o Zé Mané usaria para construir o CodeGuard AI, prontos para qualquer IA competente.

🏗️ Prompts de Arquitetura & Backend

Contexto Geral: Estamos construindo um backend robusto com Next.js API Routes e tRPC, usando Drizzle ORM para interagir com Supabase/PlanetScale. O componente crítico é a orquestração do Ollama local.

  1. Prompt: Estrutura Inicial do Projeto & tRPC Setup

    prompt
    Você é um arquiteto de software especialista em full-stack com Next.js 14, tRPC e Drizzle ORM.
**Tarefa:** Crie a estrutura inicial de um projeto Next.js 14 (App Router) com tRPC configurado para comunicação segura entre o frontend e o backend. Inclua a configuração básica do Drizzle ORM para um banco de dados PostgreSQL (compatível com Supabase/PlanetScale), com um esquema inicial para `User` (id, email, name, passwordHash) e `LLMConfig` (id, userId, modelName, ollamaApiUrl, maxTokens, temperature).
**Restrições:**
- Use `create-next-app` com TypeScript.
- Configure tRPC com autenticação de contexto (simulada por enquanto, apenas um `userId` string).
- Drizzle ORM deve usar `drizzle-kit` para migrações.
- Inclua um exemplo de `api/trpc/[trpc]/route.ts` e um `server/routers/_app.ts` com um `userRouter` e um `llmConfigRouter` básicos (apenas `getAll` e `create`).
- Adicione um `schema.ts` para o Drizzle.
**Formato de Saída:** Estrutura de diretórios, snippets de código para os arquivos mencionados, e instruções de instalação.

  2. Prompt: Serviço de Orquestração Ollama Local

    prompt
    Você é um engenheiro de backend experiente em Node.js e comunicação interprocessos.
**Tarefa:** Desenvolva o esqueleto de um serviço Node.js (ou uma API Route em Next.js) que atue como orquestrador para o servidor Ollama rodando localmente. Este serviço deve ser capaz de:
1.  Receber uma requisição do frontend com o código a ser processado e as configurações do LLM (modelo, temperatura, etc.).
2.  Validar as configurações e o código.
3.  Fazer uma requisição HTTP para o endpoint do Ollama (ex: `http://localhost:11434/api/generate`) com o prompt formatado (incluindo o código).
4.  Processar a resposta do Ollama e retorná-la ao frontend.
**Contexto:** O `ollamaApiUrl` virá do `LLMConfig` do usuário.
**Restrições:**
- Use `node-fetch` ou `axios` para as requisições HTTP.
- Implemente tratamento de erros básico (Ollama não disponível, resposta inválida).
- O prompt deve ser construído dinamicamente, permitindo injeção do código e da tarefa (ex: "refatorar", "otimizar", "gerar testes").
**Formato de Saída:** Um arquivo `server/services/ollamaService.ts` com a função principal de orquestração e um exemplo de como chamá-la de um procedimento tRPC.

  3. Prompt: Autenticação e Autorização (Auth.js)

    prompt
    Você é um especialista em segurança web e Next.js.
**Tarefa:** Implemente autenticação e autorização para o CodeGuard AI usando Auth.js (NextAuth.js) com um provedor de credenciais (email/senha) e um provedor social (GitHub, por exemplo).
**Contexto:**
- A autenticação deve ser integrada com o esquema `User` do Drizzle ORM.
- As sessões devem ser armazenadas de forma segura.
- Proteja as rotas de API e páginas sensíveis.
**Restrições:**
- Use Next.js 14 App Router.
- Inclua hashing de senha com `bcrypt` para o provedor de credenciais.
- Mostre como proteger um procedimento tRPC e uma página do App Router.
**Formato de Saída:** Arquivo `app/api/auth/[...nextauth]/route.ts`, `auth.ts` (configuração), `lib/auth.ts` (funções auxiliares), e exemplos de uso em um componente React e um procedimento tRPC.

🎨 Prompts de Frontend & Design

Contexto Geral: Frontend com Next.js 14, React 19 (se disponível), Tailwind v4, shadcn/ui e Radix UI para componentes acessíveis e um design minimalista dark.

  1. Prompt: Componente CodeEditor com Monaco Editor

    prompt
    Você é um engenheiro de frontend com expertise em React, Next.js e editores de código.
**Tarefa:** Crie um componente React (`CodeEditor`) que encapsule o Monaco Editor, otimizado para Next.js 14 (App Router). Este componente deve:
1.  Carregar o Monaco Editor dinamicamente (lazy load) para otimizar o bundle.
2.  Suportar diferentes linguagens de programação (JavaScript, TypeScript, Python, etc.).
3.  Permitir customização do tema (dark mode).
4.  Expor um `onChange` para obter o conteúdo do editor e um `value` prop para controlar o conteúdo.
**Restrições:**
- Use `react-monaco-editor` ou carregue o Monaco diretamente.
- Garanta que o componente seja amigável ao SSR (sem `window` no carregamento inicial).
- Integre com Tailwind CSS para estilização do container.
**Formato de Saída:** Arquivo `components/CodeEditor.tsx` e um exemplo de uso em uma página.

  2. Prompt: Layout Principal e Navegação (shadcn/ui)

    prompt
    Você é um designer de UI/UX e desenvolvedor frontend com maestria em Tailwind CSS e shadcn/ui.
**Tarefa:** Desenvolva o layout principal do CodeGuard AI, seguindo um estilo minimalista dark. Inclua:
1.  Um `Header` responsivo com o logo "CodeGuard AI" e navegação para "Dashboard", "Configurações", "Histórico" e um `UserDropdown` (com opções como "Perfil", "Sair").
2.  Um `Sidebar` colapsável para navegação secundária ou ferramentas contextuais.
3.  A área de conteúdo principal.
**Restrições:**
- Use exclusivamente componentes shadcn/ui (Button, DropdownMenu, Sheet, etc.).
- O tema deve ser dark-mode-first com Tailwind v4.
- Garanta acessibilidade (WCAG 2.2) para navegação e interações.
**Formato de Saída:** Arquivo `app/layout.tsx` (para o layout global), `components/ui/Header.tsx`, `components/ui/Sidebar.tsx`, e `components/ui/UserDropdown.tsx`.

  3. Prompt: Página de Configurações de LLM (Formulário Dinâmico)

    prompt
    Você é um desenvolvedor React expert em formulários complexos e validação.
**Tarefa:** Crie uma página de configurações de LLM (`app/dashboard/settings/llm/page.tsx`) que permita ao usuário gerenciar seus modelos Ollama. O formulário deve:
1.  Exibir uma lista de `LLMConfig` existentes (usando tRPC para buscar).
2.  Permitir adicionar um novo `LLMConfig` (modelName, ollamaApiUrl, maxTokens, temperature).
3.  Permitir editar e excluir configurações existentes.
4.  Usar `react-hook-form` com `zod` para validação.
**Restrições:**
- Use componentes shadcn/ui (Form, Input, Button, Select, Table, AlertDialog).
- Integre com os procedimentos tRPC `llmConfigRouter.getAll`, `create`, `update`, `delete`.
- O `ollamaApiUrl` deve ter um valor padrão `http://localhost:11434`.
**Formato de Saída:** Arquivo `app/dashboard/settings/llm/page.tsx` e um snippet do schema Zod para validação.

🔍 Prompts de SEO & Schema.org

Contexto Geral: O CodeGuard AI é um SaaS, então o SEO é crucial para atrair empresas e desenvolvedores que buscam privacidade.

  1. Prompt: Meta Tags Essenciais para a Landing Page

    prompt
    Você é um especialista em SEO técnico e marketing digital.
**Tarefa:** Crie as meta tags essenciais para a landing page do CodeGuard AI (`app/page.tsx`), focando em ranqueamento para termos como "IA local para código", "geração de código privada", "segurança LLM", "Ollama para empresas".
**Restrições:**
- Inclua `title`, `description`, `keywords` (otimizadas).
- Adicione meta tags Open Graph (`og:title`, `og:description`, `og:image`, `og:url`, `og:type`) e Twitter Card (`twitter:card`, `twitter:site`, `twitter:creator`).
- Otimize para Core Web Vitals (descrições concisas, imagens de alta qualidade).
**Formato de Saída:** Snippet de código React para o componente `Metadata` em `app/page.tsx`.

  2. Prompt: Dados Estruturados SoftwareApplication e Article

    prompt
    Você é um guru de Schema.org e dados estruturados.
**Tarefa:** Gere o JSON-LD para a landing page do CodeGuard AI.
1.  Um objeto `SoftwareApplication` descrevendo o CodeGuard AI (nome, descrição, sistema operacional, preço, avaliações fictícias).
2.  Um objeto `Article` para o conteúdo principal da landing page, destacando os benefícios de privacidade e segurança.
**Restrições:**
- Use as propriedades mais relevantes para cada tipo.
- Inclua um `aggregateRating` fictício para o `SoftwareApplication`.
- O `Article` deve ter `headline`, `image`, `datePublished`, `author`, `publisher`.
**Formato de Saída:** Dois blocos de JSON-LD para serem inseridos no `<head>` da página.

  3. Prompt: Sitemap XML e Robots.txt

    prompt
    Você é um especialista em rastreamento e indexação de sites.
**Tarefa:** Crie um `sitemap.xml` e um `robots.txt` otimizados para o CodeGuard AI.
**Contexto:**
- Páginas principais: `/`, `/dashboard`, `/settings`, `/pricing`, `/blog` (fictício, para artigos de conteúdo).
- As rotas `/dashboard` e `/settings` são protegidas por autenticação e não devem ser indexadas.
**Restrições:**
- O `sitemap.xml` deve incluir `loc`, `lastmod`, `changefreq`, `priority`.
- O `robots.txt` deve bloquear rotas sensíveis e apontar para o sitemap.
**Formato de Saída:** Conteúdo completo dos arquivos `public/sitemap.xml` e `public/robots.txt`.

⚡ Prompts de Performance & Core Web Vitals

Contexto Geral: Performance é um diferencial. Precisamos garantir que o CodeGuard AI seja rápido e responsivo, mesmo com o Monaco Editor.

  1. Prompt: Otimização de Imagens e Fontes

    prompt
    Você é um engenheiro de performance web obcecado por Core Web Vitals.
**Tarefa:** Descreva e forneça snippets para otimizar o carregamento de imagens e fontes no CodeGuard AI.
**Imagens:**
- Como usar o `next/image` para imagens responsivas e lazy loading.
- Recomendação para formatos AVIF/WebP.
**Fontes:**
- Como usar `next/font` para otimização de carregamento de fontes (Google Fonts ou customizadas).
- Estratégias para font subsetting e `font-display: swap`.
**Restrições:**
- Foco em LCP (Largest Contentful Paint) e CLS (Cumulative Layout Shift).
- Exemplos práticos para Next.js 14.
**Formato de Saída:** Explicação detalhada e snippets de código para `next/image` e `next/font` no `layout.tsx` ou componentes.

  2. Prompt: Estratégias de Bundle Splitting e Lazy Loading

    prompt
    Você é um mestre em otimização de JavaScript e performance de carregamento.
**Tarefa:** Detalhe e exemplifique estratégias de bundle splitting e lazy loading para o CodeGuard AI, com foco no Monaco Editor e outros componentes pesados.
**Restrições:**
- Use `React.lazy` e `Suspense` para componentes React.
- Use `next/dynamic` para importação dinâmica em Next.js.
- Explique como identificar e otimizar "chunks" grandes.
**Formato de Saída:** Explicação técnica e snippets de código para lazy loading do `CodeEditor` e outros módulos.

  3. Prompt: Critical CSS e Edge Caching

    prompt
    Você é um especialista em otimização de CSS e infraestrutura de rede.
**Tarefa:** Explique como implementar Critical CSS e configurar Edge Caching para o CodeGuard AI, visando melhorar o FCP (First Contentful Paint) e a responsividade geral.
**Critical CSS:**
- Descreva a técnica e como ela se aplica a um projeto Next.js/Tailwind.
- Como garantir que o CSS essencial seja carregado inline.
**Edge Caching:**
- Como configurar cache para assets estáticos e rotas de API em Vercel e Cloudflare Workers.
- Estratégias de `Cache-Control` headers.
**Restrições:**
- Foco em Next.js 14 e as plataformas Vercel/Cloudflare.
- Sem ferramentas de terceiros complexas, focar em configurações nativas.
**Formato de Saída:** Explicação conceitual e exemplos de configuração para `next.config.js` (se aplicável), headers HTTP e Cloudflare Workers.

🚀 Prompts de Deploy & DevOps

Contexto Geral: Deploy contínuo e escalável em Vercel, com Cloudflare Workers para edge functions e Supabase/PlanetScale para banco de dados.

  1. Prompt: Configuração de CI/CD para Vercel

    prompt
    Você é um engenheiro de DevOps com experiência em Vercel e GitHub Actions.
**Tarefa:** Crie um arquivo de configuração GitHub Actions para CI/CD do CodeGuard AI no Vercel.
**Funcionalidades:**
- Build e deploy automáticos para o ambiente de preview em cada PR.
- Build e deploy automáticos para produção no merge para `main`.
- Instalação de dependências, linting e testes (simulados).
- Exposição de variáveis de ambiente seguras.
**Restrições:**
- Use `vercel-action`.
- Inclua passos para `npm install`, `npm run lint`, `npm run build`.
- Variáveis de ambiente como `SUPABASE_URL`, `SUPABASE_ANON_KEY`, `AUTH_SECRET`, `GITHUB_ID`, `GITHUB_SECRET`.
**Formato de Saída:** Arquivo `.github/workflows/deploy.yml`.

  2. Prompt: Monitoramento e Observabilidade Básica

    prompt
    Você é um especialista em monitoramento de aplicações e performance.
**Tarefa:** Descreva como configurar monitoramento e observabilidade básica para o CodeGuard AI, focando em Vercel Analytics, Sentry (para erros) e logs.
**Restrições:**
- Sem ferramentas de APM complexas.
- Foco em soluções de baixo custo ou gratuitas para startups.
- Como integrar Sentry em um projeto Next.js.
**Formato de Saída:** Explicação dos passos, snippets para `sentry.client.config.ts`, `sentry.server.config.ts`, `sentry.edge.config.ts` e como interpretar logs no Vercel.

  3. Prompt: Configuração de Cloudflare Workers para Proxy e Segurança

    prompt
    Você é um engenheiro de rede e segurança com maestria em Cloudflare Workers.
**Tarefa:** Crie um Cloudflare Worker que atue como um proxy reverso para a API do CodeGuard AI, adicionando headers de segurança (CSP, HSTS) e talvez um rate limiting básico.
**Restrições:**
- O Worker deve interceptar requisições para `/api/*`.
- Adicionar `Content-Security-Policy`, `Strict-Transport-Security`, `X-Content-Type-Options`, `X-Frame-Options`.
- Implementar um rate limiting simples baseado em IP (usando `waitUntil` e KV Store, se necessário, ou apenas um contador em memória para o exemplo).
**Formato de Saída:** Código completo do Cloudflare Worker (`worker.ts`) e instruções de deploy.

4. Prompt Único Completo

Este é o mega-prompt, o prompt supremo que o Zé Mané usaria para gerar o esqueleto completo do CodeGuard AI de uma vez só.

prompt
Você é o Zé Mané, um engenheiro de software full-stack autodidata e genial, especialista em Next.js 14, tRPC, Drizzle ORM, Tailwind CSS, shadcn/ui, Auth.js, Ollama e arquiteturas de privacidade. Seu objetivo é construir o esqueleto completo do "CodeGuard AI", uma plataforma que permite a desenvolvedores usar LLMs localmente para geração e refatoração de código, garantindo privacidade e segurança.

**Contexto do Projeto:**
- **Nome:** CodeGuard AI
- **Problema:** Geração de código com IA sem comprometer privacidade e IP sensível, rodando LLMs localmente.
- **Stack:** Next.js 14 (App Router), React 19 (se disponível), tRPC, Drizzle ORM, Supabase/PlanetScale (PostgreSQL), Tailwind v4, shadcn/ui, Radix UI, Auth.js, Ollama (servidor local), Monaco Editor, Vercel, GitHub Actions.
- **Features Core:** Agente de programação local com Ollama, UI para configurar LLMs, geração/refatoração de código privada, otimização, análise de segurança local, integração com IDEs (esqueleto).
- **Público-alvo:** Empresas com IP sensível, fintechs, healthtechs.
- **Estilo de Design:** Minimalista dark.
- **Complexidade:** Avançado.

**Tarefa Principal:**
Gere a estrutura completa do projeto Next.js 14, incluindo os seguintes componentes e configurações:

1.  **Configuração Base:**
    *   Projeto Next.js 14 (App Router, TypeScript).
    *   Tailwind CSS v4 configurado (dark mode first).
    *   shadcn/ui inicializado e configurado.
    *   Drizzle ORM configurado para PostgreSQL com `schema.ts` para `User` (id, email, passwordHash, name) e `LLMConfig` (id, userId, modelName, ollamaApiUrl, maxTokens, temperature, createdAt, updatedAt). Inclua `drizzle-kit` config.

2.  **Autenticação (Auth.js):**
    *   `app/api/auth/[...nextauth]/route.ts` com provedor de credenciais (email/senha, usando `bcrypt` para hash) e GitHub OAuth.
    *   `auth.ts` e `lib/auth.ts` para helpers de sessão e proteção de rotas.

3.  **Backend (tRPC & Orquestração Ollama):**
    *   Configuração tRPC (`api/trpc/[trpc]/route.ts`, `server/routers/_app.ts`, `server/trpc.ts`).
    *   `userRouter` com `getProfile` (protegido).
    *   `llmConfigRouter` com `getAll`, `create`, `update`, `delete` (protegidos, interagindo com Drizzle).
    *   `server/services/ollamaService.ts`: Função `interactWithOllama` que recebe `code`, `promptInstruction`, `llmConfig` e faz uma requisição `POST` para o endpoint local do Ollama (`ollamaApiUrl/api/generate`). Deve retornar a resposta processada. Inclua tratamento de erro para Ollama indisponível.
    *   `codeGenerationRouter`: Um procedimento tRPC `generateCode` que recebe `code`, `instruction`, `llmConfigId`, chama `ollamaService.interactWithOllama` e retorna o resultado.

4.  **Frontend (UI & Interação):**
    *   `app/layout.tsx`: Layout principal com `Header` (logo, navegação, `UserDropdown` com Auth.js `signOut`), `Sidebar` (links para Dashboard, Configurações, Histórico). Minimalista dark.
    *   `app/page.tsx`: Landing page básica com texto de introdução, meta tags SEO e dados estruturados `SoftwareApplication`.
    *   `app/dashboard/page.tsx`: Página principal do dashboard.
        *   Componente `CodeEditor.tsx` (lazy loaded com `next/dynamic`, encapsulando Monaco Editor, suporte a linguagens, dark theme).
        *   Formulário para input de `promptInstruction` e seleção de `LLMConfig` (usando tRPC para buscar configs).
        *   Área para exibir o código gerado/refatorado.
        *   Botão "Gerar Código" que chama o procedimento tRPC `codeGenerationRouter.generateCode`.
    *   `app/dashboard/settings/llm/page.tsx`: Página de gerenciamento de `LLMConfig` (CRUD via tRPC, `react-hook-form`, `zod`, shadcn/ui Table, Dialog, Form).

5.  **Performance & SEO:**
    *   Otimização de imagens (`next/image`) e fontes (`next/font`).
    *   Sitemap (`public/sitemap.xml`) e Robots.txt (`public/robots.txt`) com bloqueio de rotas protegidas.
    *   Meta tags Open Graph e Twitter Card na landing page.

6.  **Deploy & DevOps:**
    *   Arquivo `.github/workflows/deploy.yml` para CI/CD no Vercel (build, lint, deploy preview/production).
    *   Configuração de variáveis de ambiente (`.env.local.example`).

**Restrições Adicionais:**
- Todos os componentes devem usar shadcn/ui e Tailwind CSS.
- Garanta acessibilidade (WCAG 2.2) para todos os componentes interativos.
- Use `use client` e `use server` corretamente para o App Router.
- Inclua placeholders para lógica de erro e loading states.
- O código deve ser limpo, modular e seguir as melhores práticas de TypeScript.
- Não inclua lógica de integração com IDEs, apenas o esqueleto da plataforma web.
- O foco é a estrutura e a integração das tecnologias, não a lógica de negócio completa.

**Formato de Saída:**
- Estrutura de diretórios completa.
- Conteúdo dos arquivos-chave (código completo ou snippets representativos).
- Instruções claras para setup e execução.
- Um `.env.local.example` com todas as variáveis necessárias.

5. Stack Mínima Viável

Para lançar o CodeGuard AI em 48 horas (sim, Zé Mané é rápido no gatilho!), esta é a stack que você precisa dominar:

  1. Next.js 14 (App Router): O framework para o frontend e backend (API Routes).
  2. Tailwind CSS v4 & shadcn/ui: Estilização e componentes UI robustos e acessíveis.
  3. tRPC: Tipagem end-to-end para APIs seguras e eficientes.
  4. Drizzle ORM: ORM leve e tipado para interações com o banco de dados.
  5. Supabase / PlanetScale: Banco de dados PostgreSQL escalável.
  6. Auth.js (NextAuth.js): Autenticação completa e segura.
  7. Ollama: Plataforma para rodar LLMs localmente.
  8. Vercel: Plataforma de deploy e hosting.

6. Checklist de Lançamento

Antes de apertar o botão de "Go Live", Zé Mané sempre segue este checklist para garantir que a coisa vai pro ar sem sustos:

  1. ✅ Variáveis de Ambiente: Todas as variáveis ENV configuradas corretamente no Vercel (e no .env.local para desenvolvimento).
  2. ✅ Testes de Autenticação: Login, logout, registro, e acesso a rotas protegidas funcionando perfeitamente.
  3. ✅ Conectividade com Banco de Dados: Drizzle ORM conectando e realizando operações CRUD básicas. Migrações aplicadas.
  4. ✅ Integração Ollama: Teste de ponta a ponta da orquestração com o Ollama local. O servidor Ollama deve estar rodando e respondendo.
  5. ✅ Performance (Lighthouse): Score acima de 90 em Performance, Acessibilidade, Melhores Práticas e SEO no Lighthouse para a landing page e as principais rotas.
  6. ✅ Responsividade: Layout funcionando em desktops, tablets e celulares (testado em diferentes tamanhos de tela).
  7. ✅ Acessibilidade (WCAG 2.2): Navegação por teclado, contraste de cores, labels de formulário e atributos ARIA verificados.
  8. ✅ SEO Técnico: sitemap.xml e robots.txt acessíveis e configurados. Meta tags e JSON-LD presentes nas páginas públicas.
  9. ✅ Monitoramento de Erros: Sentry (ou similar) configurado e capturando erros no frontend e backend.
  10. ✅ CI/CD Funcional: O pipeline do GitHub Actions rodou com sucesso no main e fez o deploy para produção.

Com essa estrutura e esses prompts, não tem erro! O CodeGuard AI vai ser um sucesso, garantindo que a inovação da IA chegue aos desenvolvedores sem comprometer o que é mais valioso: a privacidade e a segurança do seu código. Agora vai lá e bota pra fazer!

Compartilhar