215 lines
4.0 KiB
Markdown
215 lines
4.0 KiB
Markdown
# Deploy na Vercel - SteelBook
|
|
|
|
## 🚀 Pré-requisitos
|
|
|
|
- Conta no GitHub
|
|
- Conta na Vercel
|
|
- Código commitado no GitHub
|
|
|
|
## 📋 Passos para Deploy
|
|
|
|
### 1. Preparar o Repositório
|
|
|
|
```bash
|
|
# Verificar se tudo está commitado
|
|
git status
|
|
|
|
# Fazer commit final
|
|
git add .
|
|
git commit -m "Otimizações de performance e reorganização"
|
|
|
|
# Push para GitHub
|
|
git push origin main
|
|
```
|
|
|
|
### 2. Conectar na Vercel
|
|
|
|
#### Opção A: Via CLI (Recomendado)
|
|
|
|
```bash
|
|
# Instalar Vercel CLI
|
|
npm i -g vercel
|
|
|
|
# Fazer login
|
|
vercel login
|
|
|
|
# Deploy
|
|
vercel
|
|
|
|
# Seguir as instruções interativas
|
|
```
|
|
|
|
#### Opção B: Via Dashboard
|
|
|
|
1. Acesse [vercel.com](https://vercel.com)
|
|
2. Clique em "New Project"
|
|
3. Selecione seu repositório GitHub
|
|
4. Configure as variáveis de ambiente
|
|
5. Clique em "Deploy"
|
|
|
|
### 3. Configurar Variáveis de Ambiente
|
|
|
|
Na Vercel, adicione as seguintes variáveis:
|
|
|
|
```
|
|
VITE_SUPABASE_URL=https://seu-projeto.supabase.co
|
|
VITE_SUPABASE_ANON_KEY=sua-chave-anonima
|
|
```
|
|
|
|
### 4. Verificar Deploy
|
|
|
|
```bash
|
|
# Após o deploy, você receberá uma URL
|
|
# Exemplo: https://steelbook.vercel.app
|
|
|
|
# Verificar status
|
|
vercel status
|
|
```
|
|
|
|
## 🔄 Atualizações Futuras
|
|
|
|
Após o primeiro deploy, qualquer push para `main` acionará um novo deploy automaticamente.
|
|
|
|
```bash
|
|
# Fazer mudanças
|
|
git add .
|
|
git commit -m "Descrição das mudanças"
|
|
git push origin main
|
|
|
|
# Vercel fará deploy automaticamente
|
|
```
|
|
|
|
## 🔐 Segurança
|
|
|
|
### Variáveis de Ambiente
|
|
- ✅ Nunca commitar `.env`
|
|
- ✅ Usar `.env.example` como template
|
|
- ✅ Adicionar variáveis na Vercel dashboard
|
|
|
|
### Chaves de API
|
|
- ✅ Usar ANON_KEY no cliente
|
|
- ✅ SERVICE_ROLE_KEY apenas no servidor
|
|
- ✅ Rotacionar chaves regularmente
|
|
|
|
## 📊 Monitoramento
|
|
|
|
### Vercel Analytics
|
|
1. Acesse seu projeto na Vercel
|
|
2. Vá para "Analytics"
|
|
3. Monitore:
|
|
- Performance
|
|
- Uptime
|
|
- Requests
|
|
|
|
### Logs
|
|
```bash
|
|
# Ver logs em tempo real
|
|
vercel logs
|
|
|
|
# Ver logs de um deployment específico
|
|
vercel logs [deployment-url]
|
|
```
|
|
|
|
## 🐛 Troubleshooting
|
|
|
|
### Build falha
|
|
```bash
|
|
# Verificar logs
|
|
vercel logs
|
|
|
|
# Fazer rebuild
|
|
vercel rebuild
|
|
```
|
|
|
|
### Variáveis não carregam
|
|
```bash
|
|
# Verificar variáveis
|
|
vercel env list
|
|
|
|
# Adicionar variável
|
|
vercel env add VITE_SUPABASE_URL
|
|
```
|
|
|
|
### Performance lenta
|
|
1. Verificar bundle size: `npm run build:analyze`
|
|
2. Verificar React Query cache
|
|
3. Verificar queries do Supabase
|
|
|
|
## 📈 Otimizações Pós-Deploy
|
|
|
|
### 1. Habilitar Compression
|
|
- Vercel habilita gzip automaticamente
|
|
- Verificar em "Settings" > "Compression"
|
|
|
|
### 2. Habilitar Caching
|
|
- Configurar cache headers
|
|
- Usar `vercel.json` para regras customizadas
|
|
|
|
### 3. Monitorar Performance
|
|
- Usar Vercel Analytics
|
|
- Usar Google PageSpeed Insights
|
|
- Usar Lighthouse
|
|
|
|
## 📝 Arquivo vercel.json (Opcional)
|
|
|
|
```json
|
|
{
|
|
"buildCommand": "npm run build",
|
|
"devCommand": "npm run dev",
|
|
"installCommand": "npm install",
|
|
"framework": "vite",
|
|
"env": {
|
|
"VITE_SUPABASE_URL": "@supabase_url",
|
|
"VITE_SUPABASE_ANON_KEY": "@supabase_key"
|
|
}
|
|
}
|
|
```
|
|
|
|
## 🎯 Checklist de Deploy
|
|
|
|
- [ ] Código commitado no GitHub
|
|
- [ ] Variáveis de ambiente configuradas
|
|
- [ ] Build local testado (`npm run build`)
|
|
- [ ] Sem erros de TypeScript (`npm run type-check`)
|
|
- [ ] Sem warnings de linting (`npm run lint`)
|
|
- [ ] Vercel CLI instalado
|
|
- [ ] Conta Vercel criada
|
|
- [ ] Repositório conectado
|
|
- [ ] Deploy realizado
|
|
- [ ] URL acessível
|
|
- [ ] Funcionalidades testadas
|
|
|
|
## 🚀 Comandos Úteis
|
|
|
|
```bash
|
|
# Deploy
|
|
vercel
|
|
|
|
# Deploy em produção
|
|
vercel --prod
|
|
|
|
# Listar deployments
|
|
vercel list
|
|
|
|
# Remover deployment
|
|
vercel remove [deployment-url]
|
|
|
|
# Ver configurações
|
|
vercel inspect
|
|
|
|
# Abrir projeto no navegador
|
|
vercel open
|
|
```
|
|
|
|
## 📞 Suporte
|
|
|
|
- Documentação Vercel: https://vercel.com/docs
|
|
- Suporte Vercel: https://vercel.com/support
|
|
- Discord Vercel: https://discord.gg/vercel
|
|
|
|
## ✅ Status
|
|
|
|
**Pronto para Deploy! 🎉**
|
|
|
|
O aplicativo está otimizado e pronto para ser deployado na Vercel.
|