Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .github/workflows/build.yml
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ jobs:
- name: Configurar Node.js
uses: actions/setup-node@v4
with:
node-version: '18.x'
node-version: '22.x'
cache: 'npm'
cache-dependency-path: './taskflow-app/package-lock.json'

Expand Down
23 changes: 17 additions & 6 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,26 +1,37 @@
# .NET
# Build
bin/
obj/
appsettings.Development.json
*.user
*.suo
*.pfx
*.snk
TestResults/
*.trx
publish/

# User Secrets (nunca versionar credenciais)
# Configs
secrets.json
.env
.env.*
!.env.example
*.local

# Migrations (cada dev gera a sua)
# Migrations
**/Migrations/

# Node / Angular
node_modules/
dist/
.angular/
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*

# IDE / OS
.vscode/
.idea/
.DS_Store
*.swp

# Recursos locais — não publicar
Diagrams/
Roadmap/
21 changes: 21 additions & 0 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
MIT License

Copyright (c) 2026 João Vitor Oliveira Alves and contributors

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
226 changes: 171 additions & 55 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,116 +2,232 @@

Projeto-desafio do Bootcamp Protagonize Tech Avanade em parceria com a Impacta.

> Desenvolver uma aplicação web para cadastro e gerenciamento de tarefas utilizando Angular (front-end), ASP.NET Core Web API (back-end) e SQL Server (banco de dados).
> [!IMPORTANT]
> Uma versão prévia do projeto está disponível em: https://task-flow-lime-omega.vercel.app/tarefas

Aplicação full stack para gerenciamento de tarefas com Angular 17 no frontend e ASP.NET Core Web API (.NET 8) no backend.

---

## Índice

