Skip to content

Latest commit

 

History

History
205 lines (152 loc) · 3.79 KB

File metadata and controls

205 lines (152 loc) · 3.79 KB

🚀 Deployment Guide

Este guia cobre o deployment do Virtual Office em diferentes plataformas.

📦 Opções de Deploy

Frontend (React + Vite)

Vercel (Recomendado)

# Install Vercel CLI
npm i -g vercel

# Deploy
vercel

# Deploy para produção
vercel --prod

Configuração:

  • Build Command: npm run build --workspace=frontend
  • Output Directory: frontend/dist
  • Install Command: npm install

Variáveis de Ambiente:

  • VITE_API_URL: URL da API backend
  • VITE_WS_URL: URL do WebSocket

Netlify

# Install Netlify CLI
npm i -g netlify-cli

# Deploy
netlify deploy

# Deploy para produção
netlify deploy --prod

Backend (Node.js + Express + Socket.io)

Railway (Recomendado)

# Install Railway CLI
npm i -g @railway/cli

# Login
railway login

# Initialize
railway init

# Deploy
railway up

Render

  1. Conecte seu repositório GitHub
  2. Selecione render.yaml para configuração
  3. Configure variáveis de ambiente
  4. Deploy automático

Docker

# Build
docker build -t virtual-office-backend ./backend

# Run
docker run -p 3001:3001 \
  -e NODE_ENV=production \
  -e CORS_ORIGIN=https://seu-frontend.vercel.app \
  virtual-office-backend

🔧 Variáveis de Ambiente

Frontend (Vercel)

VITE_API_URL=https://seu-backend.railway.app
VITE_WS_URL=wss://seu-backend.railway.app

Backend (Railway/Render)

NODE_ENV=production
PORT=3001
CORS_ORIGIN=https://seu-frontend.vercel.app

🌐 Deploy Completo (Full Stack)

Passo 1: Deploy Backend

# Railway
cd backend
railway init
railway up

# Anote a URL: https://virtual-office-backend.railway.app

Passo 2: Deploy Frontend

# Vercel
vercel

# Configure env vars:
vercel env add VITE_API_URL production
vercel env add VITE_WS_URL production

# Deploy
vercel --prod

Passo 3: Configurar CORS

Atualize CORS_ORIGIN no backend com a URL do frontend Vercel.

✅ Verificação

Após deploy:

  1. Frontend: Acesse https://seu-app.vercel.app
  2. Backend Health: Acesse https://seu-backend.railway.app/health
  3. WebSocket: Teste conexão no frontend

🔄 Deploy Automático

GitHub Actions (Já configurado)

Pushes para main acionam:

  • ✅ Testes
  • ✅ Build
  • ✅ Lint
  • ✅ TypeCheck

Vercel GitHub Integration

  1. Conecte repositório no Vercel Dashboard
  2. Configure auto-deploy em commits para main
  3. Preview deployments em PRs

Railway GitHub Integration

  1. Conecte repositório no Railway Dashboard
  2. Auto-deploy em commits para main
  3. Rollback com um clique

📊 Monitoramento

Logs

# Vercel
vercel logs

# Railway
railway logs

# Render
render logs

Performance

  • Vercel Analytics (habilitado automaticamente)
  • Railway Metrics Dashboard
  • Render Metrics Dashboard

🐛 Troubleshooting

Build Falha

  • Verifique Node version (18+ required)
  • Execute npm install localmente
  • Verifique package.json scripts

WebSocket não conecta

  • Verifique VITE_WS_URL usa wss:// (não ws://)
  • Backend precisa suportar WebSocket upgrades
  • Verifique CORS settings

CORS Errors

  • Configure CORS_ORIGIN no backend
  • Use URL completa (com https://)
  • Não use trailing slash

🔒 Segurança

  • ✅ HTTPS habilitado (automático Vercel/Railway)
  • ✅ Environment variables seguras
  • ✅ CORS configurado
  • ✅ Rate limiting (adicionar se necessário)

💰 Custos

Free Tier Limits

  • Vercel: 100GB bandwidth, unlimited deploys
  • Railway: 500h/mês, $5 crédito grátis
  • Render: 750h/mês free tier

Estimativa Custo Mensal

  • Hobby Project: $0 (free tier suficiente)
  • Small Business: ~$10-20 (Vercel Pro + Railway Hobby)
  • Enterprise: Custom (contate plataformas)

Dúvidas? Abra uma issue: https://github.com/KarlaZap/virtual-office/issues