Pular para o conteúdo

Obra360

Documentação técnica

Nesta página

Configuração

Este guia descreve todas as variáveis de ambiente do template, como habilitar cada integração opcional e como fazer o deploy.

Variáveis de ambiente

Todas as variáveis ficam no arquivo .env (use .env.example como base).

Variável Obrigatória Descrição
DATABASE_URL Sim Connection string do PostgreSQL usada pelo Prisma
NEXTAUTH_SECRET Sim Secret do NextAuth (gere com openssl rand -base64 32)
NEXTAUTH_URL Sim URL base da aplicação (ex.: http://localhost:3000)
NEXT_PUBLIC_APP_URL Recomendada URL pública do site, usada em metadata, sitemap e robots
SITE_URL Recomendada Fallback de NEXT_PUBLIC_APP_URL; mantenha as duas com o mesmo valor
SITE_NAME Não Nome do site exibido em títulos e metadata
AUTHOR_NAME Não Nome do autor padrão usado em metadata
GOOGLE_CLIENT_ID / GOOGLE_CLIENT_SECRET Não Login social com Google (habilitado só se definidas)
RESEND_API_KEY / RESEND_FROM / INVITATION_TOKEN_SECRET Sim* Convites fechados; obrigatório antes de convidar a equipe
EMAIL_SERVER_HOST / EMAIL_SERVER_PORT / EMAIL_SERVER_USER / EMAIL_SERVER_PASSWORD / EMAIL_FROM Não SMTP usado somente na recuperação de senha
NEXT_PUBLIC_SANITY_PROJECT_ID Com Sanity ID do projeto no Sanity
NEXT_PUBLIC_SANITY_PROJECT_TITLE Não Título exibido no Sanity Studio
SANITY_API_KEY Com Sanity Token de API do Sanity
SANITY_HOOK_SECRET Não Secret do webhook de revalidação do blog
STRIPE_SECRET_KEY / STRIPE_PUBLISHABLE_KEY Com Stripe Chaves da conta Stripe
NEXT_PUBLIC_STRIPE_PRICE_STARTER / NEXT_PUBLIC_STRIPE_PRICE_PRO / NEXT_PUBLIC_STRIPE_PRICE_BUSINESS Com Stripe IDs dos preços recorrentes exibidos em /pricing
OPENAI_API_KEY Com OpenAI Chave de API da OpenAI para os exemplos de IA
GOOGLE_SITE_VERIFICATION Não Código de verificação do Google Search Console

Integrações

As integrações são ligadas e desligadas no arquivo integrations.config.tsx, na raiz do projeto:

const integrations = {
  isSanityEnabled: true,
  isStripeEnabled: false,
  isOpenAIEnabled: false,
  isMailchimpEnabled: false,
  isAuthEnabled: true,
};

Quando uma integração está desligada, a UI exibe um aviso e as API routes correspondentes retornam 503.

Sanity CMS (blog)

  1. Crie um projeto em sanity.io e copie o Project ID.
  2. Preencha NEXT_PUBLIC_SANITY_PROJECT_ID e SANITY_API_KEY no .env.
  3. Ative isSanityEnabled em integrations.config.tsx.
  4. Acesse o Studio em /admin para criar posts, autores e categorias.
  5. (Opcional) Configure o webhook de revalidação seguindo o guia SANITY_WEBHOOK_SETUP.md na raiz do projeto.

Stripe (pagamentos)

  1. Crie uma conta em stripe.com e copie as chaves do modo de teste.
  2. Preencha STRIPE_SECRET_KEY, STRIPE_PUBLISHABLE_KEY e os três IDs NEXT_PUBLIC_STRIPE_PRICE_* no .env.
  3. Ative isStripeEnabled em integrations.config.tsx.
  4. Confira os cards e o checkout em /pricing usando as chaves de teste.
  5. Entre como administrador e confira /dashboard/financeiro. Essa página oferece uma visão operacional somente leitura de receita estimada, assinaturas, clientes, saldo e faturas recentes. Operações sensíveis continuam no Dashboard do Stripe.

Com isStripeEnabled: false, o servidor não consulta a API do Stripe: a página de preços bloqueia o checkout e o painel financeiro mostra as instruções de configuração. Nunca exponha STRIPE_SECRET_KEY ao cliente.

OpenAI (exemplos de IA)

  1. Gere uma chave em platform.openai.com.
  2. Preencha OPENAI_API_KEY no .env.
  3. Ative isOpenAIEnabled em integrations.config.tsx.
  4. Os exemplos ficam disponíveis em /ai-examples (requer usuário autenticado).

Interface do aplicativo

O padrão visual e de interação está documentado em DESIGN_SYSTEM.md, na raiz do projeto. Leia esse arquivo antes de criar ou alterar telas.

  • Use ícones de lucide-react em navegação, botões, estados e cards. Não use emojis como ícones estruturais.
  • Mantenha controles clicáveis com pelo menos 44 × 44 px, foco visível e rótulos acessíveis.
  • A barra lateral do dashboard é colapsável no desktop, persiste a preferência localmente e vira um painel móvel em telas pequenas.
  • Prefira Server Components e isole interatividade em pequenos componentes client.

Deploy

O template funciona em qualquer plataforma que suporte Next.js (Vercel, Railway, Render etc.). Checklist geral:

  1. Configure todas as variáveis de ambiente na plataforma, incluindo NEXT_PUBLIC_APP_URL e SITE_URL com o domínio de produção.
  2. Aponte DATABASE_URL para o banco de produção e rode as migrations com npm run db:deploy (executa prisma migrate deploy).
  3. O build (npm run build) já roda prisma generate automaticamente via prebuild.
  4. Após o primeiro deploy, verifique https://seu-dominio.com/sitemap.xml e https://seu-dominio.com/robots.txt.
  5. Se usar Sanity, cadastre a URL de produção no CORS do projeto Sanity e configure o webhook de revalidação.