docs: adiciona documentação completa do projeto SaveInMed
- Cria README.md na raiz com visão global e diagrama de arquitetura - Adiciona/atualiza README.md em todos os componentes: - backend (API Go) - backoffice (NestJS) - marketplace (React/Vite) - saveinmed-bff (Python/FastAPI) - saveinmed-frontend (Next.js) - website (Fresh/Deno) - Atualiza .gitignore em todos os componentes com regras abrangentes - Cria .gitignore na raiz do projeto - Renomeia pastas para melhor organização: - backend-go → backend - backend-nest → backoffice - marketplace-front → marketplace - Documenta arquitetura, tecnologias, setup e fluxo de desenvolvimento
This commit is contained in:
Tiago Yamamoto
parent
1130fb662a
commit
42f72f5f43
86 changed files with 2337 additions and 69 deletions
40
.gitignore
vendored
Normal file
40
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,40 @@
|
|||
# IDEs and Editors
|
||||
.vscode/
|
||||
.idea/
|
||||
*.swp
|
||||
*.swo
|
||||
*~
|
||||
.DS_Store
|
||||
|
||||
# OS
|
||||
Thumbs.db
|
||||
.Spotlight-V100
|
||||
.Trashes
|
||||
|
||||
# Environment variables
|
||||
.env
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Logs
|
||||
*.log
|
||||
logs/
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
# Temporary files
|
||||
*.tmp
|
||||
*.temp
|
||||
.cache/
|
||||
|
||||
# Build outputs (general)
|
||||
dist/
|
||||
build/
|
||||
out/
|
||||
|
||||
# Dependencies
|
||||
node_modules/
|
||||
|
||||
# Each subproject has its own .gitignore for specific rules
|
||||
582
README.md
Normal file
582
README.md
Normal file
|
|
@ -0,0 +1,582 @@
|
|||
# SaveInMed
|
||||
|
||||
**Plataforma B2B de Marketplace Farmacêutico**
|
||||
|
||||
SaveInMed é uma plataforma completa de marketplace B2B que conecta farmácias e distribuidoras farmacêuticas, facilitando a compra e venda de medicamentos e produtos farmacêuticos com eficiência, segurança e transparência.
|
||||
|
||||
---
|
||||
|
||||
## 📋 Índice
|
||||
|
||||
- [Visão Geral](#-visão-geral)
|
||||
- [Arquitetura do Sistema](#-arquitetura-do-sistema)
|
||||
- [Componentes do Projeto](#-componentes-do-projeto)
|
||||
- [Tecnologias Utilizadas](#-tecnologias-utilizadas)
|
||||
- [Setup Completo](#-setup-completo)
|
||||
- [Fluxo de Desenvolvimento](#-fluxo-de-desenvolvimento)
|
||||
- [Deploy](#-deploy)
|
||||
- [Contribuindo](#-contribuindo)
|
||||
- [Licença](#-licença)
|
||||
|
||||
---
|
||||
|
||||
## 🎯 Visão Geral
|
||||
|
||||
SaveInMed é uma solução completa que oferece:
|
||||
|
||||
- ✅ **Marketplace B2B**: Conecta farmácias compradoras com distribuidoras vendedoras
|
||||
- ✅ **Gestão de Catálogo**: Controle completo de produtos, lotes e validades
|
||||
- ✅ **Processamento de Pedidos**: Fluxo completo desde o carrinho até a entrega
|
||||
- ✅ **Pagamentos Integrados**: Mercado Pago com split automático de comissões
|
||||
- ✅ **Dashboard Administrativo**: Métricas, relatórios e gestão completa
|
||||
- ✅ **Multi-tenant**: Suporte para múltiplas empresas e usuários
|
||||
- ✅ **Alta Performance**: APIs otimizadas em Go para operações críticas
|
||||
- ✅ **Escalabilidade**: Arquitetura moderna e cloud-native
|
||||
|
||||
---
|
||||
|
||||
## 🏗️ Arquitetura do Sistema
|
||||
|
||||
```mermaid
|
||||
graph TB
|
||||
subgraph "Frontend Layer"
|
||||
WEB[Website<br/>Fresh/Deno<br/>:8000]
|
||||
MKT[Marketplace Frontend<br/>React/Vite<br/>:5173]
|
||||
MAIN[SaveInMed Frontend<br/>Next.js 15<br/>:3000]
|
||||
end
|
||||
|
||||
subgraph "Backend Layer"
|
||||
BFF[SaveInMed BFF<br/>Python/FastAPI<br/>:8000]
|
||||
API[Backend API<br/>Go 1.24<br/>:8080]
|
||||
BACK[Backoffice<br/>NestJS/Fastify<br/>:3000]
|
||||
end
|
||||
|
||||
subgraph "Data Layer"
|
||||
PG[(PostgreSQL<br/>Database)]
|
||||
AW[(Appwrite<br/>BaaS)]
|
||||
end
|
||||
|
||||
subgraph "External Services"
|
||||
MP[Mercado Pago<br/>Payments]
|
||||
MB[Mapbox<br/>Geocoding]
|
||||
end
|
||||
|
||||
WEB -->|Landing Pages| BFF
|
||||
MKT -->|Marketplace| API
|
||||
MAIN -->|Main App| AW
|
||||
MAIN -->|Admin| BACK
|
||||
|
||||
BFF --> AW
|
||||
API --> PG
|
||||
BACK --> PG
|
||||
|
||||
API --> MP
|
||||
BFF --> MB
|
||||
BACK --> MP
|
||||
|
||||
style WEB fill:#4ade80
|
||||
style MKT fill:#60a5fa
|
||||
style MAIN fill:#a78bfa
|
||||
style BFF fill:#fbbf24
|
||||
style API fill:#f87171
|
||||
style BACK fill:#fb923c
|
||||
style PG fill:#94a3b8
|
||||
style AW fill:#94a3b8
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📦 Componentes do Projeto
|
||||
|
||||
### 1. **backend** - API de Alta Performance (Go)
|
||||
|
||||
**Propósito**: Núcleo de performance para operações críticas
|
||||
|
||||
**Tecnologias**: Go 1.24, PostgreSQL, Swagger
|
||||
|
||||
**Porta**: 8080
|
||||
|
||||
**Principais Funcionalidades**:
|
||||
- Gestão de empresas (farmácias, distribuidoras)
|
||||
- Catálogo de produtos com lote e validade
|
||||
- Processamento de pedidos
|
||||
- Integração Mercado Pago com split de pagamento
|
||||
- Respostas JSON otimizadas com compressão gzip
|
||||
|
||||
**Documentação**: [backend/README.md](./backend/README.md)
|
||||
|
||||
**Como executar**:
|
||||
```bash
|
||||
cd backend
|
||||
export DATABASE_URL=postgres://postgres:postgres@localhost:5432/saveinmed?sslmode=disable
|
||||
go run ./cmd/api
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### 2. **backoffice** - Sistema Administrativo (NestJS)
|
||||
|
||||
**Propósito**: Interface de gestão e administração
|
||||
|
||||
**Tecnologias**: NestJS 10, Fastify, Prisma, PostgreSQL
|
||||
|
||||
**Porta**: 3000
|
||||
|
||||
**Principais Funcionalidades**:
|
||||
- Autenticação JWT (access + refresh tokens)
|
||||
- Gestão de usuários e permissões
|
||||
- Controle de inventário
|
||||
- Processamento de webhooks Mercado Pago
|
||||
- Dashboard administrativo
|
||||
|
||||
**Documentação**: [backoffice/README.md](./backoffice/README.md)
|
||||
|
||||
**Como executar**:
|
||||
```bash
|
||||
cd backoffice
|
||||
pnpm install
|
||||
pnpm prisma:generate
|
||||
pnpm start:dev
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### 3. **marketplace** - Frontend do Marketplace (React)
|
||||
|
||||
**Propósito**: Interface do marketplace B2B
|
||||
|
||||
**Tecnologias**: React 18, Vite 5, TailwindCSS, Zustand
|
||||
|
||||
**Porta**: 5173
|
||||
|
||||
**Principais Funcionalidades**:
|
||||
- Catálogo de produtos com virtualização
|
||||
- Carrinho de compras
|
||||
- Checkout com Mercado Pago
|
||||
- Dashboard de pedidos
|
||||
- Autenticação e rotas protegidas
|
||||
|
||||
**Documentação**: [marketplace/README.md](./marketplace/README.md)
|
||||
|
||||
**Como executar**:
|
||||
```bash
|
||||
cd marketplace
|
||||
npm install
|
||||
npm run dev
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### 4. **saveinmed-bff** - Backend For Frontend (Python)
|
||||
|
||||
**Propósito**: Agregação de dados e proxy para frontends
|
||||
|
||||
**Tecnologias**: Python 3.12, FastAPI, Appwrite
|
||||
|
||||
**Porta**: 8000
|
||||
|
||||
**Principais Funcionalidades**:
|
||||
- Integração com Appwrite (Databases)
|
||||
- Autenticação JWT com cookies httpOnly
|
||||
- CRUD de categorias, produtos, pedidos
|
||||
- Geocodificação automática (Mapbox)
|
||||
- Cálculo de frete dinâmico
|
||||
- API key protection
|
||||
|
||||
**Documentação**: [saveinmed-bff/README.md](./saveinmed-bff/README.md)
|
||||
|
||||
**Como executar**:
|
||||
```bash
|
||||
cd saveinmed-bff
|
||||
pip install -r requirements.txt
|
||||
uvicorn src.main:app --reload
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### 5. **saveinmed-frontend** - Frontend Principal (Next.js)
|
||||
|
||||
**Propósito**: Aplicação frontend completa e principal
|
||||
|
||||
**Tecnologias**: Next.js 15, React 19, TailwindCSS 4, Appwrite
|
||||
|
||||
**Porta**: 3000
|
||||
|
||||
**Principais Funcionalidades**:
|
||||
- Interface completa para farmácias e distribuidoras
|
||||
- Gestão de catálogo de produtos
|
||||
- Sistema de pedidos e pagamentos
|
||||
- Dashboard com gráficos (Chart.js)
|
||||
- Integração Appwrite para backend
|
||||
- Checkout Mercado Pago
|
||||
- Envio de emails (Nodemailer)
|
||||
|
||||
**Documentação**: [saveinmed-frontend/README.md](./saveinmed-frontend/README.md)
|
||||
|
||||
**Como executar**:
|
||||
```bash
|
||||
cd saveinmed-frontend
|
||||
npm install
|
||||
npm run dev
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### 6. **website** - Site Institucional (Fresh/Deno)
|
||||
|
||||
**Propósito**: Landing pages e marketing
|
||||
|
||||
**Tecnologias**: Fresh v2, Deno 2, Preact, TailwindCSS
|
||||
|
||||
**Porta**: 8000
|
||||
|
||||
**Principais Funcionalidades**:
|
||||
- Landing pages institucionais
|
||||
- Captura de leads
|
||||
- Blog e conteúdo educacional
|
||||
- SEO otimizado
|
||||
- Islands Architecture (hidratação parcial)
|
||||
|
||||
**Documentação**: [website/README.md](./website/README.md)
|
||||
|
||||
**Como executar**:
|
||||
```bash
|
||||
cd website
|
||||
deno task dev
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ Tecnologias Utilizadas
|
||||
|
||||
### Backend
|
||||
| Componente | Linguagem | Framework | Banco de Dados |
|
||||
|------------|-----------|-----------|----------------|
|
||||
| **backend** | Go 1.24 | - | PostgreSQL |
|
||||
| **backoffice** | TypeScript | NestJS 10 + Fastify | PostgreSQL (Prisma) |
|
||||
| **saveinmed-bff** | Python 3.12 | FastAPI | Appwrite |
|
||||
|
||||
### Frontend
|
||||
| Componente | Framework | Versão | Estilização |
|
||||
|------------|-----------|--------|-------------|
|
||||
| **marketplace** | React + Vite | 18 + 5 | TailwindCSS 3 |
|
||||
| **saveinmed-frontend** | Next.js | 15 | TailwindCSS 4 |
|
||||
| **website** | Fresh (Deno) | v2 | TailwindCSS |
|
||||
|
||||
### Infraestrutura e Serviços
|
||||
- **Banco de Dados**: PostgreSQL 14+
|
||||
- **BaaS**: Appwrite 18
|
||||
- **Pagamentos**: Mercado Pago SDK
|
||||
- **Geocoding**: Mapbox API
|
||||
- **Email**: Nodemailer
|
||||
- **Containerização**: Docker
|
||||
- **Documentação**: Swagger/OpenAPI
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Setup Completo
|
||||
|
||||
### Pré-requisitos
|
||||
|
||||
- **Go** 1.24+
|
||||
- **Node.js** 20+
|
||||
- **Python** 3.12+
|
||||
- **Deno** 2.0+
|
||||
- **PostgreSQL** 14+
|
||||
- **pnpm** 8+ (para backoffice)
|
||||
- **Docker** (opcional)
|
||||
|
||||
### 1. Clonar o Repositório
|
||||
|
||||
```bash
|
||||
git clone https://github.com/rede5/saveinmed.git
|
||||
cd saveinmed
|
||||
```
|
||||
|
||||
### 2. Configurar Banco de Dados
|
||||
|
||||
```bash
|
||||
# Criar banco de dados PostgreSQL
|
||||
createdb saveinmed
|
||||
|
||||
# Ou via Docker
|
||||
docker run --name saveinmed-postgres \
|
||||
-e POSTGRES_PASSWORD=postgres \
|
||||
-e POSTGRES_DB=saveinmed \
|
||||
-p 5432:5432 \
|
||||
-d postgres:14
|
||||
```
|
||||
|
||||
### 3. Configurar Variáveis de Ambiente
|
||||
|
||||
Cada componente possui um arquivo `.env.example`. Copie e configure:
|
||||
|
||||
```bash
|
||||
# Backend Go
|
||||
cd backend
|
||||
cp .env.example .env
|
||||
# Edite .env com suas configurações
|
||||
|
||||
# Backoffice NestJS
|
||||
cd ../backoffice
|
||||
cp .env.example .env
|
||||
# Edite .env com suas configurações
|
||||
|
||||
# E assim por diante para cada componente...
|
||||
```
|
||||
|
||||
### 4. Instalar Dependências
|
||||
|
||||
```bash
|
||||
# Backend Go
|
||||
cd backend
|
||||
go mod download
|
||||
|
||||
# Backoffice NestJS
|
||||
cd ../backoffice
|
||||
pnpm install
|
||||
pnpm prisma:generate
|
||||
pnpm prisma migrate dev
|
||||
|
||||
# Marketplace React
|
||||
cd ../marketplace
|
||||
npm install
|
||||
|
||||
# SaveInMed BFF Python
|
||||
cd ../saveinmed-bff
|
||||
python -m venv venv
|
||||
source venv/bin/activate # ou `venv\Scripts\activate` no Windows
|
||||
pip install -r requirements.txt
|
||||
|
||||
# SaveInMed Frontend Next.js
|
||||
cd ../saveinmed-frontend
|
||||
npm install
|
||||
|
||||
# Website Fresh/Deno
|
||||
cd ../website
|
||||
# Deno não requer instalação de dependências
|
||||
```
|
||||
|
||||
### 5. Executar Todos os Serviços
|
||||
|
||||
**Opção 1: Manualmente (em terminais separados)**
|
||||
|
||||
```bash
|
||||
# Terminal 1 - Backend Go
|
||||
cd backend && go run ./cmd/api
|
||||
|
||||
# Terminal 2 - Backoffice NestJS
|
||||
cd backoffice && pnpm start:dev
|
||||
|
||||
# Terminal 3 - Marketplace React
|
||||
cd marketplace && npm run dev
|
||||
|
||||
# Terminal 4 - SaveInMed BFF
|
||||
cd saveinmed-bff && uvicorn src.main:app --reload
|
||||
|
||||
# Terminal 5 - SaveInMed Frontend
|
||||
cd saveinmed-frontend && npm run dev
|
||||
|
||||
# Terminal 6 - Website
|
||||
cd website && deno task dev
|
||||
```
|
||||
|
||||
**Opção 2: Docker Compose (em desenvolvimento)**
|
||||
|
||||
```bash
|
||||
docker-compose up
|
||||
```
|
||||
|
||||
### 6. Acessar as Aplicações
|
||||
|
||||
| Serviço | URL | Descrição |
|
||||
|---------|-----|-----------|
|
||||
| Backend API | http://localhost:8080 | API Go |
|
||||
| Backend Swagger | http://localhost:8080/swagger/index.html | Docs API Go |
|
||||
| Backoffice | http://localhost:3000 | Admin NestJS |
|
||||
| Backoffice Swagger | http://localhost:3000/api | Docs NestJS |
|
||||
| Marketplace | http://localhost:5173 | Frontend React |
|
||||
| SaveInMed BFF | http://localhost:8000 | BFF Python |
|
||||
| SaveInMed BFF Docs | http://localhost:8000/docs | Docs FastAPI |
|
||||
| SaveInMed Frontend | http://localhost:3000 | Frontend Next.js |
|
||||
| Website | http://localhost:8000 | Site Fresh/Deno |
|
||||
|
||||
---
|
||||
|
||||
## 💻 Fluxo de Desenvolvimento
|
||||
|
||||
### 1. Criar Nova Feature
|
||||
|
||||
```bash
|
||||
# Criar branch
|
||||
git checkout -b feature/nome-da-feature
|
||||
|
||||
# Desenvolver...
|
||||
# Testar...
|
||||
|
||||
# Commit
|
||||
git add .
|
||||
git commit -m "feat: adiciona nova funcionalidade X"
|
||||
|
||||
# Push
|
||||
git push origin feature/nome-da-feature
|
||||
|
||||
# Criar Pull Request no GitHub
|
||||
```
|
||||
|
||||
### 2. Padrões de Commit
|
||||
|
||||
Seguimos [Conventional Commits](https://www.conventionalcommits.org/):
|
||||
|
||||
- `feat:` - Nova funcionalidade
|
||||
- `fix:` - Correção de bug
|
||||
- `docs:` - Documentação
|
||||
- `style:` - Formatação
|
||||
- `refactor:` - Refatoração
|
||||
- `test:` - Testes
|
||||
- `chore:` - Tarefas de build/config
|
||||
|
||||
### 3. Testes
|
||||
|
||||
```bash
|
||||
# Backend Go
|
||||
cd backend && go test ./...
|
||||
|
||||
# Backoffice NestJS
|
||||
cd backoffice && pnpm test
|
||||
|
||||
# SaveInMed BFF Python
|
||||
cd saveinmed-bff && pytest
|
||||
|
||||
# Frontend Next.js
|
||||
cd saveinmed-frontend && npm test
|
||||
```
|
||||
|
||||
### 4. Linting
|
||||
|
||||
```bash
|
||||
# Backend Go
|
||||
cd backend && golangci-lint run
|
||||
|
||||
# Backoffice NestJS
|
||||
cd backoffice && pnpm lint
|
||||
|
||||
# Marketplace React
|
||||
cd marketplace && npm run lint
|
||||
|
||||
# Frontend Next.js
|
||||
cd saveinmed-frontend && npm run lint
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🚢 Deploy
|
||||
|
||||
### Backend (Go)
|
||||
|
||||
```bash
|
||||
# Build
|
||||
cd backend
|
||||
go build -o bin/api ./cmd/api
|
||||
|
||||
# Docker
|
||||
docker build -t saveinmed-api:latest .
|
||||
docker push registry.example.com/saveinmed-api:latest
|
||||
```
|
||||
|
||||
### Backoffice (NestJS)
|
||||
|
||||
```bash
|
||||
# Build
|
||||
cd backoffice
|
||||
pnpm build
|
||||
|
||||
# Docker
|
||||
docker build -t saveinmed-backoffice:latest .
|
||||
docker push registry.example.com/saveinmed-backoffice:latest
|
||||
```
|
||||
|
||||
### Marketplace (React)
|
||||
|
||||
```bash
|
||||
# Build
|
||||
cd marketplace
|
||||
npm run build
|
||||
|
||||
# Deploy para Vercel/Netlify
|
||||
vercel --prod
|
||||
```
|
||||
|
||||
### SaveInMed BFF (Python)
|
||||
|
||||
```bash
|
||||
# Docker
|
||||
cd saveinmed-bff
|
||||
docker build -t saveinmed-bff:latest .
|
||||
docker push registry.example.com/saveinmed-bff:latest
|
||||
```
|
||||
|
||||
### SaveInMed Frontend (Next.js)
|
||||
|
||||
```bash
|
||||
# Build
|
||||
cd saveinmed-frontend
|
||||
npm run build
|
||||
|
||||
# Deploy para Vercel
|
||||
vercel --prod
|
||||
```
|
||||
|
||||
### Website (Fresh/Deno)
|
||||
|
||||
```bash
|
||||
# Deploy para Deno Deploy
|
||||
cd website
|
||||
deployctl deploy --project=saveinmed-website
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🤝 Contribuindo
|
||||
|
||||
1. Fork o projeto
|
||||
2. Crie uma branch para sua feature (`git checkout -b feature/AmazingFeature`)
|
||||
3. Commit suas mudanças (`git commit -m 'feat: Add some AmazingFeature'`)
|
||||
4. Push para a branch (`git push origin feature/AmazingFeature`)
|
||||
5. Abra um Pull Request
|
||||
|
||||
### Diretrizes
|
||||
|
||||
- Escreva testes para novas funcionalidades
|
||||
- Mantenha a documentação atualizada
|
||||
- Siga os padrões de código de cada linguagem
|
||||
- Use Conventional Commits
|
||||
- Revise seu próprio código antes de submeter PR
|
||||
|
||||
---
|
||||
|
||||
## 📄 Licença
|
||||
|
||||
Este projeto está licenciado sob a Licença MIT - veja o arquivo [LICENSE](LICENSE) para detalhes.
|
||||
|
||||
---
|
||||
|
||||
## 📞 Contato
|
||||
|
||||
**SaveInMed Team**
|
||||
|
||||
- Website: https://saveinmed.com
|
||||
- Email: contato@saveinmed.com
|
||||
- GitHub: https://github.com/rede5/saveinmed
|
||||
|
||||
---
|
||||
|
||||
## 🙏 Agradecimentos
|
||||
|
||||
- Equipe de desenvolvimento
|
||||
- Contribuidores open source
|
||||
- Comunidades Go, NestJS, React, Python, e Deno
|
||||
|
||||
---
|
||||
|
||||
**Desenvolvido com ❤️ pela equipe SaveInMed**
|
||||
1
backend-go/.gitignore
vendored
1
backend-go/.gitignore
vendored
|
|
@ -1 +0,0 @@
|
|||
/bin
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
# SaveInMed Performance Core (Go)
|
||||
|
||||
Backend em Go 1.24 focado em alta performance para o marketplace farmacêutico B2B.
|
||||
|
||||
## Funcionalidades
|
||||
- Gestão de empresas com separação de papéis (farmácia, distribuidora, administrador).
|
||||
- Catálogo de produtos com lote e validade obrigatórios.
|
||||
- Pedidos com ciclo Pendente → Pago → Faturado → Entregue.
|
||||
- Geração de preferência de pagamento Mercado Pago com split e retenção de comissão.
|
||||
- Respostas JSON com `json-iterator` e compressão gzip.
|
||||
- Swagger disponível em `/swagger/index.html`.
|
||||
|
||||
## Execução local
|
||||
```bash
|
||||
export DATABASE_URL=postgres://postgres:postgres@localhost:5432/saveinmed?sslmode=disable
|
||||
cd backend-go
|
||||
# gerar swagger (já versionado)
|
||||
./bin/swag init --dir ./cmd/api,./internal/http/handler,./internal/domain --output ./docs --parseDependency --parseInternal
|
||||
# executar API
|
||||
go run ./cmd/api
|
||||
```
|
||||
|
||||
## Docker
|
||||
```bash
|
||||
docker build -t saveinmed-performance-core:dev .
|
||||
docker run -p 8080:8080 -e DATABASE_URL=postgres://... saveinmed-performance-core:dev
|
||||
```
|
||||
6
backend-nest/.gitignore
vendored
6
backend-nest/.gitignore
vendored
|
|
@ -1,6 +0,0 @@
|
|||
node_modules
|
||||
.env
|
||||
coverage
|
||||
dist
|
||||
.DS_Store
|
||||
.prisma
|
||||
47
backend/.gitignore
vendored
Normal file
47
backend/.gitignore
vendored
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
# Binaries for programs and plugins
|
||||
*.exe
|
||||
*.exe~
|
||||
*.dll
|
||||
*.so
|
||||
*.dylib
|
||||
*.db
|
||||
|
||||
# Test binary, built with `go test -c`
|
||||
*.test
|
||||
|
||||
# Output of the go coverage tool
|
||||
*.out
|
||||
coverage.txt
|
||||
coverage.html
|
||||
|
||||
# Go workspace file
|
||||
go.work
|
||||
|
||||
# Dependency directories
|
||||
vendor/
|
||||
|
||||
# Build output
|
||||
/bin
|
||||
dist/
|
||||
*.o
|
||||
*.a
|
||||
|
||||
# Environment variables
|
||||
.env
|
||||
.env.local
|
||||
|
||||
# Logs
|
||||
*.log
|
||||
|
||||
# Swagger generated files (if regenerating)
|
||||
# docs/
|
||||
|
||||
# IDE
|
||||
.vscode/
|
||||
.idea/
|
||||
*.swp
|
||||
*.swo
|
||||
|
||||
# OS
|
||||
.DS_Store
|
||||
Thumbs.db
|
||||
160
backend/README.md
Normal file
160
backend/README.md
Normal file
|
|
@ -0,0 +1,160 @@
|
|||
# SaveInMed API (Backend Go)
|
||||
|
||||
API de alta performance em Go 1.24 para o marketplace farmacêutico B2B SaveInMed.
|
||||
|
||||
## 🎯 Propósito
|
||||
|
||||
Este é o núcleo de performance do SaveInMed, responsável por operações críticas que exigem alta velocidade e eficiência, incluindo:
|
||||
- Gestão de empresas (farmácias, distribuidoras, administradores)
|
||||
- Catálogo de produtos com controle de lote e validade
|
||||
- Processamento de pedidos
|
||||
- Integração com Mercado Pago para pagamentos
|
||||
|
||||
## 🚀 Tecnologias
|
||||
|
||||
- **Go 1.24.3** - Linguagem de programação
|
||||
- **PostgreSQL** - Banco de dados (via pgx/v5)
|
||||
- **json-iterator** - Serialização JSON de alta performance
|
||||
- **Swagger** - Documentação automática da API
|
||||
- **Gzip** - Compressão de respostas
|
||||
|
||||
## 📋 Funcionalidades
|
||||
|
||||
### Gestão de Empresas
|
||||
- Separação de papéis: farmácia, distribuidora, administrador
|
||||
- CRUD completo de empresas
|
||||
- Validação de CNPJ
|
||||
|
||||
### Catálogo de Produtos
|
||||
- Produtos com lote e validade obrigatórios
|
||||
- Categorização e subcategorização
|
||||
- Controle de estoque
|
||||
|
||||
### Pedidos
|
||||
- Ciclo completo: Pendente → Pago → Faturado → Entregue
|
||||
- Rastreamento de status
|
||||
- Histórico de transações
|
||||
|
||||
### Pagamentos
|
||||
- Geração de preferência de pagamento Mercado Pago
|
||||
- Split de pagamento automático
|
||||
- Retenção de comissão da plataforma
|
||||
|
||||
## 🏗️ Arquitetura
|
||||
|
||||
```
|
||||
backend/
|
||||
├── cmd/
|
||||
│ └── api/
|
||||
│ └── main.go # Entry point da aplicação
|
||||
├── internal/
|
||||
│ ├── config/ # Configurações
|
||||
│ ├── domain/ # Modelos de domínio
|
||||
│ ├── http/
|
||||
│ │ ├── handler/ # Handlers HTTP
|
||||
│ │ └── middleware/ # Middlewares (logging, compress)
|
||||
│ ├── payments/ # Integração Mercado Pago
|
||||
│ ├── repository/
|
||||
│ │ └── postgres/ # Repositório PostgreSQL
|
||||
│ ├── server/ # Configuração do servidor
|
||||
│ └── usecase/ # Casos de uso / lógica de negócio
|
||||
├── docs/ # Documentação Swagger
|
||||
├── Dockerfile
|
||||
└── README.md
|
||||
```
|
||||
|
||||
## 🔧 Configuração
|
||||
|
||||
### Variáveis de Ambiente
|
||||
|
||||
```bash
|
||||
DATABASE_URL=postgres://user:password@localhost:5432/saveinmed?sslmode=disable
|
||||
PORT=8080
|
||||
```
|
||||
|
||||
### Pré-requisitos
|
||||
|
||||
- Go 1.24 ou superior
|
||||
- PostgreSQL 14+
|
||||
- Swag CLI (para regenerar documentação)
|
||||
|
||||
## 🏃 Execução Local
|
||||
|
||||
```bash
|
||||
# Configurar variável de ambiente
|
||||
export DATABASE_URL=postgres://postgres:postgres@localhost:5432/saveinmed?sslmode=disable
|
||||
|
||||
# Instalar dependências
|
||||
go mod download
|
||||
|
||||
# Executar API
|
||||
go run ./cmd/api
|
||||
|
||||
# API estará disponível em http://localhost:8080
|
||||
# Swagger UI em http://localhost:8080/swagger/index.html
|
||||
```
|
||||
|
||||
## 🐳 Docker
|
||||
|
||||
```bash
|
||||
# Build da imagem
|
||||
docker build -t saveinmed-api:latest .
|
||||
|
||||
# Executar container
|
||||
docker run -p 8080:8080 \
|
||||
-e DATABASE_URL=postgres://user:password@host:5432/saveinmed \
|
||||
saveinmed-api:latest
|
||||
```
|
||||
|
||||
## 📚 Documentação da API
|
||||
|
||||
A documentação completa da API está disponível via Swagger UI:
|
||||
|
||||
```
|
||||
http://localhost:8080/swagger/index.html
|
||||
```
|
||||
|
||||
### Regenerar Swagger
|
||||
|
||||
```bash
|
||||
# Instalar swag
|
||||
go install github.com/swaggo/swag/cmd/swag@latest
|
||||
|
||||
# Gerar documentação
|
||||
swag init --dir ./cmd/api,./internal/http/handler,./internal/domain \
|
||||
--output ./docs \
|
||||
--parseDependency \
|
||||
--parseInternal
|
||||
```
|
||||
|
||||
## 🧪 Testes
|
||||
|
||||
```bash
|
||||
# Executar todos os testes
|
||||
go test ./...
|
||||
|
||||
# Executar testes com coverage
|
||||
go test -cover ./...
|
||||
|
||||
# Gerar relatório de coverage
|
||||
go test -coverprofile=coverage.out ./...
|
||||
go tool cover -html=coverage.out
|
||||
```
|
||||
|
||||
## 📊 Performance
|
||||
|
||||
Esta API foi otimizada para alta performance:
|
||||
- **json-iterator**: ~2-3x mais rápido que encoding/json padrão
|
||||
- **Compressão gzip**: Reduz tamanho das respostas em ~70%
|
||||
- **Connection pooling**: Gerenciamento eficiente de conexões com PostgreSQL
|
||||
- **Prepared statements**: Queries otimizadas e protegidas contra SQL injection
|
||||
|
||||
## 🔗 Integração com Outros Componentes
|
||||
|
||||
- **Backoffice (NestJS)**: Compartilha o mesmo banco de dados PostgreSQL
|
||||
- **Marketplace Frontend**: Consome esta API para operações críticas
|
||||
- **SaveInMed BFF**: Pode fazer proxy para endpoints específicos desta API
|
||||
|
||||
## 📝 Licença
|
||||
|
||||
MIT
|
||||
44
backoffice/.gitignore
vendored
Normal file
44
backoffice/.gitignore
vendored
Normal file
|
|
@ -0,0 +1,44 @@
|
|||
# Dependencies
|
||||
node_modules/
|
||||
.pnp
|
||||
.pnp.js
|
||||
|
||||
# Build output
|
||||
dist/
|
||||
build/
|
||||
*.tsbuildinfo
|
||||
|
||||
# Environment variables
|
||||
.env
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Logs
|
||||
logs/
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
# Testing
|
||||
coverage/
|
||||
.nyc_output/
|
||||
|
||||
# Prisma
|
||||
.prisma/
|
||||
prisma/migrations/**/migration.sql.bak
|
||||
|
||||
# IDE
|
||||
.vscode/
|
||||
.idea/
|
||||
*.swp
|
||||
*.swo
|
||||
|
||||
# OS
|
||||
.DS_Store
|
||||
Thumbs.db
|
||||
|
||||
# Temporary files
|
||||
*.tmp
|
||||
.cache/
|
||||
240
backoffice/README.md
Normal file
240
backoffice/README.md
Normal file
|
|
@ -0,0 +1,240 @@
|
|||
# SaveInMed Backoffice
|
||||
|
||||
Sistema de gestão administrativa (backoffice) do SaveInMed, desenvolvido com NestJS e Fastify.
|
||||
|
||||
## 🎯 Propósito
|
||||
|
||||
O Backoffice é a interface de administração e gestão do SaveInMed, fornecendo ferramentas para:
|
||||
- Gerenciamento de usuários e autenticação
|
||||
- Controle de inventário e estoque
|
||||
- Administração de empresas cadastradas
|
||||
- Processamento de webhooks de pagamento
|
||||
- Relatórios e analytics
|
||||
|
||||
## 🚀 Tecnologias
|
||||
|
||||
- **NestJS 10** - Framework backend progressivo para Node.js
|
||||
- **Fastify 4** - Web framework de alta performance
|
||||
- **Prisma 5** - ORM moderno para TypeScript
|
||||
- **PostgreSQL** - Banco de dados relacional
|
||||
- **JWT** - Autenticação via JSON Web Tokens
|
||||
- **Bcrypt** - Hash seguro de senhas
|
||||
- **Swagger** - Documentação automática da API
|
||||
|
||||
## 📋 Funcionalidades
|
||||
|
||||
### Autenticação e Autorização
|
||||
- Login com JWT (access + refresh tokens)
|
||||
- Proteção de rotas com guards
|
||||
- Estratégias de autenticação Passport
|
||||
- Refresh token rotation
|
||||
|
||||
### Gestão de Usuários
|
||||
- CRUD completo de usuários
|
||||
- Perfis e permissões
|
||||
- Validação de dados com class-validator
|
||||
|
||||
### Inventário
|
||||
- Controle de produtos e estoque
|
||||
- Registro de compras
|
||||
- Movimentação de produtos
|
||||
- Relatórios de inventário
|
||||
|
||||
### Webhooks
|
||||
- Processamento de notificações do Mercado Pago
|
||||
- Atualização automática de status de pedidos
|
||||
- Logs de eventos
|
||||
|
||||
## 🏗️ Arquitetura
|
||||
|
||||
```
|
||||
backoffice/
|
||||
├── prisma/
|
||||
│ └── schema.prisma # Schema do banco de dados
|
||||
├── src/
|
||||
│ ├── auth/ # Módulo de autenticação
|
||||
│ │ ├── guards/ # Guards JWT e Refresh Token
|
||||
│ │ ├── strategies/ # Estratégias Passport
|
||||
│ │ └── dto/ # DTOs de login
|
||||
│ ├── users/ # Módulo de usuários
|
||||
│ │ ├── users.controller.ts
|
||||
│ │ ├── users.service.ts
|
||||
│ │ └── dto/
|
||||
│ ├── inventory/ # Módulo de inventário
|
||||
│ │ ├── inventory.controller.ts
|
||||
│ │ ├── inventory.service.ts
|
||||
│ │ └── dto/
|
||||
│ ├── webhooks/ # Módulo de webhooks
|
||||
│ │ ├── webhooks.controller.ts
|
||||
│ │ └── webhooks.module.ts
|
||||
│ ├── common/ # Recursos compartilhados
|
||||
│ │ └── guards/
|
||||
│ ├── prisma/ # Módulo Prisma
|
||||
│ │ ├── prisma.module.ts
|
||||
│ │ └── prisma.service.ts
|
||||
│ ├── app.module.ts # Módulo raiz
|
||||
│ └── main.ts # Entry point
|
||||
├── Dockerfile
|
||||
├── nest-cli.json
|
||||
├── package.json
|
||||
└── README.md
|
||||
```
|
||||
|
||||
## 🔧 Configuração
|
||||
|
||||
### Variáveis de Ambiente
|
||||
|
||||
Crie um arquivo `.env` na raiz do projeto:
|
||||
|
||||
```bash
|
||||
# Database
|
||||
DATABASE_URL="postgresql://user:password@localhost:5432/saveinmed?schema=public"
|
||||
|
||||
# JWT
|
||||
JWT_SECRET="your-secret-key-here"
|
||||
JWT_REFRESH_SECRET="your-refresh-secret-key-here"
|
||||
JWT_EXPIRES_IN="15m"
|
||||
JWT_REFRESH_EXPIRES_IN="7d"
|
||||
|
||||
# Server
|
||||
PORT=3000
|
||||
NODE_ENV=development
|
||||
```
|
||||
|
||||
### Pré-requisitos
|
||||
|
||||
- Node.js 20+
|
||||
- pnpm 8+ (gerenciador de pacotes)
|
||||
- PostgreSQL 14+
|
||||
|
||||
## 🏃 Execução Local
|
||||
|
||||
```bash
|
||||
# Instalar dependências
|
||||
pnpm install
|
||||
|
||||
# Gerar Prisma Client
|
||||
pnpm prisma:generate
|
||||
|
||||
# Executar migrations
|
||||
pnpm prisma migrate dev
|
||||
|
||||
# Modo desenvolvimento
|
||||
pnpm start:dev
|
||||
|
||||
# Modo debug
|
||||
pnpm start:debug
|
||||
|
||||
# API estará disponível em http://localhost:3000
|
||||
# Swagger UI em http://localhost:3000/api
|
||||
```
|
||||
|
||||
## 🏗️ Build e Produção
|
||||
|
||||
```bash
|
||||
# Build
|
||||
pnpm build
|
||||
|
||||
# Executar em produção
|
||||
pnpm start
|
||||
|
||||
# Ou com PM2
|
||||
pm2 start dist/main.js --name saveinmed-backoffice
|
||||
```
|
||||
|
||||
## 🐳 Docker
|
||||
|
||||
```bash
|
||||
# Build da imagem
|
||||
docker build -t saveinmed-backoffice:latest .
|
||||
|
||||
# Executar container
|
||||
docker run -p 3000:3000 \
|
||||
-e DATABASE_URL="postgresql://..." \
|
||||
-e JWT_SECRET="..." \
|
||||
saveinmed-backoffice:latest
|
||||
```
|
||||
|
||||
## 📚 Documentação da API
|
||||
|
||||
A documentação completa da API está disponível via Swagger UI:
|
||||
|
||||
```
|
||||
http://localhost:3000/api
|
||||
```
|
||||
|
||||
### Principais Endpoints
|
||||
|
||||
#### Autenticação
|
||||
- `POST /auth/login` - Login de usuário
|
||||
- `POST /auth/refresh` - Renovar access token
|
||||
- `GET /auth/me` - Obter usuário autenticado
|
||||
|
||||
#### Usuários
|
||||
- `GET /users` - Listar usuários
|
||||
- `POST /users` - Criar usuário
|
||||
- `GET /users/:id` - Obter usuário por ID
|
||||
- `PATCH /users/:id` - Atualizar usuário
|
||||
- `DELETE /users/:id` - Deletar usuário
|
||||
|
||||
#### Inventário
|
||||
- `GET /inventory` - Listar itens do inventário
|
||||
- `POST /inventory/purchase` - Registrar compra
|
||||
- `GET /inventory/:id` - Obter item por ID
|
||||
|
||||
#### Webhooks
|
||||
- `POST /webhooks/mercadopago` - Webhook do Mercado Pago
|
||||
|
||||
## 🗄️ Prisma
|
||||
|
||||
### Migrations
|
||||
|
||||
```bash
|
||||
# Criar nova migration
|
||||
pnpm prisma migrate dev --name nome_da_migration
|
||||
|
||||
# Aplicar migrations em produção
|
||||
pnpm prisma migrate deploy
|
||||
|
||||
# Resetar banco de dados (desenvolvimento)
|
||||
pnpm prisma migrate reset
|
||||
```
|
||||
|
||||
### Prisma Studio
|
||||
|
||||
```bash
|
||||
# Abrir interface visual do banco de dados
|
||||
pnpm prisma studio
|
||||
```
|
||||
|
||||
## 🧪 Testes
|
||||
|
||||
```bash
|
||||
# Testes unitários
|
||||
pnpm test
|
||||
|
||||
# Testes e2e
|
||||
pnpm test:e2e
|
||||
|
||||
# Coverage
|
||||
pnpm test:cov
|
||||
```
|
||||
|
||||
## 🔒 Segurança
|
||||
|
||||
- Senhas hasheadas com bcrypt (salt rounds: 10)
|
||||
- JWT com expiração curta (15 minutos)
|
||||
- Refresh tokens com rotação automática
|
||||
- Validação de entrada com class-validator
|
||||
- Guards para proteção de rotas
|
||||
- CORS configurado adequadamente
|
||||
|
||||
## 🔗 Integração com Outros Componentes
|
||||
|
||||
- **Backend (Go API)**: Compartilha o mesmo banco de dados PostgreSQL
|
||||
- **SaveInMed Frontend**: Consome esta API para operações administrativas
|
||||
- **Mercado Pago**: Recebe webhooks de notificação de pagamento
|
||||
|
||||
## 📝 Licença
|
||||
|
||||
MIT
|
||||
5
marketplace-front/.gitignore
vendored
5
marketplace-front/.gitignore
vendored
|
|
@ -1,5 +0,0 @@
|
|||
node_modules
|
||||
.dist
|
||||
dist
|
||||
.env*
|
||||
*.tsbuildinfo
|
||||
51
marketplace/.gitignore
vendored
Normal file
51
marketplace/.gitignore
vendored
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
# Dependencies
|
||||
node_modules/
|
||||
.pnp
|
||||
.pnp.js
|
||||
|
||||
# Build output
|
||||
dist/
|
||||
.dist/
|
||||
dist-ssr/
|
||||
build/
|
||||
*.local
|
||||
|
||||
# Environment variables
|
||||
.env
|
||||
.env*
|
||||
.env.local
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
|
||||
# Logs
|
||||
logs/
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
# Testing
|
||||
coverage/
|
||||
|
||||
# Vite
|
||||
.vite/
|
||||
|
||||
# TypeScript
|
||||
*.tsbuildinfo
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/
|
||||
.idea/
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
*.swp
|
||||
*.swo
|
||||
|
||||
# OS
|
||||
.DS_Store
|
||||
Thumbs.db
|
||||
297
marketplace/README.md
Normal file
297
marketplace/README.md
Normal file
|
|
@ -0,0 +1,297 @@
|
|||
# SaveInMed Marketplace Frontend
|
||||
|
||||
Interface do usuário do marketplace B2B farmacêutico SaveInMed, desenvolvida com React e Vite.
|
||||
|
||||
## 🎯 Propósito
|
||||
|
||||
Este é o frontend do marketplace SaveInMed, onde farmácias e distribuidoras podem:
|
||||
- Navegar e pesquisar produtos farmacêuticos
|
||||
- Adicionar produtos ao carrinho
|
||||
- Realizar pedidos e checkout
|
||||
- Gerenciar perfil e histórico de compras
|
||||
- Acompanhar status de pedidos
|
||||
- Processar pagamentos via Mercado Pago
|
||||
|
||||
## 🚀 Tecnologias
|
||||
|
||||
- **React 18** - Biblioteca UI
|
||||
- **TypeScript** - Tipagem estática
|
||||
- **Vite 5** - Build tool e dev server ultra-rápido
|
||||
- **React Router DOM 6** - Roteamento
|
||||
- **TailwindCSS 3** - Framework CSS utility-first
|
||||
- **Zustand 4** - Gerenciamento de estado
|
||||
- **Axios** - Cliente HTTP
|
||||
- **Mercado Pago SDK React** - Integração de pagamentos
|
||||
- **React Window** - Virtualização de listas para performance
|
||||
|
||||
## 📋 Funcionalidades
|
||||
|
||||
### Catálogo de Produtos
|
||||
- Listagem de produtos com virtualização
|
||||
- Busca e filtros avançados
|
||||
- Detalhes de produtos
|
||||
- Informações de lote e validade
|
||||
|
||||
### Carrinho de Compras
|
||||
- Adicionar/remover produtos
|
||||
- Atualizar quantidades
|
||||
- Persistência local com Zustand
|
||||
- Cálculo automático de totais
|
||||
|
||||
### Checkout e Pagamentos
|
||||
- Fluxo de checkout simplificado
|
||||
- Integração com Mercado Pago
|
||||
- Múltiplas formas de pagamento
|
||||
- Confirmação de pedido
|
||||
|
||||
### Autenticação
|
||||
- Login de usuários
|
||||
- Rotas protegidas
|
||||
- Contexto de autenticação
|
||||
- Persistência de sessão
|
||||
|
||||
### Dashboard
|
||||
- Visão geral de pedidos
|
||||
- Histórico de compras
|
||||
- Estatísticas de uso
|
||||
|
||||
### Perfil
|
||||
- Gerenciamento de dados pessoais
|
||||
- Endereços de entrega
|
||||
- Preferências
|
||||
|
||||
## 🏗️ Arquitetura
|
||||
|
||||
```
|
||||
marketplace/
|
||||
├── src/
|
||||
│ ├── components/
|
||||
│ │ └── ProtectedRoute.tsx # Componente de rota protegida
|
||||
│ ├── context/
|
||||
│ │ └── AuthContext.tsx # Contexto de autenticação
|
||||
│ ├── hooks/
|
||||
│ │ └── usePersistentFilters.ts # Hook para filtros persistentes
|
||||
│ ├── layouts/
|
||||
│ │ └── Shell.tsx # Layout principal
|
||||
│ ├── pages/
|
||||
│ │ ├── Cart.tsx # Página do carrinho
|
||||
│ │ ├── Checkout.tsx # Página de checkout
|
||||
│ │ ├── Dashboard.tsx # Dashboard do usuário
|
||||
│ │ ├── Login.tsx # Página de login
|
||||
│ │ └── Profile.tsx # Página de perfil
|
||||
│ ├── services/
|
||||
│ │ └── apiClient.ts # Cliente API configurado
|
||||
│ ├── stores/
|
||||
│ │ └── cartStore.ts # Store Zustand do carrinho
|
||||
│ ├── types/
|
||||
│ │ └── product.ts # Tipos TypeScript
|
||||
│ ├── App.tsx # Componente raiz
|
||||
│ ├── main.tsx # Entry point
|
||||
│ └── index.css # Estilos globais
|
||||
├── index.html
|
||||
├── vite.config.ts
|
||||
├── tailwind.config.ts
|
||||
├── tsconfig.json
|
||||
└── README.md
|
||||
```
|
||||
|
||||
## 🔧 Configuração
|
||||
|
||||
### Variáveis de Ambiente
|
||||
|
||||
Crie um arquivo `.env` na raiz do projeto:
|
||||
|
||||
```bash
|
||||
# API Backend
|
||||
VITE_API_URL=http://localhost:8080
|
||||
|
||||
# Mercado Pago
|
||||
VITE_MERCADOPAGO_PUBLIC_KEY=your-public-key-here
|
||||
|
||||
# Ambiente
|
||||
VITE_ENV=development
|
||||
```
|
||||
|
||||
### Pré-requisitos
|
||||
|
||||
- Node.js 20+
|
||||
- npm ou yarn
|
||||
|
||||
## 🏃 Execução Local
|
||||
|
||||
```bash
|
||||
# Instalar dependências
|
||||
npm install
|
||||
|
||||
# Modo desenvolvimento
|
||||
npm run dev
|
||||
|
||||
# Aplicação estará disponível em http://localhost:5173
|
||||
```
|
||||
|
||||
## 🏗️ Build e Produção
|
||||
|
||||
```bash
|
||||
# Build para produção
|
||||
npm run build
|
||||
|
||||
# Preview do build
|
||||
npm run preview
|
||||
|
||||
# Arquivos de produção estarão em ./dist
|
||||
```
|
||||
|
||||
## 🎨 Estilização
|
||||
|
||||
O projeto utiliza TailwindCSS para estilização. Principais recursos:
|
||||
|
||||
- **Utility-first**: Classes utilitárias para estilização rápida
|
||||
- **Responsivo**: Design mobile-first
|
||||
- **Dark mode**: Suporte a tema escuro (se implementado)
|
||||
- **Customização**: Configuração em `tailwind.config.ts`
|
||||
|
||||
### Exemplo de Componente
|
||||
|
||||
```tsx
|
||||
export function ProductCard({ product }: { product: Product }) {
|
||||
return (
|
||||
<div className="bg-white rounded-lg shadow-md p-4 hover:shadow-lg transition-shadow">
|
||||
<h3 className="text-lg font-semibold text-gray-900">{product.name}</h3>
|
||||
<p className="text-gray-600 mt-2">{product.description}</p>
|
||||
<div className="mt-4 flex justify-between items-center">
|
||||
<span className="text-xl font-bold text-green-600">
|
||||
R$ {product.price.toFixed(2)}
|
||||
</span>
|
||||
<button className="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700">
|
||||
Adicionar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## 🔐 Autenticação
|
||||
|
||||
O sistema de autenticação utiliza Context API:
|
||||
|
||||
```tsx
|
||||
import { useAuth } from './context/AuthContext';
|
||||
|
||||
function MyComponent() {
|
||||
const { user, login, logout } = useAuth();
|
||||
|
||||
return (
|
||||
<div>
|
||||
{user ? (
|
||||
<button onClick={logout}>Sair</button>
|
||||
) : (
|
||||
<button onClick={() => login(email, password)}>Entrar</button>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## 🛒 Gerenciamento de Estado (Zustand)
|
||||
|
||||
O carrinho de compras é gerenciado com Zustand:
|
||||
|
||||
```tsx
|
||||
import { useCartStore } from './stores/cartStore';
|
||||
|
||||
function ProductPage() {
|
||||
const addItem = useCartStore(state => state.addItem);
|
||||
|
||||
return (
|
||||
<button onClick={() => addItem(product)}>
|
||||
Adicionar ao Carrinho
|
||||
</button>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## 🧪 Testes
|
||||
|
||||
```bash
|
||||
# Executar testes (quando configurados)
|
||||
npm test
|
||||
|
||||
# Coverage
|
||||
npm run test:coverage
|
||||
```
|
||||
|
||||
## 📱 Responsividade
|
||||
|
||||
O marketplace é totalmente responsivo, com breakpoints:
|
||||
|
||||
- **Mobile**: < 640px
|
||||
- **Tablet**: 640px - 1024px
|
||||
- **Desktop**: > 1024px
|
||||
|
||||
## ⚡ Performance
|
||||
|
||||
Otimizações implementadas:
|
||||
|
||||
- **Virtualização de listas**: React Window para listas longas
|
||||
- **Code splitting**: Lazy loading de rotas
|
||||
- **Vite**: Build ultra-rápido
|
||||
- **Zustand**: State management leve e performático
|
||||
- **Memoização**: React.memo e useMemo onde apropriado
|
||||
|
||||
## 🔗 Integração com APIs
|
||||
|
||||
### Backend Go API
|
||||
```typescript
|
||||
import apiClient from './services/apiClient';
|
||||
|
||||
// Buscar produtos
|
||||
const products = await apiClient.get('/api/v1/products');
|
||||
|
||||
// Criar pedido
|
||||
const order = await apiClient.post('/api/v1/orders', orderData);
|
||||
```
|
||||
|
||||
### Mercado Pago
|
||||
```tsx
|
||||
import { initMercadoPago, Wallet } from '@mercadopago/sdk-react';
|
||||
|
||||
initMercadoPago(import.meta.env.VITE_MERCADOPAGO_PUBLIC_KEY);
|
||||
|
||||
function CheckoutButton({ preferenceId }: { preferenceId: string }) {
|
||||
return <Wallet initialization={{ preferenceId }} />;
|
||||
}
|
||||
```
|
||||
|
||||
## 🚀 Deploy
|
||||
|
||||
### Vercel
|
||||
```bash
|
||||
npm install -g vercel
|
||||
vercel
|
||||
```
|
||||
|
||||
### Netlify
|
||||
```bash
|
||||
npm run build
|
||||
# Fazer upload da pasta dist/
|
||||
```
|
||||
|
||||
### Docker
|
||||
```bash
|
||||
# Build
|
||||
docker build -t saveinmed-marketplace:latest .
|
||||
|
||||
# Run
|
||||
docker run -p 80:80 saveinmed-marketplace:latest
|
||||
```
|
||||
|
||||
## 🔗 Integração com Outros Componentes
|
||||
|
||||
- **Backend (Go API)**: Consome endpoints de produtos, pedidos e pagamentos
|
||||
- **Backoffice (NestJS)**: Consome endpoints administrativos
|
||||
- **SaveInMed BFF**: Pode usar como proxy para múltiplas APIs
|
||||
|
||||
## 📝 Licença
|
||||
|
||||
MIT
|
||||
67
saveinmed-bff/.gitignore
vendored
67
saveinmed-bff/.gitignore
vendored
|
|
@ -1,7 +1,66 @@
|
|||
# Byte-compiled / optimized / DLL files
|
||||
__pycache__/
|
||||
*.py[cod]
|
||||
*$py.class
|
||||
*.so
|
||||
|
||||
# Distribution / packaging
|
||||
.Python
|
||||
build/
|
||||
develop-eggs/
|
||||
dist/
|
||||
downloads/
|
||||
eggs/
|
||||
.eggs/
|
||||
lib/
|
||||
lib64/
|
||||
parts/
|
||||
sdist/
|
||||
var/
|
||||
wheels/
|
||||
*.egg-info/
|
||||
.installed.cfg
|
||||
*.egg
|
||||
|
||||
# Virtual environments
|
||||
.venv/
|
||||
*.pyc
|
||||
.pytest_cache/
|
||||
.mypy_cache/
|
||||
.DS_Store
|
||||
venv/
|
||||
env/
|
||||
ENV/
|
||||
env.bak/
|
||||
venv.bak/
|
||||
|
||||
# Environment variables
|
||||
.env
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Testing
|
||||
.pytest_cache/
|
||||
.coverage
|
||||
htmlcov/
|
||||
.tox/
|
||||
.nox/
|
||||
|
||||
# Logs
|
||||
*.log
|
||||
logs/
|
||||
|
||||
# IDE
|
||||
.vscode/
|
||||
.idea/
|
||||
*.swp
|
||||
*.swo
|
||||
.pytype/
|
||||
|
||||
# OS
|
||||
.DS_Store
|
||||
Thumbs.db
|
||||
|
||||
# MyPy
|
||||
.mypy_cache/
|
||||
.dmypy.json
|
||||
dmypy.json
|
||||
|
||||
# Pyre
|
||||
.pyre/
|
||||
|
|
|
|||
53
saveinmed-frontend/.gitignore
vendored
53
saveinmed-frontend/.gitignore
vendored
|
|
@ -1,7 +1,8 @@
|
|||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
# dependencies
|
||||
# Dependencies
|
||||
/node_modules
|
||||
node_modules/
|
||||
/.pnp
|
||||
.pnp.*
|
||||
.yarn/*
|
||||
|
|
@ -10,33 +11,55 @@
|
|||
!.yarn/releases
|
||||
!.yarn/versions
|
||||
|
||||
# testing
|
||||
# Testing
|
||||
/coverage
|
||||
coverage/
|
||||
|
||||
# next.js
|
||||
# Next.js
|
||||
/.next/
|
||||
/out/
|
||||
.next/
|
||||
next-env.d.ts
|
||||
|
||||
# production
|
||||
# Production
|
||||
/build
|
||||
build/
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
*.pem
|
||||
# Environment variables
|
||||
.env
|
||||
.env*
|
||||
.env*.local
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
!*.example
|
||||
|
||||
# debug
|
||||
# Logs
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
.pnpm-debug.log*
|
||||
pnpm-debug.log*
|
||||
*.log
|
||||
logs/
|
||||
|
||||
# env files (can opt-in for committing if needed)
|
||||
.env*
|
||||
!*.example
|
||||
|
||||
# vercel
|
||||
# Vercel
|
||||
.vercel
|
||||
|
||||
# typescript
|
||||
# TypeScript
|
||||
*.tsbuildinfo
|
||||
next-env.d.ts
|
||||
|
||||
# IDE
|
||||
.vscode/
|
||||
.idea/
|
||||
*.swp
|
||||
*.swo
|
||||
|
||||
# OS
|
||||
.DS_Store
|
||||
*.pem
|
||||
Thumbs.db
|
||||
|
||||
# Temporary files
|
||||
*.tmp
|
||||
.cache/
|
||||
|
|
|
|||
372
saveinmed-frontend/README.md
Normal file
372
saveinmed-frontend/README.md
Normal file
|
|
@ -0,0 +1,372 @@
|
|||
# SaveInMed Frontend
|
||||
|
||||
Frontend principal da plataforma SaveInMed, desenvolvido com Next.js 15 e React 19.
|
||||
|
||||
## 🎯 Propósito
|
||||
|
||||
Este é o frontend principal e mais completo do SaveInMed, oferecendo:
|
||||
- Interface completa para farmácias e distribuidoras
|
||||
- Gestão de catálogo de produtos
|
||||
- Sistema de pedidos e pagamentos
|
||||
- Dashboard administrativo
|
||||
- Integração com Appwrite para backend
|
||||
- Checkout com Mercado Pago
|
||||
- Sistema de notificações em tempo real
|
||||
|
||||
## 🚀 Tecnologias
|
||||
|
||||
- **Next.js 15.3** - Framework React com SSR e SSG
|
||||
- **React 19** - Biblioteca UI mais recente
|
||||
- **TypeScript 5** - Tipagem estática
|
||||
- **TailwindCSS 4** - Framework CSS utility-first (última versão)
|
||||
- **Appwrite 18** - Backend as a Service
|
||||
- **Axios** - Cliente HTTP
|
||||
- **Mercado Pago SDK React** - Integração de pagamentos
|
||||
- **Chart.js** - Gráficos e visualizações
|
||||
- **Lucide React** - Ícones modernos
|
||||
- **React Hot Toast** - Notificações toast
|
||||
- **Nodemailer** - Envio de emails
|
||||
|
||||
## 📋 Funcionalidades
|
||||
|
||||
### Autenticação e Autorização
|
||||
- Login e registro com Appwrite
|
||||
- Autenticação via email
|
||||
- Proteção de rotas
|
||||
- Sessões persistentes
|
||||
- Recuperação de senha
|
||||
|
||||
### Gestão de Produtos
|
||||
- Catálogo completo de produtos
|
||||
- Busca e filtros avançados
|
||||
- Categorias e subcategorias
|
||||
- Informações de laboratórios
|
||||
- Controle de lote e validade
|
||||
- Upload de imagens
|
||||
|
||||
### Pedidos e Vendas
|
||||
- Carrinho de compras
|
||||
- Checkout integrado
|
||||
- Processamento de pagamentos
|
||||
- Acompanhamento de pedidos
|
||||
- Histórico de compras
|
||||
- Notas fiscais
|
||||
|
||||
### Dashboard
|
||||
- Visão geral de vendas
|
||||
- Gráficos e métricas
|
||||
- Relatórios personalizados
|
||||
- Analytics em tempo real
|
||||
|
||||
### Gestão de Empresas
|
||||
- Cadastro de empresas
|
||||
- Dados da Receita Federal (integração)
|
||||
- Endereços e contatos
|
||||
- Configurações de frete
|
||||
- Geocodificação automática
|
||||
|
||||
### Notificações
|
||||
- Toast notifications
|
||||
- Emails transacionais
|
||||
- Alertas de estoque
|
||||
- Confirmações de pedido
|
||||
|
||||
## 🏗️ Arquitetura
|
||||
|
||||
```
|
||||
saveinmed-frontend/
|
||||
├── src/
|
||||
│ ├── app/ # App Router (Next.js 15)
|
||||
│ │ ├── (auth)/ # Grupo de rotas de autenticação
|
||||
│ │ ├── (dashboard)/ # Grupo de rotas do dashboard
|
||||
│ │ ├── api/ # API Routes
|
||||
│ │ ├── layout.tsx # Layout raiz
|
||||
│ │ └── page.tsx # Página inicial
|
||||
│ ├── components/ # Componentes reutilizáveis
|
||||
│ │ ├── ui/ # Componentes de UI base
|
||||
│ │ ├── forms/ # Formulários
|
||||
│ │ └── charts/ # Gráficos
|
||||
│ ├── lib/ # Bibliotecas e utilitários
|
||||
│ │ ├── appwrite.ts # Cliente Appwrite
|
||||
│ │ ├── api.ts # Cliente API
|
||||
│ │ └── utils.ts # Funções utilitárias
|
||||
│ ├── hooks/ # Custom hooks
|
||||
│ ├── types/ # Tipos TypeScript
|
||||
│ ├── styles/ # Estilos globais
|
||||
│ └── config/ # Configurações
|
||||
├── public/ # Arquivos estáticos
|
||||
├── next.config.ts
|
||||
├── tailwind.config.ts
|
||||
├── tsconfig.json
|
||||
└── README.md
|
||||
```
|
||||
|
||||
## 🔧 Configuração
|
||||
|
||||
### Variáveis de Ambiente
|
||||
|
||||
Crie um arquivo `.env.local` na raiz do projeto:
|
||||
|
||||
```bash
|
||||
# Appwrite
|
||||
NEXT_PUBLIC_APPWRITE_ENDPOINT=https://cloud.appwrite.io/v1
|
||||
NEXT_PUBLIC_APPWRITE_PROJECT_ID=your-project-id
|
||||
NEXT_PUBLIC_APPWRITE_DATABASE_ID=your-database-id
|
||||
|
||||
# Collections IDs
|
||||
NEXT_PUBLIC_APPWRITE_COLLECTION_PRODUTOS_CATALOGO_ID=produtos-catalogo
|
||||
NEXT_PUBLIC_APPWRITE_COLLECTION_LABORATORIOS_ID=laboratorios
|
||||
NEXT_PUBLIC_APPWRITE_COLLECTION_CATEGORIAS_ID=categorias
|
||||
NEXT_PUBLIC_APPWRITE_COLLECTION_SUBCATEGORIAS_ID=subcategorias
|
||||
NEXT_PUBLIC_APPWRITE_COLLECTION_CARRINHOS_ID=carrinhos
|
||||
NEXT_PUBLIC_APPWRITE_COLLECTION_PEDIDOS_ID=pedidos
|
||||
NEXT_PUBLIC_APPWRITE_COLLECTION_USUARIOS_ID=usuarios
|
||||
NEXT_PUBLIC_APPWRITE_COLLECTION_EMPRESAS_ID=empresas
|
||||
NEXT_PUBLIC_APPWRITE_COLLECTION_EMPRESAS_DADOS_ID=empresas-dados
|
||||
NEXT_PUBLIC_APPWRITE_COLLECTION_ENDERECOS_ID=enderecos
|
||||
|
||||
# Mercado Pago
|
||||
NEXT_PUBLIC_MERCADOPAGO_PUBLIC_KEY=your-public-key
|
||||
MERCADOPAGO_ACCESS_TOKEN=your-access-token
|
||||
|
||||
# Email (Nodemailer)
|
||||
EMAIL_HOST=smtp.gmail.com
|
||||
EMAIL_PORT=587
|
||||
EMAIL_USER=your-email@gmail.com
|
||||
EMAIL_PASSWORD=your-app-password
|
||||
|
||||
# Mapbox (para geocodificação)
|
||||
MAPBOX_ACCESS_TOKEN=your-mapbox-token
|
||||
|
||||
# App
|
||||
NEXT_PUBLIC_APP_URL=http://localhost:3000
|
||||
```
|
||||
|
||||
### Pré-requisitos
|
||||
|
||||
- Node.js 20+
|
||||
- npm, yarn ou pnpm
|
||||
- Conta Appwrite configurada
|
||||
- Conta Mercado Pago (para pagamentos)
|
||||
|
||||
## 🏃 Execução Local
|
||||
|
||||
```bash
|
||||
# Instalar dependências
|
||||
npm install
|
||||
|
||||
# Modo desenvolvimento com Turbopack
|
||||
npm run dev
|
||||
|
||||
# Aplicação estará disponível em http://localhost:3000
|
||||
```
|
||||
|
||||
## 🏗️ Build e Produção
|
||||
|
||||
```bash
|
||||
# Build para produção
|
||||
npm run build
|
||||
|
||||
# Executar build de produção
|
||||
npm start
|
||||
|
||||
# Lint
|
||||
npm run lint
|
||||
```
|
||||
|
||||
## 🎨 Estilização com TailwindCSS 4
|
||||
|
||||
O projeto utiliza a versão mais recente do TailwindCSS com PostCSS:
|
||||
|
||||
```css
|
||||
/* src/app/globals.css */
|
||||
@import "tailwindcss";
|
||||
|
||||
@theme {
|
||||
--color-primary: #3b82f6;
|
||||
--color-secondary: #8b5cf6;
|
||||
}
|
||||
```
|
||||
|
||||
## 📱 Responsividade
|
||||
|
||||
Design totalmente responsivo com breakpoints customizados:
|
||||
|
||||
- **Mobile**: < 640px
|
||||
- **Tablet**: 640px - 1024px
|
||||
- **Desktop**: > 1024px
|
||||
- **Wide**: > 1536px
|
||||
|
||||
## 🔐 Autenticação com Appwrite
|
||||
|
||||
```typescript
|
||||
import { account } from '@/lib/appwrite';
|
||||
|
||||
// Login
|
||||
const session = await account.createEmailPasswordSession(email, password);
|
||||
|
||||
// Registro
|
||||
const user = await account.create('unique()', email, password, name);
|
||||
|
||||
// Logout
|
||||
await account.deleteSession('current');
|
||||
|
||||
// Obter usuário atual
|
||||
const user = await account.get();
|
||||
```
|
||||
|
||||
## 💾 Banco de Dados (Appwrite)
|
||||
|
||||
```typescript
|
||||
import { databases } from '@/lib/appwrite';
|
||||
|
||||
// Listar documentos
|
||||
const products = await databases.listDocuments(
|
||||
databaseId,
|
||||
collectionId,
|
||||
[Query.limit(25)]
|
||||
);
|
||||
|
||||
// Criar documento
|
||||
const product = await databases.createDocument(
|
||||
databaseId,
|
||||
collectionId,
|
||||
'unique()',
|
||||
data
|
||||
);
|
||||
|
||||
// Atualizar documento
|
||||
await databases.updateDocument(databaseId, collectionId, documentId, data);
|
||||
|
||||
// Deletar documento
|
||||
await databases.deleteDocument(databaseId, collectionId, documentId);
|
||||
```
|
||||
|
||||
## 💳 Integração Mercado Pago
|
||||
|
||||
```typescript
|
||||
import { initMercadoPago, Payment } from '@mercadopago/sdk-react';
|
||||
|
||||
initMercadoPago(process.env.NEXT_PUBLIC_MERCADOPAGO_PUBLIC_KEY!);
|
||||
|
||||
function CheckoutPage() {
|
||||
return (
|
||||
<Payment
|
||||
initialization={{ amount: 100, preferenceId: 'xxx' }}
|
||||
onSubmit={handlePayment}
|
||||
/>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## 📊 Gráficos com Chart.js
|
||||
|
||||
```typescript
|
||||
import { Line } from 'react-chartjs-2';
|
||||
|
||||
function SalesChart({ data }: { data: number[] }) {
|
||||
return (
|
||||
<Line
|
||||
data={{
|
||||
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
|
||||
datasets: [{
|
||||
label: 'Vendas',
|
||||
data: data,
|
||||
borderColor: 'rgb(75, 192, 192)',
|
||||
}]
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## 🧪 Testes
|
||||
|
||||
```bash
|
||||
# Testes unitários (quando configurados)
|
||||
npm test
|
||||
|
||||
# E2E tests (quando configurados)
|
||||
npm run test:e2e
|
||||
```
|
||||
|
||||
## ⚡ Performance
|
||||
|
||||
Otimizações implementadas:
|
||||
|
||||
- **Next.js 15**: App Router com React Server Components
|
||||
- **Turbopack**: Dev server ultra-rápido
|
||||
- **Image Optimization**: next/image para otimização automática
|
||||
- **Font Optimization**: next/font para carregamento eficiente
|
||||
- **Code Splitting**: Automático por rota
|
||||
- **ISR**: Incremental Static Regeneration
|
||||
- **Edge Runtime**: Para rotas que precisam de baixa latência
|
||||
|
||||
## 🚀 Deploy
|
||||
|
||||
### Vercel (Recomendado)
|
||||
```bash
|
||||
# Instalar Vercel CLI
|
||||
npm i -g vercel
|
||||
|
||||
# Deploy
|
||||
vercel
|
||||
|
||||
# Deploy para produção
|
||||
vercel --prod
|
||||
```
|
||||
|
||||
### Docker
|
||||
```bash
|
||||
# Build
|
||||
docker build -t saveinmed-frontend:latest .
|
||||
|
||||
# Run
|
||||
docker run -p 3000:3000 saveinmed-frontend:latest
|
||||
```
|
||||
|
||||
### Outras Plataformas
|
||||
- **Netlify**: Suporte completo para Next.js
|
||||
- **AWS Amplify**: Deploy automático
|
||||
- **Railway**: Deploy simplificado
|
||||
|
||||
## 📧 Envio de Emails
|
||||
|
||||
```typescript
|
||||
import { sendEmail } from '@/lib/email';
|
||||
|
||||
await sendEmail({
|
||||
to: 'customer@example.com',
|
||||
subject: 'Pedido Confirmado',
|
||||
html: '<h1>Seu pedido foi confirmado!</h1>',
|
||||
});
|
||||
```
|
||||
|
||||
## 🗺️ Geocodificação
|
||||
|
||||
```typescript
|
||||
import { geocodeAddress } from '@/lib/mapbox';
|
||||
|
||||
const coordinates = await geocodeAddress('Rua Example, 123, São Paulo, SP');
|
||||
// { latitude: -23.5505, longitude: -46.6333 }
|
||||
```
|
||||
|
||||
## 🔗 Integração com Outros Componentes
|
||||
|
||||
- **Appwrite**: Backend principal para autenticação e dados
|
||||
- **Backend (Go API)**: Operações de alta performance
|
||||
- **Backoffice (NestJS)**: Funcionalidades administrativas
|
||||
- **SaveInMed BFF**: Proxy e agregação de dados
|
||||
- **Mercado Pago**: Processamento de pagamentos
|
||||
|
||||
## 📝 Documentação Adicional
|
||||
|
||||
Veja os arquivos de documentação na raiz do projeto:
|
||||
- `CONFIGURACAO_COLLECTIONS_APPWRITE.md`
|
||||
- `IMPLEMENTACAO_MERCADOPAGO_CHECKOUT.md`
|
||||
- `MELHORIAS_GESTAO_CATALOGO_PRODUTOS.md`
|
||||
- E outros...
|
||||
|
||||
## 📝 Licença
|
||||
|
||||
MIT
|
||||
|
|
@ -1,24 +1,416 @@
|
|||
# Fresh project
|
||||
# SaveInMed Website
|
||||
|
||||
Your new Fresh project is ready to go. You can follow the Fresh "Getting
|
||||
Started" guide here: https://fresh.deno.dev/docs/getting-started
|
||||
Site institucional do SaveInMed, desenvolvido com Fresh (Deno framework).
|
||||
|
||||
### Usage
|
||||
## 🎯 Propósito
|
||||
|
||||
Make sure to install Deno:
|
||||
https://docs.deno.com/runtime/getting_started/installation
|
||||
Este é o site institucional e de marketing do SaveInMed, responsável por:
|
||||
- Apresentar a plataforma para novos usuários
|
||||
- Landing pages de produtos e serviços
|
||||
- Captura de leads
|
||||
- Informações sobre a empresa
|
||||
- Blog e conteúdo educacional
|
||||
- SEO otimizado para aquisição orgânica
|
||||
|
||||
Then start the project in development mode:
|
||||
## 🚀 Tecnologias
|
||||
|
||||
- **Fresh v2** - Framework web moderno para Deno
|
||||
- **Deno 2** - Runtime JavaScript/TypeScript seguro
|
||||
- **Preact** - Biblioteca UI leve (3KB)
|
||||
- **Tailwind CSS** - Framework CSS utility-first
|
||||
- **Islands Architecture** - Hidratação parcial para performance máxima
|
||||
|
||||
## 📋 Funcionalidades
|
||||
|
||||
### Landing Pages
|
||||
- Página inicial institucional
|
||||
- Páginas de produtos
|
||||
- Casos de uso
|
||||
- Preços e planos
|
||||
|
||||
### Captura de Leads
|
||||
- Formulários de contato
|
||||
- Newsletter signup
|
||||
- Demonstração agendada
|
||||
- Download de materiais
|
||||
|
||||
### Conteúdo
|
||||
- Blog posts
|
||||
- Artigos educacionais
|
||||
- FAQ
|
||||
- Documentação pública
|
||||
|
||||
### SEO
|
||||
- Meta tags otimizadas
|
||||
- Open Graph
|
||||
- Schema.org markup
|
||||
- Sitemap XML
|
||||
- robots.txt
|
||||
|
||||
## 🏗️ Arquitetura (Fresh Islands)
|
||||
|
||||
```
|
||||
website/
|
||||
├── routes/ # Rotas baseadas em arquivo
|
||||
│ ├── index.tsx # Página inicial
|
||||
│ ├── about.tsx # Sobre nós
|
||||
│ ├── contact.tsx # Contato
|
||||
│ ├── blog/
|
||||
│ │ ├── index.tsx # Lista de posts
|
||||
│ │ └── [slug].tsx # Post individual
|
||||
│ └── api/ # API routes
|
||||
│ └── newsletter.ts # Endpoint de newsletter
|
||||
├── islands/ # Componentes interativos (client-side)
|
||||
│ ├── FlowTicker.tsx # Ticker animado
|
||||
│ ├── LeadForm.tsx # Formulário de captura
|
||||
│ └── ContactForm.tsx # Formulário de contato
|
||||
├── components/ # Componentes estáticos (SSR)
|
||||
│ ├── Header.tsx
|
||||
│ ├── Footer.tsx
|
||||
│ └── Hero.tsx
|
||||
├── static/ # Arquivos estáticos
|
||||
│ ├── styles.css
|
||||
│ ├── logo.svg
|
||||
│ └── images/
|
||||
├── fresh.config.ts # Configuração do Fresh
|
||||
├── deno.json # Configuração do Deno
|
||||
└── README.md
|
||||
```
|
||||
|
||||
## 🔧 Configuração
|
||||
|
||||
### Variáveis de Ambiente
|
||||
|
||||
Crie um arquivo `.env` na raiz do projeto:
|
||||
|
||||
```bash
|
||||
# API Backend
|
||||
API_URL=https://api.saveinmed.com
|
||||
|
||||
# Email (para formulários)
|
||||
SMTP_HOST=smtp.gmail.com
|
||||
SMTP_PORT=587
|
||||
SMTP_USER=noreply@saveinmed.com
|
||||
SMTP_PASSWORD=your-password
|
||||
|
||||
# Analytics
|
||||
GOOGLE_ANALYTICS_ID=G-XXXXXXXXXX
|
||||
|
||||
# Ambiente
|
||||
DENO_ENV=development
|
||||
```
|
||||
|
||||
### Pré-requisitos
|
||||
|
||||
- Deno 2.0 ou superior
|
||||
|
||||
## 🏃 Execução Local
|
||||
|
||||
```bash
|
||||
# Executar em modo desenvolvimento
|
||||
deno task dev
|
||||
|
||||
# Site estará disponível em http://localhost:8000
|
||||
```
|
||||
|
||||
This will watch the project directory and restart as necessary.
|
||||
## 🏗️ Build e Produção
|
||||
|
||||
```bash
|
||||
# Build para produção
|
||||
deno task build
|
||||
|
||||
### Clone and deploy
|
||||
# Executar build de produção
|
||||
deno task start
|
||||
|
||||
Deploy your own version of this example with a couple of clicks
|
||||
# Preview
|
||||
deno task preview
|
||||
```
|
||||
|
||||
[](https://app.deno.com/new?clone=https://github.com/denoland/examples&path=with-fresh)
|
||||
## 🎨 Islands Architecture
|
||||
|
||||
Fresh utiliza a arquitetura de "islands" para hidratação parcial:
|
||||
|
||||
### Componentes Estáticos (SSR)
|
||||
Renderizados no servidor, sem JavaScript no cliente:
|
||||
|
||||
```tsx
|
||||
// components/Hero.tsx
|
||||
export function Hero() {
|
||||
return (
|
||||
<section class="bg-gradient-to-r from-blue-600 to-purple-600 text-white py-20">
|
||||
<h1 class="text-5xl font-bold">SaveInMed</h1>
|
||||
<p class="text-xl mt-4">Marketplace B2B Farmacêutico</p>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
### Islands (Interativos)
|
||||
Componentes que precisam de JavaScript no cliente:
|
||||
|
||||
```tsx
|
||||
// islands/LeadForm.tsx
|
||||
import { useState } from "preact/hooks";
|
||||
|
||||
export default function LeadForm() {
|
||||
const [email, setEmail] = useState("");
|
||||
|
||||
const handleSubmit = async (e: Event) => {
|
||||
e.preventDefault();
|
||||
await fetch("/api/newsletter", {
|
||||
method: "POST",
|
||||
body: JSON.stringify({ email }),
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit}>
|
||||
<input
|
||||
type="email"
|
||||
value={email}
|
||||
onInput={(e) => setEmail(e.currentTarget.value)}
|
||||
placeholder="Seu email"
|
||||
/>
|
||||
<button type="submit">Inscrever</button>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## 🛣️ Roteamento
|
||||
|
||||
Fresh usa roteamento baseado em arquivos:
|
||||
|
||||
```
|
||||
routes/
|
||||
├── index.tsx → /
|
||||
├── about.tsx → /about
|
||||
├── contact.tsx → /contact
|
||||
├── blog/
|
||||
│ ├── index.tsx → /blog
|
||||
│ └── [slug].tsx → /blog/:slug
|
||||
└── api/
|
||||
└── newsletter.ts → /api/newsletter
|
||||
```
|
||||
|
||||
## 📡 API Routes
|
||||
|
||||
```typescript
|
||||
// routes/api/newsletter.ts
|
||||
import { Handlers } from "$fresh/server.ts";
|
||||
|
||||
export const handler: Handlers = {
|
||||
async POST(req) {
|
||||
const { email } = await req.json();
|
||||
|
||||
// Salvar email no banco de dados
|
||||
await saveToNewsletter(email);
|
||||
|
||||
return new Response(JSON.stringify({ success: true }), {
|
||||
headers: { "Content-Type": "application/json" },
|
||||
});
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
## 🎨 Estilização
|
||||
|
||||
O projeto usa Tailwind CSS com configuração customizada:
|
||||
|
||||
```typescript
|
||||
// tailwind.config.ts
|
||||
export default {
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
primary: '#3b82f6',
|
||||
secondary: '#8b5cf6',
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
## 🔍 SEO
|
||||
|
||||
### Meta Tags
|
||||
```tsx
|
||||
export default function BlogPost({ data }) {
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
<title>{data.title} | SaveInMed Blog</title>
|
||||
<meta name="description" content={data.excerpt} />
|
||||
<meta property="og:title" content={data.title} />
|
||||
<meta property="og:description" content={data.excerpt} />
|
||||
<meta property="og:image" content={data.image} />
|
||||
</Head>
|
||||
<article>{/* ... */}</article>
|
||||
</>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
### Sitemap
|
||||
```typescript
|
||||
// routes/sitemap.xml.ts
|
||||
export const handler: Handlers = {
|
||||
GET() {
|
||||
const sitemap = `<?xml version="1.0" encoding="UTF-8"?>
|
||||
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
|
||||
<url>
|
||||
<loc>https://saveinmed.com/</loc>
|
||||
<priority>1.0</priority>
|
||||
</url>
|
||||
</urlset>`;
|
||||
|
||||
return new Response(sitemap, {
|
||||
headers: { "Content-Type": "application/xml" },
|
||||
});
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
## ⚡ Performance
|
||||
|
||||
Fresh é otimizado para performance máxima:
|
||||
|
||||
- **Zero JavaScript por padrão**: Apenas islands têm JS
|
||||
- **Edge rendering**: Deploy em edge para latência mínima
|
||||
- **Streaming SSR**: Renderização progressiva
|
||||
- **Automatic code splitting**: Por rota e island
|
||||
- **Preact**: Apenas 3KB de runtime
|
||||
|
||||
### Lighthouse Score Esperado
|
||||
- Performance: 95-100
|
||||
- Accessibility: 95-100
|
||||
- Best Practices: 95-100
|
||||
- SEO: 95-100
|
||||
|
||||
## 🚀 Deploy
|
||||
|
||||
### Deno Deploy (Recomendado)
|
||||
```bash
|
||||
# Instalar deployctl
|
||||
deno install -Arf https://deno.land/x/deploy/deployctl.ts
|
||||
|
||||
# Deploy
|
||||
deployctl deploy --project=saveinmed-website
|
||||
```
|
||||
|
||||
### Docker
|
||||
```bash
|
||||
# Build
|
||||
docker build -t saveinmed-website:latest .
|
||||
|
||||
# Run
|
||||
docker run -p 8000:8000 saveinmed-website:latest
|
||||
```
|
||||
|
||||
### Outras Plataformas
|
||||
- **Cloudflare Pages**: Suporte para Deno
|
||||
- **Netlify**: Via Deno runtime
|
||||
- **Vercel**: Via Deno runtime
|
||||
|
||||
## 📧 Formulários de Contato
|
||||
|
||||
```tsx
|
||||
// islands/ContactForm.tsx
|
||||
export default function ContactForm() {
|
||||
const handleSubmit = async (e: Event) => {
|
||||
e.preventDefault();
|
||||
const formData = new FormData(e.target as HTMLFormElement);
|
||||
|
||||
await fetch("/api/contact", {
|
||||
method: "POST",
|
||||
body: JSON.stringify(Object.fromEntries(formData)),
|
||||
});
|
||||
|
||||
alert("Mensagem enviada!");
|
||||
};
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit}>
|
||||
<input name="name" placeholder="Nome" required />
|
||||
<input name="email" type="email" placeholder="Email" required />
|
||||
<textarea name="message" placeholder="Mensagem" required />
|
||||
<button type="submit">Enviar</button>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## 🧪 Testes
|
||||
|
||||
```bash
|
||||
# Executar testes
|
||||
deno test
|
||||
|
||||
# Com coverage
|
||||
deno test --coverage=coverage
|
||||
|
||||
# Gerar relatório de coverage
|
||||
deno coverage coverage --lcov > coverage.lcov
|
||||
```
|
||||
|
||||
## 📊 Analytics
|
||||
|
||||
Integração com Google Analytics:
|
||||
|
||||
```tsx
|
||||
// components/Analytics.tsx
|
||||
export function Analytics() {
|
||||
return (
|
||||
<script
|
||||
async
|
||||
src={`https://www.googletagmanager.com/gtag/js?id=${GA_ID}`}
|
||||
/>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## 🔗 Integração com Outros Componentes
|
||||
|
||||
- **Backend APIs**: Links para signup e login
|
||||
- **SaveInMed Frontend**: Redirecionamento após captura de lead
|
||||
- **Blog**: Pode ser hospedado separadamente ou integrado
|
||||
|
||||
## 📝 Conteúdo
|
||||
|
||||
### Estrutura de Blog Post
|
||||
```typescript
|
||||
interface BlogPost {
|
||||
slug: string;
|
||||
title: string;
|
||||
excerpt: string;
|
||||
content: string;
|
||||
author: string;
|
||||
publishedAt: Date;
|
||||
tags: string[];
|
||||
image: string;
|
||||
}
|
||||
```
|
||||
|
||||
## 🌐 Internacionalização (i18n)
|
||||
|
||||
```typescript
|
||||
// lib/i18n.ts
|
||||
const translations = {
|
||||
pt: {
|
||||
hero: {
|
||||
title: "Marketplace B2B Farmacêutico",
|
||||
cta: "Começar Agora",
|
||||
},
|
||||
},
|
||||
en: {
|
||||
hero: {
|
||||
title: "B2B Pharmaceutical Marketplace",
|
||||
cta: "Get Started",
|
||||
},
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
## 📝 Licença
|
||||
|
||||
MIT
|
||||
|
|
|
|||
Loading…
Reference in a new issue