Task Manager Application

( Clique aqui para se Cadastar e criar suas Tasks)

[Demonstração-Projeto-RaizerTech]

---

📑 Índice

• Task Manager Application
• Objetivo
• Tecnologias
• Documentação da API
• Configuração e Instalação dos Ambientes
  • Pré-requisitos
  • Instalação FrontEnd
  • Instalação Backend
  • Instalação Docker
• Execução
• Banco de Dados
• Frontend
• Implentações de Branches
• Licença
• Autor

---

🎯Objetivo

Um aplicativo completo de gerenciamento de tarefas com backend (Node.js/Express), frontend (React) e banco de dados PostgreSQL, tudo containerizado com Docker.

---

🚀Tecnologias

Backend

Frontend

DevOps

---

📚 Documentação da API

Run in Postman

Endpoints principais:

POST /api/auth/register - Registro de usuário

POST /api/auth/login - Autenticação

GET /api/tasks - Listar tarefas

POST /api/tasks - Criar tarefa

PUT /api/tasks/:id - Atualizar tarefa

---

🛠️Configuração e Instalação dos Ambientes

Pré-requisitos

• Node.js v18+
• Docker v20+
• PostgreSQL 15

📦 Instalação FrontEnd

Criar projeto React com Vite

npm create vite@latest . -- --template react

Dependências principais

npm install axios react-router-dom react-icons react-toastify @heroicons/react date-fns

Dependências de desenvolvimento (TailwindCSS)

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

📦 Instalação BackEnd

Dependências principais

npm install express express-async-handler cors dotenv bcryptjs jest jsonwebtoken nodemon sequelize 

🐋 Instalação do Docker

Antes de executar os serviços, é necessário ter o Docker instalado. Siga as instruções de acordo com seu sistema operacional:

Para Windows/macOS (Docker Desktop):

• Baixe o Docker Desktop 🔗 Download Docker Desktop

• Recomendado para desenvolvimento local.

• Instale e Inicie

• Execute o instalador baixado

• Inicie o Docker Desktop após a instalação

• Aguarde até que o ícone do Docker na bandeja/barra de menus indique que está em execução (⏳→🐳)

Para Linux (Docker Engine):

1. Atualize os pacotes
sudo apt-get update

2. Instale dependências
sudo apt-get install -y apt-transport-https ca-certificates curl software-properties-common

3. Adicione o repositório oficial do Docker
curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg
echo "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null

4. Instale o Docker Engine
sudo apt-get update
sudo apt-get install -y docker-ce docker-ce-cli containerd.io

5. Adicione seu usuário ao grupo docker (evita usar sudo)
sudo usermod -aG docker $USER
newgrp docker  # Recarrega as permissões (ou reinicie o terminal)
de teste

Verifique a Instalação

bash docker --version # Deve mostrar a versão instalada docker run hello-world # Executa um contêiner

---

Dependências Backend + Frontend + Docker

npm install

Listar dependências instaladas

npm list

---

🚀 Execução

Iniciar todos os serviços (Docker)

docker-compose -f docker/docker-compose.yml up --build

• Portas:

  • Backend: 5000

  • Frontend: 5173

  • Postgres: 5432

Parar todos os serviços

docker-compose -f docker/docker-compose.yml down -v

Limpeza de recursos Docker

• Limpar recursos não utilizados

# Limpar recursos não utilizados
docker system prune -a

# Remover volumes não utilizados
docker volume prune

---

🗄️ Banco de Dados (PostgreSQL)

Acessar o banco de dados localhost

docker exec -it postgres-db psql -U postgres -d taskmanager

Acessar o banco de dados no Neon

psql "postgresql://[DB_USER]:[DB_PASSWORD]@[DB_HOST]]/taskmanager?sslmode=require"

Comandos úteis no PostgreSQL

-- Listar todas as tabelas
\dt

-- Descrever estrutura da tabela Tasks
\d "Tasks"

-- Consultar dados da tabela Tasks
SELECT * FROMs "Tasks";

-- Consultar dados da tabela Tasks por "userId" e verificar "status"
SELECT * FROM "Tasks" ORDER BY "userId" ;

-- Consultar dados da tabela Tasks por "userId" e verificar "status"
SELECT t.* FROM "Tasks" t JOIN "Users" u ON t."userId" = u.id AND u.id = 2 ORDER BY t."status";

-- Consultar dados da tabela Tasks por "username" e omite "userId"
SELECT t.id, t.title,  t.description, t.status,  t."taskDate", u.username FROM "Tasks" t  JOIN "Users" u ON t."userId" = u.id  WHERE u.username = 'Rafa'  ORDER BY t."status";

-- Exemplo: Renomear coluna
ALTER TABLE "Tasks" RENAME COLUMN "dueDate" TO "taskDate";

-- Verificar alterações
\d "Tasks"

---

🖥️ Frontend

Build de produção

npm run build

Desenvolvimento FrontEnd

npm run dev

• Portas:
  • Frontend: 5180

---

Implementações de branches

1. Desenvolvimento Front-End

• release/desenvolvimento-front-end

2. Desenvolvimento Back-End

• release/desenvolvimento-back-end

br>

---

Licença

• Esse projeto está sob a licença MIT.

---

👤 Autor

   RafaRaizer-Dev
   Whatsapp | LinkedIn | GitHub| Tableau| Portfólio