282 lines
5.7 KiB
Markdown
282 lines
5.7 KiB
Markdown
# 🚀 Guia Rápido de Deploy
|
|
|
|
## ✅ Pré-requisitos
|
|
|
|
- ✅ Conta no Vercel ou Netlify (gratuita)
|
|
- ✅ Git instalado (opcional)
|
|
- ✅ Navegador web
|
|
|
|
---
|
|
|
|
## 🎯 Opção 1: Deploy via Interface Web (MAIS FÁCIL)
|
|
|
|
### Vercel
|
|
|
|
1. **Acesse**: https://vercel.com
|
|
2. **Faça login** com GitHub, GitLab ou email
|
|
3. **Clique em** "Add New..." → "Project"
|
|
4. **Importe** seu repositório Git OU
|
|
5. **Arraste** a pasta do projeto para o site
|
|
6. **Clique em** "Deploy"
|
|
7. **Pronto!** Seu site estará no ar em ~30 segundos
|
|
|
|
**URL**: `https://seu-projeto.vercel.app`
|
|
|
|
### Netlify
|
|
|
|
1. **Acesse**: https://netlify.com
|
|
2. **Faça login** com GitHub, GitLab ou email
|
|
3. **Arraste** a pasta do projeto para a área "Drop"
|
|
4. **Aguarde** o upload e deploy
|
|
5. **Pronto!** Seu site estará no ar
|
|
|
|
**URL**: `https://seu-projeto.netlify.app`
|
|
|
|
---
|
|
|
|
## 🎯 Opção 2: Deploy via CLI (Mais Controle)
|
|
|
|
### Vercel CLI
|
|
|
|
```bash
|
|
# 1. Instalar Vercel CLI (uma vez)
|
|
npm install -g vercel
|
|
|
|
# 2. Fazer login
|
|
vercel login
|
|
|
|
# 3. Na pasta do projeto, executar
|
|
vercel
|
|
|
|
# 4. Seguir as instruções:
|
|
# - Set up and deploy? Yes
|
|
# - Which scope? Sua conta
|
|
# - Link to existing project? No
|
|
# - Project name? aco-calc-pro (ou outro)
|
|
# - Directory? ./
|
|
# - Override settings? No
|
|
|
|
# 5. Para produção
|
|
vercel --prod
|
|
```
|
|
|
|
### Netlify CLI
|
|
|
|
```bash
|
|
# 1. Instalar Netlify CLI (uma vez)
|
|
npm install -g netlify-cli
|
|
|
|
# 2. Fazer login
|
|
netlify login
|
|
|
|
# 3. Na pasta do projeto, executar
|
|
netlify deploy
|
|
|
|
# 4. Seguir as instruções:
|
|
# - Create & configure a new site? Yes
|
|
# - Team? Sua conta
|
|
# - Site name? aco-calc-pro (ou outro)
|
|
# - Publish directory? . (ponto)
|
|
|
|
# 5. Para produção
|
|
netlify deploy --prod
|
|
```
|
|
|
|
---
|
|
|
|
## 🎯 Opção 3: Deploy via Git (Automático)
|
|
|
|
### 1. Criar Repositório no GitHub
|
|
|
|
```bash
|
|
# Na pasta do projeto:
|
|
git init
|
|
git add .
|
|
git commit -m "Initial commit"
|
|
git branch -M main
|
|
git remote add origin https://github.com/seu-usuario/aco-calc-pro.git
|
|
git push -u origin main
|
|
```
|
|
|
|
### 2. Conectar ao Vercel
|
|
|
|
1. Acesse https://vercel.com
|
|
2. Clique em "Add New..." → "Project"
|
|
3. Selecione seu repositório do GitHub
|
|
4. Clique em "Deploy"
|
|
5. **Deploy automático** a cada push!
|
|
|
|
### 3. Conectar ao Netlify
|
|
|
|
1. Acesse https://netlify.com
|
|
2. Clique em "Add new site" → "Import an existing project"
|
|
3. Selecione GitHub
|
|
4. Selecione seu repositório
|
|
5. Clique em "Deploy site"
|
|
6. **Deploy automático** a cada push!
|
|
|
|
---
|
|
|
|
## ⚙️ Configurações Importantes
|
|
|
|
### Variáveis de Ambiente (Nenhuma necessária!)
|
|
|
|
Este projeto é 100% estático, não precisa de variáveis de ambiente.
|
|
|
|
### Build Settings
|
|
|
|
- **Build Command**: Nenhum (deixe vazio)
|
|
- **Output Directory**: `.` (raiz do projeto)
|
|
- **Install Command**: Nenhum
|
|
|
|
### Headers e Cache
|
|
|
|
Já configurados em:
|
|
- `vercel.json` para Vercel
|
|
- `netlify.toml` para Netlify
|
|
|
|
---
|
|
|
|
## 🔍 Verificar Deploy
|
|
|
|
### Após o deploy, teste:
|
|
|
|
1. **Abra o site** na URL fornecida
|
|
2. **Teste o menu** MATERIAIS → Catálogo de Perfis → Cantoneiras
|
|
3. **Clique em** "🔄 Carregar Dados" se necessário
|
|
4. **Verifique** se os 39 itens aparecem
|
|
5. **Teste outros** cálculos e funcionalidades
|
|
|
|
---
|
|
|
|
## 🐛 Problemas Comuns
|
|
|
|
### Erro 404 ao acessar rotas
|
|
|
|
**Solução**: Já configurado em `vercel.json` e `netlify.toml`
|
|
|
|
### CSVs não carregam
|
|
|
|
**Causa**: Caminho incorreto ou CORS
|
|
**Solução**: Verificar se pasta `BD/perfis/` foi incluída no deploy
|
|
|
|
### Dados não aparecem
|
|
|
|
**Solução**: Clicar no botão "🔄 Carregar Dados" manualmente
|
|
|
|
### Cache não funciona
|
|
|
|
**Solução**: localStorage pode estar desabilitado no navegador
|
|
|
|
---
|
|
|
|
## 📊 Monitoramento
|
|
|
|
### Vercel
|
|
|
|
- **Analytics**: https://vercel.com/dashboard/analytics
|
|
- **Logs**: https://vercel.com/dashboard/deployments
|
|
- **Performance**: Automático
|
|
|
|
### Netlify
|
|
|
|
- **Analytics**: https://app.netlify.com/sites/seu-site/analytics
|
|
- **Logs**: https://app.netlify.com/sites/seu-site/deploys
|
|
- **Forms**: Disponível se adicionar formulários
|
|
|
|
---
|
|
|
|
## 🎨 Domínio Personalizado
|
|
|
|
### Vercel
|
|
|
|
1. Vá em Settings → Domains
|
|
2. Adicione seu domínio
|
|
3. Configure DNS conforme instruções
|
|
4. Aguarde propagação (~24h)
|
|
|
|
### Netlify
|
|
|
|
1. Vá em Domain settings
|
|
2. Adicione custom domain
|
|
3. Configure DNS conforme instruções
|
|
4. Aguarde propagação (~24h)
|
|
|
|
---
|
|
|
|
## 🔄 Atualizar Site
|
|
|
|
### Via Git (Automático)
|
|
|
|
```bash
|
|
git add .
|
|
git commit -m "Atualização"
|
|
git push
|
|
```
|
|
|
|
Deploy automático em ~30 segundos!
|
|
|
|
### Via CLI
|
|
|
|
```bash
|
|
# Vercel
|
|
vercel --prod
|
|
|
|
# Netlify
|
|
netlify deploy --prod
|
|
```
|
|
|
|
### Via Interface
|
|
|
|
Arraste a pasta atualizada novamente.
|
|
|
|
---
|
|
|
|
## 💡 Dicas
|
|
|
|
### Performance
|
|
|
|
- ✅ CSVs são cacheados automaticamente
|
|
- ✅ Headers de cache já configurados
|
|
- ✅ Compressão automática (gzip/brotli)
|
|
|
|
### SEO
|
|
|
|
- ✅ Meta tags já incluídas no `index.html`
|
|
- ✅ Sitemap pode ser adicionado se necessário
|
|
- ✅ robots.txt pode ser adicionado
|
|
|
|
### Analytics
|
|
|
|
- Vercel Analytics: Automático (plano gratuito)
|
|
- Google Analytics: Adicionar código no `index.html`
|
|
- Netlify Analytics: Disponível (pago)
|
|
|
|
---
|
|
|
|
## ✅ Checklist Final
|
|
|
|
Antes de fazer deploy:
|
|
|
|
- [ ] Testar localmente (abrir `index.html`)
|
|
- [ ] Verificar se CSVs estão na pasta `BD/perfis/`
|
|
- [ ] Verificar se todos os arquivos `.js` estão incluídos
|
|
- [ ] Testar carregamento de cantoneiras
|
|
- [ ] Verificar console por erros
|
|
- [ ] Testar em diferentes navegadores
|
|
- [ ] Verificar responsividade (mobile)
|
|
|
|
---
|
|
|
|
## 🎉 Pronto!
|
|
|
|
Seu site estará no ar em minutos!
|
|
|
|
**URLs de exemplo:**
|
|
- Vercel: `https://aco-calc-pro.vercel.app`
|
|
- Netlify: `https://aco-calc-pro.netlify.app`
|
|
|
|
---
|
|
|
|
**Boa sorte com o deploy! 🚀**
|