Bolt.new: Deploy na Netlify e Configuração de Produção

Seu app está funcionando no Bolt — agora é hora de colocá-lo em produção. O Bolt tem integração nativa com Netlify, mas também suporta outros destinos de deploy.

Opção 1: Deploy direto do Bolt

A forma mais rápida:

1. Clique no botão Deploy no menu superior do Bolt
2. Autorize o Bolt a acessar sua conta Netlify
3. O Bolt faz build e deploy automaticamente
4. Você recebe uma URL como https://seu-app.netlify.app

Cada vez que você fizer mudanças no Bolt e clicar em Deploy, a Netlify atualiza automaticamente.

Opção 2: GitHub + Netlify (CI/CD)

Para deploy automático a cada commit:

Passo 1: Export para GitHub

No Bolt, clique em Connect to GitHub → Create repository. O Bolt vai commitar todo o código.

Passo 2: Importar na Netlify

1. Acesse app.netlify.com → Add new site → Import from Git
2. Selecione o repositório do GitHub
3. Configure o build:

- Build command: npm run build

- Publish directory: dist

1. Clique em Deploy site

Agora cada push no GitHub dispara um deploy automático na Netlify.

Configurando variáveis de ambiente na Netlify

Acesse Site settings → Environment variables e adicione:

VITE_SUPABASE_URL         → URL do seu projeto Supabase
VITE_SUPABASE_ANON_KEY    → Chave anon do Supabase
VITE_STRIPE_PUBLIC_KEY    → Chave pública do Stripe

Atenção: Variáveis com prefixo VITE_ ficam no bundle do frontend — nunca coloque chaves secretas aqui.

Backend em produção

Se seu app tem um servidor Express, o Netlify não hospeda Node.js da mesma forma. Opções:

Netlify Functions

Converta seus endpoints para Netlify Functions serverless:

Converta os endpoints do Express para Netlify Functions:
- Crie pasta netlify/functions/
- Cada arquivo é uma function: get-posts.js, create-post.js, etc.
- Use o formato exports.handler = async (event) => {}
- Configure redirects em netlify.toml para /api/* → /.netlify/functions/*

Railway ou Render (backend separado)

Alternativamente, mantenha o backend Express separado:

1. Faça deploy do servidor na Railway ou Render
2. Configure a URL do backend como variável de ambiente no Netlify: VITE_API_URL
3. O frontend faz fetch para a URL do backend

Domínio customizado na Netlify

1. Vá em Domain settings → Add custom domain
2. Digite seu domínio
3. Adicione o CNAME your-site.netlify.app no seu registrador
4. A Netlify provisiona SSL automáticamente (Let s Encrypt)

Preview Deploys

A Netlify gera automaticamente uma URL de preview para cada pull request — ótimo para revisar mudanças antes de ir para produção.

Checklist de produção

• [ ] Variáveis de ambiente configuradas na Netlify
• [ ] Build rodando sem erros (npm run build localmente)
• [ ] TypeScript sem erros (npx tsc --noEmit)
• [ ] Supabase em modo produção
• [ ] Domínio com SSL ativo
• [ ] Backend deployado (se necessário)
• [ ] Monitoramento configurado (Netlify Analytics ou similar)

Com esse setup, você tem CI/CD profissional — cada commit vira deploy automático.