Sumário

• 1. Visão Geral da Arquitetura
• 2. Diagrama de Deploy
• 3. Fluxo Geral do Sistema
  • 3.1. Fluxo da Aplicação (Execução)
  • 3.2. Fluxo de Deploy
    • 🔁 Backend (EC2)
    • 🌐 Frontend (Vercel)
• 4. Componentes da Arquitetura
  • 4.1 Backend – NestJS
    • Tecnologias:
    • Responsabilidades:
    • Principais Endpoints:
  • 4.2 Banco de Dados – PostgreSQL
  • 4.3 Frontend – React + Vite
    • Tecnologias:
  • 4.5 Instância EC2 (Resumo Geral)
    • Informações:
• 5. Infraestrutura AWS (Visão Geral)
  • Componentes utilizados:
• 6. Custos da Infraestrutura (orçamento)
• 8. Decisões Arquiteturais
  • Escolhas principais:

1. Visão Geral da Arquitetura

Sistema web full-stack composto por:

• Frontend: React + Vite (hospedado na Vercel)
• Backend: NestJS rodando em uma instância EC2
• Banco de Dados: PostgreSQL em Docker
• CI/CD: Pipelines automáticos para deploy de frontend e backend

2. Diagrama de Deploy

Esse diagrama representa:

• Onde cada parte do sistema está hospedada
• Como backend, frontend, banco e S3 se comunicam
• Como funcionam os pipelines de deploy
• Relação entre EC2, S3 e Vercel

3. Fluxo Geral do Sistema

3.1. Fluxo da Aplicação (Execução)

1. Usuário acessa o Frontend (Vercel)
2. O frontend envia requisições à API (EC2)
3. O backend processa regras de negócio
4. O backend consulta e atualiza o Banco PostgreSQL
5. Para uploads:
   • Frontend → Backend → S3
   • S3 retorna a URL ao Backend
   • Backend retorna ao Frontend
6. O Frontend exibe dados e imagens armazenadas

3.2. Fluxo de Deploy

🔁 Backend (EC2)

1. Commit → pipeline é acionada
2. Pipeline executa build
3. Nova versão é enviada e atualizada no EC2 via Docker

🌐 Frontend (Vercel)

1. Commit → build automático
2. Deploy instantâneo
3. Rollback fácil e protegido

4. Componentes da Arquitetura

4.1 Backend – NestJS

Tecnologias:

• NestJS
• TypeScript
• Prisma ORM
• Docker
• JWT Authentication

Responsabilidades:

• Regras de negócio
• Autenticação
• Integração com PostgreSQL
• Uploads para o S3
• Expor endpoints REST para o frontend

Principais Endpoints:

• GET /users
• POST /users
• PATCH /users/:id
• DELETE /users/:id

4.2 Banco de Dados – PostgreSQL

• Rodando em container Docker
• Porta interna não exposta publicamente
• Gerenciado via Prisma
• Migrations e seeds automatizados

4.3 Frontend – React + Vite

Tecnologias:

• React
• Vite
• TypeScript
• ESLint
• Deploy pela Vercel

4.5 Instância EC2 (Resumo Geral)

Informações:

• Papel: Hospedar Backend + Banco (via Docker)
• Região: us-east-2
• Comunicação segura com S3 via IAM Role

5. Infraestrutura AWS (Visão Geral)

Componentes utilizados:

• EC2 – Executa backend e banco
• S3 – Armazenamento de imagens
• IAM Roles – Permissões seguras (sem chaves no código)

6. Custos da Infraestrutura (orçamento)

8. Decisões Arquiteturais

Escolhas principais:

• EC2 + Docker pela simplicidade de deploy
• PostgreSQL em container para manter custo zero no BD
• S3 pela durabilidade e integração nativa
• Frontend na Vercel por facilidade, rapidez e custo zero
• Pipelines para automação e consistência