- [Visão Geral](#visão-geral)
- [Pré-requisitos](#pré-requisitos)
- [Frontend (Angular)](#frontend-angular)
- [Stack do frontend](#stack-do-frontend)
- [Modo mock (simulando backend)](#modo-mock-simulando-backend)
- [Executar frontend](#executar-frontend)
- [Backend (ASP.NET Core)](#backend-aspnet-core)
- [Stack do backend](#stack-do-backend)
- [Subir SQL Server no Docker](#subir-sql-server-no-docker)
- [Configurar connection string (User Secrets)](#configurar-connection-string-user-secrets)
- [Aplicar migrations](#aplicar-migrations)
- [Executar backend](#executar-backend)
- [Execução local com API](#execução-local-com-api)
- [Endpoints da API](#endpoints-da-api)
- [Troubleshooting](#troubleshooting)
- [Melhorias Futuras (Roadmap)](#melhorias-futuras-roadmap)
- [Frontend](#frontend)
- [Backend](#backend)
- [Expansão e Ecossistema](#expansão-e-ecossistema)
- [Notas sobre o uso de IA](#notas-sobre-o-uso-de-ia)

---

## Visão Geral

O TaskFlow organiza o ciclo de tarefas em um fluxo simples:

- Criar tarefas com título, descrição e status.
- Listar tarefas e filtrar por status.
- Editar tarefas existentes.
- Excluir tarefas.
- Atualizar datas automaticamente conforme mudança de status.

> [!NOTE]
> **Inspiração de Interface:** O design visual e a experiência de gestão do quadro de tarefas (*drag and drop*) foram fortemente inspirados na fluidez e organização do plugin [Kanban do Obsidian](https://github.com/obsidian-community/obsidian-kanban).

---

## Pré-requisitos

| Ferramenta | Versão mínima | Link |
|---|---|---|
| .NET SDK | 8.0 | [dot.net/download](https://dotnet.microsoft.com/download) |
| Node.js | 18.x | [nodejs.org](https://nodejs.org) |
| Angular CLI | Qualquer | `npm install -g @angular/cli` |
| Docker Desktop | Qualquer | [docker.com](https://www.docker.com/products/docker-desktop) |
| .NET SDK | 8.0 | https://dotnet.microsoft.com/download |
| Node.js | 18.x | https://nodejs.org |
| Angular CLI | 17.x | npm install -g @angular/cli |
| Docker Desktop | Qualquer | https://www.docker.com/products/docker-desktop |

---

## Instalação e configuração
## Frontend (Angular)

### 1. Clonar o repositório
### Stack do frontend

```bash
git clone https://github.com/<seu-usuario>/TaskFlow.git
cd TaskFlow
```
- Angular 17 (Standalone Components)
- Reactive Forms
- HttpClient
- Angular Router

### Modo mock (simulando backend)

### 2. Compilar o back-end
O frontend possui um mock completo em memória para desenvolvimento e demonstração.

- Serviço mock: taskflow-app/src/app/core/mock-tarefa.service.service.ts
- Chave de controle: useMockApi
- Produção atual do frontend: useMockApi: true

> [!NOTE]
> Para executar com mock localmente, deixe useMockApi: true em taskflow-app/src/environments/environment.development.ts.

### Executar frontend

```bash
cd TaskFlow.Api
dotnet restore
dotnet build
cd taskflow-app
npm install
npm start
```

### 3. Docker setup — SQL Server
Aplicação local: http://localhost:4200/tarefas

> O SQL Server é executado em um contêiner Docker. Certifique-se de que o Docker Desktop esteja ativo antes de prosseguir.
---

#### Windows
## Backend (ASP.NET Core)

No terminal:
```powershell
docker run -e "ACCEPT_EULA=Y" -e "SA_PASSWORD=SuaSenhaAqui@123" `
-p 1433:1433 --name sqlserver `
-d mcr.microsoft.com/mssql/server:2022-latest
```
### Stack do backend

- ASP.NET Core Web API (.NET 8)
- Entity Framework Core
- SQL Server
- Swagger

#### macOS
### Subir SQL Server no Docker

No terminal:
```bash
docker run -e "ACCEPT_EULA=Y" -e "SA_PASSWORD=SuaSenhaAqui@123" \
-p 1433:1433 --name sqlserver \
-d mcr.microsoft.com/mssql/server:2022-latest
```

#### Linux
Verifique se o container está ativo:

No terminal:
```bash
sudo docker run -e "ACCEPT_EULA=Y" -e "SA_PASSWORD=SuaSenhaAqui@123" \
-p 1433:1433 --name sqlserver \
-d mcr.microsoft.com/mssql/server:2022-latest
docker ps
```

> **Requisito de senha:** o SQL Server exige mínimo 8 caracteres contendo maiúscula, número e símbolo (ex: `MinhaS3nha@`).

Verifique se o contêiner está ativo:
### Configurar connection string (User Secrets)
A aplicação lê a string de conexão de `ConnectionStrings:DefaultConnection`. Para configurá-la localmente com segurança, utilize **User Secrets**.

```bash
docker ps
cd TaskFlow.Api
dotnet user-secrets init
dotnet user-secrets set "ConnectionStrings:DefaultConnection" "Server=localhost,1433;Database=TaskFlowDb;User Id=sa;Password=SuaSenhaAqui@123;TrustServerCertificate=true"
```

---

### 4. Configurar a string de conexão (User Secrets)
> [!NOTE]
> TrustServerCertificate=true é necessário em ambiente local com SQL Server no Docker.

A aplicação lê a string de conexão de `ConnectionStrings:DefaultConnection`. Para configurá-la localmente com segurança, utilize **User Secrets**.
### Aplicar migrations

```bash
cd TaskFlow.Api
dotnet tool install --global dotnet-ef
dotnet ef migrations add Migration
dotnet ef database update
```

dotnet user-secrets init
### Executar backend

dotnet user-secrets set "ConnectionStrings:DefaultConnection" \
"Server=localhost,1433;Database=TaskFlowDb;User Id=sa;Password=SuaSenhaAqui@123;TrustServerCertificate=true"
```bash
cd TaskFlow.Api
dotnet restore
dotnet run
```

> **`TrustServerCertificate=true`** é necessário em ambientes locais com Docker, pois o contêiner usa um certificado auto-assinado.
Swagger:

> O User Secrets é suportado em Windows, macOS e Linux. Os dados ficam armazenados fora do repositório, em um diretório do sistema operacional específico para o seu usuário.
- https://localhost:7088/swagger
- http://localhost:5055/swagger

---

### 5. Criar e aplicar a Migration
## Execução local com API

Cada desenvolvedor deve gerar e aplicar a migration no seu próprio banco:
No arquivo taskflow-app/src/environments/environment.development.ts:

```bash
# Dentro de TaskFlow.Api/
dotnet tool install --global dotnet-ef # somente na primeira vez
- useMockApi: false
- apiUrl: http://localhost:5055/api/Tarefas

dotnet ef migrations add CriacaoInicial
dotnet ef database update
Depois execute:

```bash
cd taskflow-app
npm install
npm start
```

---

### 6. Executar a API
## Endpoints da API

```bash
dotnet run
Base URL: http://localhost:5055/api/Tarefas

| Método | Rota | Descrição |
|---|---|---|
| GET | /api/Tarefas | Lista tarefas (opcional ?status=) |
| GET | /api/Tarefas/{id} | Busca tarefa por ID |
| POST | /api/Tarefas | Cria uma tarefa |
| PUT | /api/Tarefas/{id} | Atualiza uma tarefa |
| DELETE | /api/Tarefas/{id} | Remove uma tarefa |

Exemplo de payload (POST/PUT):

```json
{
"titulo": "Finalizar README",
"descricao": "Documentar setup e execução",
"status": "EmAndamento"
}
```

Acesse a documentação Swagger em: `https://localhost:<porta>/swagger`
---

## Troubleshooting

> [!TIP]
> Se a lista de tarefas não carregar, confirme se o modo correto está ativo (mock ou api) e se a URL da API está acessível.

- Erro de conexão com SQL Server: valide container, senha do usuário sa e connection string.
- Erro de CORS: confirme origem http://localhost:4200 no backend.
- Erro de certificado local: use o endpoint HTTP em desenvolvimento (http://localhost:5055).

---

## Melhorias Futuras (Roadmap)

Embora o projeto atenda a todos os requisitos do desafio, algumas evoluções arquiteturais e de usabilidade estão mapeadas para implementações futuras:

### Frontend
- **Otimização de Estado no Drag and Drop (`onDrop`):** Refatorar a lógica do componente `tarefa-lista` para atualizar o estado das tarefas localmente (atualização otimista) após o drop, evitando recarregamentos completos (*full reloads*) desnecessários e melhorando a fluidez.
- **Aprimoramento de UI/UX nas Ações Destrutivas:** Substituir os alertas nativos do navegador por modais customizados ou *toast notifications* para confirmação de exclusão de tarefas, oferecendo uma experiência mais amigável e segura ao usuário.

### Backend
- **Implementação de Soft Delete:** Substituir a exclusão física (DELETE no banco) por exclusão lógica (adicionando campos como `IsDeleted` ou `DataExclusao`). Isso preserva o histórico de dados e previne perdas acidentais.
- **Tratamento Global de Exceções:** Extrair os blocos de `try-catch` das *Controllers* e implementar um *Global Exception Handler* via Middleware. Isso centraliza o tratamento de erros, padroniza as respostas de falha da API (utilizando o padrão `ProblemDetails`) e deixa os *Controllers* muito mais limpos e focados apenas no roteamento.

### Expansão e Ecossistema
- **Desenvolvimento de Plugin Nativo para o Obsidian:** Evoluir a solução front-end para atuar como um plugin do Obsidian. O objetivo é preencher uma lacuna atual na comunidade, oferecendo um quadro Kanban capaz de persistir, centralizar e sincronizar estados diretamente em uma API externa (cloud), permitindo a integração do fluxo de trabalho com sistemas de terceiros.

---

## Notas sobre o uso de IA

O desafio proposto teve como objetivo avaliar conhecimentos básicos em desenvolvimento full-stack. Os módulos de aprendizado fornecidos, bem como a proposta geral do projeto, propuseram o uso de IA ao longo do ciclo de desenvolvimento como uma ferramenta auxiliar. Diante disso, o presente projeto empregou as seguintes práticas e recursos favorecidos por IA:
- No back-end: identificação das melhores soluções para bugs (serialização de ENUMs e atualização de datas).
- No front-end: padronização de CSS e centralização de estilos compartilhados; aprendizado de práticas modernas do Angular (controle de fluxo, signals, injeção de dependência moderna, Standalone Components e Reactive Forms); orientações para a criação do Mock; e, ajuste nos pacotes.

---

## Licença

Distribuído sob a licença MIT. Consulte o arquivo `LICENSE` para mais detalhes.
Loading
Loading