Pular para o conteúdo principal
Versão: Versão Mercados

Tecnologias e Ferramentas

Esta página detalha todas as tecnologias e ferramentas utilizadas no desenvolvimento da versão Mercados do Sistema Divino Alimento.

Principais Dependências Backend​

{
  "express": "^4.18.x",
  "apollo-server-express": "^3.x",
  "graphql": "^16.x",
  "sequelize": "^6.x",
  "pg": "^8.x",
  "passport": "^0.6.x",
  "passport-google-oauth20": "^2.x",
  "express-session": "^1.x",
  "dataloader": "^2.x",
  "dotenv": "^16.x"
}

Descrição das Dependências Backend​

  • Express: Framework web minimalista e flexível para Node.js
  • Apollo Server Express: Servidor GraphQL integrado com Express
  • GraphQL: Linguagem de consulta para APIs
  • Sequelize: ORM (Object-Relational Mapping) para Node.js
  • pg: Driver PostgreSQL para Node.js
  • Passport: Middleware de autenticação para Node.js
  • Passport Google OAuth20: Estratégia OAuth 2.0 para autenticação com Google
  • Express Session: Gerenciamento de sessões
  • DataLoader: Biblioteca para batching e caching de queries
  • Dotenv: Carregamento de variáveis de ambiente

Principais Dependências Frontend​

{
  "react": "^18.x",
  "next": "^14.x",
  "typescript": "^5.x",
  "@apollo/client": "^3.x",
  "graphql": "^16.x",
  "tailwindcss": "^3.x",
  "@radix-ui/react-*": "^1.x",
  "react-hook-form": "^7.x",
  "zod": "^3.x",
  "recharts": "^2.x"
}

Descrição das Dependências Frontend​

  • React: Biblioteca JavaScript para construção de interfaces de usuário
  • Next.js: Framework React com renderização híbrida e roteamento
  • TypeScript: Superset JavaScript com tipagem estática
  • Apollo Client: Cliente GraphQL completo com gerenciamento de estado
  • GraphQL: Linguagem de consulta (lado cliente)
  • Tailwind CSS: Framework CSS utility-first
  • Radix UI: Componentes acessíveis e não estilizados (base do shadcn/ui)
  • React Hook Form: Biblioteca para gerenciamento de formulários performática
  • Zod: Biblioteca de validação de schemas TypeScript-first
  • Recharts: Biblioteca de gráficos para React

Infraestrutura​

Containerização​

  • Docker: Plataforma para desenvolvimento, envio e execução de aplicações em containers
  • Docker Compose: Ferramenta para definir e executar aplicações Docker multi-container

Banco de Dados​

  • PostgreSQL 14+: Sistema de gerenciamento de banco de dados relacional robusto e open-source
  • Sequelize CLI: Interface de linha de comando para migrações e seeds

Proxy Reverso (Produção)​

  • Nginx: Servidor web de alto desempenho e proxy reverso

Ferramentas de Desenvolvimento​

Controle de Versão​

  • Git: Sistema de controle de versão distribuído
  • GitHub: Plataforma de hospedagem e colaboração de código

Editores e IDEs​

Recomendamos o uso de:

  • Visual Studio Code: Editor de código com excelente suporte para TypeScript, React e extensões
  • WebStorm: IDE completa da JetBrains para desenvolvimento web

Extensões VS Code Recomendadas​

  • ESLint: Linting para JavaScript/TypeScript
  • Prettier: Formatação automática de código
  • Tailwind CSS IntelliSense: Autocomplete para classes Tailwind
  • GraphQL: Syntax highlighting e autocomplete para GraphQL
  • Docker: Gerenciamento de containers Docker

Testes​

  • Jest: Framework de testes JavaScript
  • React Testing Library: Testes de componentes React
  • Supertest: Testes de APIs HTTP
  • Cucumber: Testes BDD (Behavior-Driven Development)

Qualidade de Código​

  • ESLint: Linter para identificar e reportar padrões no código JavaScript/TypeScript
  • Prettier: Formatador de código opinativo
  • Husky: Git hooks para automação de tarefas
  • lint-staged: Executar linters em arquivos staged do Git

Bibliotecas Utilitárias​

Backend​

  • bcrypt: Hashing de senhas
  • jsonwebtoken: Geração e verificação de tokens JWT
  • validator: Validação e sanitização de strings
  • date-fns: Manipulação de datas
  • lodash: Utilitários JavaScript

Frontend​

  • clsx: Utilitário para construção de strings de classes CSS
  • class-variance-authority: Criação de variantes de componentes
  • date-fns: Manipulação de datas
  • lucide-react: Ícones para React
  • sonner: Toast notifications

Serviços Externos​

Autenticação​

  • Google OAuth 2.0: Autenticação via conta Google
    • Google Cloud Console para configuração de credenciais
    • Scopes: profile, email

Hospedagem e Deploy​

  • Heroku: Plataforma de cloud para deploy (versão Cestas)
  • Vercel: Plataforma otimizada para Next.js (frontend)
  • Railway: Alternativa para hospedagem de aplicações Node.js

Versionamento e Compatibilidade​

Versões Mínimas Requeridas​

FerramentaVersão MínimaVersão Recomendada
Node.js18.x20.x LTS
npm9.x10.x
PostgreSQL14.x15.x
Docker20.x24.x
Docker Compose2.x2.x

Compatibilidade de Navegadores (Frontend)​

  • Chrome/Edge: últimas 2 versões
  • Firefox: últimas 2 versões
  • Safari: últimas 2 versões
  • Não há suporte para Internet Explorer

Próximos Passos​