Teste kanban diogo de lorenzi pinheiro

PULL_REQUEST_TEMPLATE.md

@@ -1,46 +1,13 @@
 ## Envio de solução
 
-Gostariamos de entender como você pensa e as decisões que você tomou durante o desenvolvimento, detalhe um pouco mais sobre:
+Oi, prazer, eu sou o Diogo de Lorenzi Pinheiro, tenho 22 anos, nasci e fui criado em são josé do rio preto. Eu comecei nessa "empreitada" de desenvolvedor aos 17 anos, antes mesmo de entrar na faculdade, graças ao meu pai, que me ensinou bastante coisa, contando das experiências de trabalho que ele teve na TOTVS de são paulo. Atualmente, faço 2 faculdades, a FATEC a tarde, em analise e desenvolvimento de sistemas, e a UNIP a noite, em ciências da computação.
+Esse teste prático, de fazer um Kanban, me ajudou muito a entender como o mercado utiliza de ferramentas que eu nunca tinha usado antes. Começando pela parte do banco de dados, foi utilizado o Postgres com um setup em um Docker, para a instalação do banco não ser um impeditivo de concluir o projeto. A parte do backend, também não foi um grande problema, ja que eu ja possuía algum conhecimento em TypeScript, houveram apenas algumas funções/funcionalidades do Nestjs que me fizeram pesquisar por algum tempinho, mas o principal facilitador foi a escolha de utilizar o prisma, ao invez de outra ORM, devido a sua facilidade de setup e utilização, e a utilização de Graphql facilita demais a construção de um backend conciso e seguro. Já no frontend, foi onde eu tive mais dificuldades, principalmente por conta do Tailwind, mas, depois que eu entendi que o Tailwind, na verdade, só "encurta" código CSS, fluiu bem rápido essa parte. Outro grande "empecilho", foi a parte de testes unitários, mas, principalmente, os teste e2e. Não sou nem um pouco experiente nas criações de testes unitários, então optei por utilizar ferramentas nativas dos frameworks, como o Jest e o Jasmine, que tem uma excelente documentação e uma ampla quantidade de vídeos ensinando como utiliza-las da maneira "correta" para o mercado de trabalho. Sobre os princípios de engenharia utilizados, mantive simples, seguindo o padrão de mercado utilizando, no frontend, da "componentização" para que seja evitado a repetição de código, ao máximo possível e foi utilizado, alguns princípios, da metodologia SOLID, como: a utilização de injeção de dependência, o princípio de responsabilidade única, em que um arquivo so faz aquilo que ele se propõe a fazer, toda a aplicação frontend é uma SPA, controlada por routers e outlets. Bom, é isso, acredito que consegui desenvolver bem minhas habilidades de utilização dessas ferramentas, e, como uma possível melhora da aplicação como um todo, acredito que a execução de um deploy, tanto do backend, quanto do backend, seja fundamental. Muito obrigado pela atenção, uma excelente semana! <3 
 
-**Framework, linguagem e ferramentas**
-
-Descreva ferramentas e bibliotecas (libraries, framework, tools etc) você usou.
-
-**Técnologias X e Y**
-
-Justifique porque você optou pela tecnologia X e não a Y?
-
-**Princípios de software**
-
-Quais princípios da engenharia de software que você usou?
-
-**Desafios e problemas**
-
-Conte um pouco sobre os desafios e problemas que você enfrentou e como você resolveu.
-
-**Melhorias e próximas implementações**
-
-O que você entende que pode ser melhorado e como isso pode ser feito?
+Ps: me contrata kkkkkkk
 
 **Vídeo de apresentação**
-
-Grave um vídeo do seu projeto rodando e envie o link:
-<!-- Dica: você pode usar o https://jam.dev/ para facilitar sua gravação ;) -->
-
-**Sobre você**
-
-Queremos te conhecer um pouco melhor, conte um pouco sobre você.
-
-Onde nasceu/De onde você é? Lugares que estudou, empresas que trabalhou, como você se envolveu com desenvolvimento de software.. enfim, Quem é você?
-
-**Outros detalhes**
-
-Se quiser enviar alguma informação adicional sobre o desafio..
-
+https://jam.dev/c/15fa1007-e7f8-4913-a984-98dea90f9f72
 
 ---
 
-Ah, deixe seu e-mail ou telefone para entrarmos em contato com você :) 
-
-
-
+diogodelorenzipinheiro@gmail.com

client/.editorconfig

@@ -0,0 +1,17 @@
+# Editor configuration, see https://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.ts]
+quote_type = single
+ij_typescript_use_double_quotes = false
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

client/.gitignore

@@ -0,0 +1,43 @@
+# See https://docs.github.com/get-started/getting-started-with-git/ignoring-files for more about ignoring files.
+
+# Compiled output
+/dist
+/tmp
+/out-tsc
+/bazel-out
+
+# Node
+/node_modules
+npm-debug.log
+yarn-error.log
+
+# IDEs and editors
+.idea/
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# Visual Studio Code
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# Miscellaneous
+/.angular/cache
+.sass-cache/
+/connect.lock
+/coverage
+/libpeerconnection.log
+testem.log
+/typings
+__screenshots__/
+
+# System files
+.DS_Store
+Thumbs.db

client/.vscode/extensions.json

@@ -0,0 +1,4 @@
+{
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846
+  "recommendations": ["angular.ng-template"]
+}

client/.vscode/launch.json

