feat: desafio kanban - Pedro Henrique Carlos Pinto

[PapoDeJacare]

Envio de solução
Teste referente ao processo seletivo conversando na semana passada, por isso não coloquei as partes de apresentação e sobre mim.

link de apresentação da aplicação funcionando:
https://jam.dev/c/5ff58da2-e704-443b-ae5f-36639210a3cb

Framework, linguagem e ferramentas
Backend:

NestJS 10.4.20 - Framework Node.js progressivo com arquitetura modular baseada em decorators
GraphQL + Apollo Server 4.12.2 - API moderna com schema-first approach
Prisma ORM 6.19.1 - ORM type-safe com migrations automáticas e excelente DX
MySQL - Banco de dados relacional para persistência
TypeScript 5.7.3 - Tipagem estática para maior segurança e produtividade
JWT (jsonwebtoken 10.2.0) - Autenticação stateless baseada em tokens
Bcrypt 6.0.0 - Hash de senhas com 10 rounds de salt
Jest 30.0.0 - Framework de testes unitários
Supertest 7.0.0 - Testes E2E para API GraphQL
Frontend:

Angular 20.3.0 - Framework web moderno com signals e standalone components
TypeScript 5.9.2 - Tipagem estática
RxJS 7.8.0 - Programação reativa para gerenciamento de estado
Bootstrap 5.3.8 - UI responsiva e componentes prontos
Jasmine 5.9.0 + Karma 6.4.0 - Testes unitários
Playwright - Testes E2E modernos com suporte a múltiplos navegadores
DevOps:

Docker + Docker Compose - Containerização
ESLint - Linting e qualidade de código
Git - Controle de versão com conventional commits
Tecnologias X e Y
NestJS vs Express puro:
Optei pelo NestJS pela arquitetura modular (módulos, providers, decorators) que facilita escalabilidade e manutenção. A injeção de dependências nativa e integração com TypeScript reduz boilerplate e aumenta a produtividade.

GraphQL vs REST:
Escolhi GraphQL para evitar over-fetching/under-fetching, permitir queries flexíveis do cliente e ter documentação automática via schema. A tipagem forte integra perfeitamente com TypeScript.

Prisma vs TypeORM:
Prisma oferece melhor Developer Experience com seu schema declarativo, migrations type-safe, autocomplete robusto e query builder mais intuitivo. O Prisma Client gera tipos automaticamente baseado no schema.

Angular vs React:
Angular fornece solução completa out-of-the-box (routing, forms, HTTP, testing) sem necessidade de escolher bibliotecas externas. A arquitetura opinativa facilita padronização em equipes.

Playwright vs Cypress:
Playwright é mais moderno, rápido e suporta múltiplos navegadores nativamente. Melhor handling de iframes, auto-waiting e network interception mais robusta.

MySQL vs PostgreSQL:
Utilizei MySQL pela simplicidade de setup em ambiente Windows, excelente performance para o caso de uso proposto e ampla documentação/comunidade.

Princípios de software
SOLID:

Single Responsibility: Cada service tem responsabilidade única (AuthService só autenticação, BoardService só boards)
Dependency Inversion: Uso de injeção de dependências em todo o projeto (NestJS providers, Angular services)
Interface Segregation: DTOs específicos para cada operação (CreateBoardInput, UpdateCardInput)
Clean Architecture:

Separação clara de camadas: Presentation (Components) → Business Logic (Services) → Data Access (Prisma)
Resolvers atuam como controllers, delegando lógica para Services
Entidades/DTOs desacoplados de frameworks específicos
DRY (Don't Repeat Yourself):

Interceptors para autenticação HTTP reutilizável
Guards GraphQL para proteção de rotas
Services compartilhados (HashService, PrismaService)
Separation of Concerns:

Frontend: Components (UI) separados de Services (HTTP/lógica)
Backend: Resolvers (interface) separados de Services (business logic)
Test-Driven Development (TDD):

78 testes implementados (cobertura ~85% backend, ~80% frontend)
Testes unitários para cada service/component
Testes E2E cobrindo fluxos completos
Convention over Configuration:

Estrutura de pastas padronizada (Angular CLI + NestJS CLI)
Nomenclatura consistente (*.service.ts, *.resolver.ts, *.spec.ts)
Desafios e problemas

1. Sincronização de estado Drag & Drop:
   Problema: Mover cards entre colunas requeria atualização otimista no frontend + sincronização com backend.
   Solução: Implementei atualização pessimista - primeiro move no backend (mutation moveCard) e só depois recarrega dados para garantir consistência.

2. Guards GraphQL vs HTTP:
   Problema: Autenticação em GraphQL usa contexto diferente de REST (ExecutionContext vs HttpContext).
   Solução: Criei GqlAuthGuard customizado que extrai o request do GraphQL context usando GqlExecutionContext.

3. Mocks complexos em testes:
   Problema: Resolvers NestJS falhavam em testes por dependências não mockadas (PrismaService, HashService).
   Solução: Implementei mocks completos com todas as funções necessárias (create, findUnique, $transaction) nos arquivos *.spec.ts.

4. Typescript strict mode:
   Problema: Tipagem strict causava erros com propriedades opcionais e nullable fields.
   Solução: Uso de optional chaining (?.), nullish coalescing (??) e tipagem explícita nos DTOs.

5. Karma + Chrome Headless no Windows:
   Problema: Chrome não instalado inicialmente, Edge Headless não funcionava corretamente.
   Solução: Configurei karma.conf.js com ChromeHeadless após instalação do Chrome, com flags --no-sandbox e --disable-gpu.

6. Ciclo de vida RxJS + async/await:
   Problema: Misturar Observables com Promises causava memory leaks.
   Solução: Uso consistente de RxJS operators (map, catchError, finalize) e unsubscribe no ngOnDestroy.

Melhorias e próximas implementações
Arquitetura:

Implementar WebSockets (GraphQL Subscriptions) para updates em tempo real
Redis para caching de queries frequentes (boards, users)
Event-driven architecture com message queue (RabbitMQ/AWS SQS)
Microservices para escalabilidade (auth-service, board-service separados)
Features:

Upload de anexos nos cards (AWS S3 + presigned URLs)
Comentários e histórico de atividades (audit log)
Tags/labels customizáveis com cores
Filtros avançados e busca full-text (Elasticsearch)
Notificações push (FCM) e email (SendGrid)
Integração com calendário (Google Calendar API)
Frontend:

State management global (NgRx ou Signals-based store)
Virtual scrolling para listas grandes (CDK Virtual Scroll)
PWA com service workers para offline-first
Lazy loading de módulos para performance
Internacionalização (i18n) multi-idioma
Testes:

Aumentar cobertura para >95%
Testes de carga com k6 ou Artillery
Testes de segurança (OWASP ZAP)
Visual regression testing (Percy/Chromatic)
Mutation testing (Stryker)
DevOps:

CI/CD pipeline completo (GitHub Actions)
Dockerfile multi-stage para otimização
Kubernetes deployment (Helm charts)
Monitoramento (Prometheus + Grafana)
Logging estruturado (ELK Stack)
Rate limiting e throttling (Redis)
CDN para assets estáticos (CloudFront)
Segurança:

Refresh tokens para JWT
2FA (Two-Factor Authentication)
RBAC (Role-Based Access Control) granular
Audit trail completo
CSP (Content Security Policy) headers
Rate limiting por usuário

Outros detalhes
Estatísticas do Projeto:

✅ 78 testes automatizados (43 backend + 35 frontend)
✅ Cobertura de código ~85-95% nos services críticos
✅ 100% dos fluxos E2E cobertos
✅ Arquitetura modular e escalável
✅ Documentação completa no [README.md]
Diferenciais Implementados:

Schema GraphQL auto-documentado
Guards customizados para autenticação/autorização
DTOs tipados com validação automática
Drag & Drop intuitivo com feedback visual
Error handling robusto em todas as camadas
Migrations versionadas do banco de dados
Conventional commits para histórico limpo

Contato: 📧 Email: phenriqurle@gmail.com 📱 Telefone: 17996672278

[Copilot]

Pull request overview

This PR implements a complete Kanban board application as a solution to a technical challenge. The implementation includes a NestJS backend with GraphQL API, Angular frontend with drag-and-drop functionality, and comprehensive test coverage (~80%). Key features include JWT authentication, board/column/card management, user assignment, and full CRUD operations.

Key Changes:

• Full-stack Kanban application with authentication and board management
• GraphQL API with JWT-based security
• Comprehensive test suite (78 tests total: 43 backend, 35 frontend)

Reviewed changes

Copilot reviewed 111 out of 127 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
README.md	Complete rewrite from template to comprehensive project documentation
server/*	Backend implementation with NestJS, GraphQL, Prisma ORM, and JWT auth
client/*	Frontend Angular application with services, components, and E2E tests
docker-compose.yml	MySQL database configuration for local development
.env.example	Environment variables template for database and app configuration

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[PapoDeJacare]

link de apresentação da aplicação funcionando:

https://jam.dev/c/5ff58da2-e704-443b-ae5f-36639210a3cb