@@ -0,0 +1,20 @@
+{
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "ng serve",
+      "type": "chrome",
+      "request": "launch",
+      "preLaunchTask": "npm: start",
+      "url": "http://localhost:4200/"
+    },
+    {
+      "name": "ng test",
+      "type": "chrome",
+      "request": "launch",
+      "preLaunchTask": "npm: test",
+      "url": "http://localhost:9876/debug.html"
+    }
+  ]
+}

client/.vscode/tasks.json

@@ -0,0 +1,42 @@
+{
+  // For more information, visit: https://go.microsoft.com/fwlink/?LinkId=733558
+  "version": "2.0.0",
+  "tasks": [
+    {
+      "type": "npm",
+      "script": "start",
+      "isBackground": true,
+      "problemMatcher": {
+        "owner": "typescript",
+        "pattern": "$tsc",
+        "background": {
+          "activeOnStart": true,
+          "beginsPattern": {
+            "regexp": "(.*?)"
+          },
+          "endsPattern": {
+            "regexp": "bundle generation complete"
+          }
+        }
+      }
+    },
+    {
+      "type": "npm",
+      "script": "test",
+      "isBackground": true,
+      "problemMatcher": {
+        "owner": "typescript",
+        "pattern": "$tsc",
+        "background": {
+          "activeOnStart": true,
+          "beginsPattern": {
+            "regexp": "(.*?)"
+          },
+          "endsPattern": {
+            "regexp": "bundle generation complete"
+          }
+        }
+      }
+    }
+  ]
+}

client/README.md

@@ -0,0 +1,38 @@
+# Ferramentas utilizadas
+Framework: Angular (v17+ Standalone Components)
+Estilização: Tailwind CSS v3
+Gerenciamento de Estado/Dados: Apollo Client (GraphQL)
+Interatividade: Angular CDK (Drag and Drop)
+Testes: Jasmine/Karma (Unitários) e Cypress (E2E)
+
+## Setup do projeto
+# Instale as dependências
+```bash
+$ npm install
+```
+
+## Rode o projeto 
+```bash
+$ ng serve
+```
+
+    OR
+
+```bash
+$ npm run start
+```
+
+## Testes
+Nesse projeto, os testes unitarios e de integração foram feitos com os pacotes padrões do Angular (Jasmine) nos arquivos spec.ts. Para roda-los, basta usar o comando a baixo.
+
+```bash
+$ npm run test
+```
+
+Há tambem um teste e2e utilizando Cypress (15.7.0), que testa o hanshake entre frontend e backend. Para roda-lo, é necessário do frontend e do backend rodando. Após se certificar que ambos estão rodando corretamente, abra um novo terminal, na pasta client, e digite:
+
+```bash
+$ npx cypress open
+```
+
+Deve abrir uma janela do Cypress, selecione o teste E2E e depois o navegador que voce utilize. Após isso, deve abrir uma pagina web, no navegador escolhido, selecione o arquivo "spec.cy.ts" para rodar o teste completo do fluxo da aplicação. 

client/angular.json

@@ -0,0 +1,143 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "client": {
+      "projectType": "application",
+      "schematics": {},
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular/build:application",
+          "options": {
+            "browser": "src/main.ts",
+            "polyfills": [
+              "zone.js"
+            ],
+            "tsConfig": "tsconfig.app.json",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "public"
+              }
+            ],
+            "styles": [
+              "src/styles.css"
+            ]
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "500kB",
+                  "maximumError": "1MB"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "4kB",
+                  "maximumError": "8kB"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular/build:dev-server",
+          "configurations": {
+            "production": {
+              "buildTarget": "client:build:production"
+            },
+            "development": {
+              "buildTarget": "client:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular/build:extract-i18n"
+        },
+        "test": {
+          "builder": "@angular/build:karma",
+          "options": {
+            "polyfills": [
+              "zone.js",
+              "zone.js/testing"
+            ],
+            "tsConfig": "tsconfig.spec.json",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "public"
+              }
+            ],
+            "styles": [
+              "src/styles.css"
+            ]
+          }
+        },
+        "cypress-run": {
+          "builder": "@cypress/schematic:cypress",
+          "options": {
+            "devServerTarget": "client:serve"
+          },
+          "configurations": {
+            "production": {
+              "devServerTarget": "client:serve:production"
+            }
+          }
+        },
+        "cypress-open": {
+          "builder": "@cypress/schematic:cypress",
+          "options": {
+            "watch": true,
+            "headless": false
+          }
+        },
+        "ct": {
+          "builder": "@cypress/schematic:cypress",
+          "options": {
+            "devServerTarget": "client:serve",
+            "watch": true,
+            "headless": false,
+            "testingType": "component"
+          },
+          "configurations": {
+            "development": {
+              "devServerTarget": "client:serve:development"
+            }
+          }
+        },
+        "e2e": {
+          "builder": "@cypress/schematic:cypress",
+          "options": {
+            "devServerTarget": "client:serve",
+            "watch": true,
+            "headless": false
+          },
+          "configurations": {
+            "production": {
+              "devServerTarget": "client:serve:production"
+            }
+          }
+        }
+      }
+    }
+  },
+  "cli": {
+    "schematicCollections": [
+      "@cypress/schematic",
+      "@schematics/angular"
+    ]
+  }
+}

client/cypress.config.ts

@@ -0,0 +1,18 @@
+import { defineConfig } from 'cypress'
+
+export default defineConfig({
+
+  e2e: {
+    'baseUrl': 'http://localhost:4200'
+  },
+
+
+  component: {
+    devServer: {
+      framework: 'angular',
+      bundler: 'webpack',
+    },
+    specPattern: '**/*.cy.ts'
+  }
+
+})