Desenvolvimento de uma aplicação (API REST) de lista de tarefas (To-Do List). A aplicação permite ao usuário criar uma nova tarefa, visualizar todas as tarefas e visualizar uma tarefa específica.
Certifique-se de que você possui os seguintes itens instalados em sua máquina:
- .NET SDK 6.0 (para o backend).
- Node.js 16.10.0 (para o frontend).
- Gerenciador de pacotes npm (utilizei a versão 7.24.0).
- Banco de dados SQL Server.
Clone o repositório para o seu ambiente local:
git clone https://github.com/Lucas-RM/to-do-list.git
-
Navegue até a pasta
/backend
no terminal. -
Restaure as dependências do projeto com o comando:
dotnet restore
-
Configure a conexão com o banco de dados no arquivo
appsettings.json
:"ConnectionStrings": { "DefaultConnection": "<sua-string-de-conexão-aqui>" }
- Como está configurado:
"ConnectionStrings": { "SqlServer": "Server=localhost\\sqlexpress; initial Catalog=ToDoList; Integrated Security=True" }
- Como está configurado:
-
Em
Program.cs
configure o banco de dados:builder.Services.AddDbContext<DbContexto>(options => options.UseSqlServer( builder.Configuration.GetConnectionString("SqlServer") ));
- Verifique se o nome da string de conexão é o mesmo que está em
appsettings.json
-> "DefaultConnection" ou "SqlServer".
- Verifique se o nome da string de conexão é o mesmo que está em
-
Configure a URL da Política CORS em
Program.cs
para a URL do frontend:policy.WithOrigins("http://localhost:8080") // URL do frontend .AllowAnyHeader() .AllowAnyMethod();
- Verifique se a URL
http://localhost:8080
é a mesma do frontend.
- Verifique se a URL
-
Execute as migrações para criar o banco de dados:
dotnet ef database update
-
Inicie o servidor backend:
dotnet run
- O servidor será iniciado na URL
https://localhost:7120
-> Verifique se a porta (7120
) é a correta.
- O servidor será iniciado na URL
-
Navegue até a pasta
/frontend
no terminal. -
Instale as dependências do projeto:
npm install
-
Configure o Axios em
/services/api.js
com a URL do backend, por exemplo:import axios from 'axios' const api = axios.create({ baseURL: 'https://localhost:7120/', timeout: 10000, }); export default api
- Verifique se a URL
https://localhost:7120/
é a mesma do backend.
- Verifique se a URL
-
Inicie o servidor de desenvolvimento:
npm run serve
- O frontend será iniciado na URL padrão
http://localhost:8080
-> Verifique se a porta (8080
) é a correta.
- O frontend será iniciado na URL padrão
- Abra o navegador e acesse o frontend em
http://localhost:8080
. - Utilize as funcionalidades disponíveis na interface para interagir com a API.
Descrição: Adiciona uma nova tarefa à lista.
- URL:
/tarefas/criar
- Método: POST
- Corpo da Requisição (Body > raw (json)):
{ "titulo": "string", "descricao": "string", "status": "int" (0 = Pendente, 1 = Em Andamento, 2 = Concluida) }
- Resposta:
- Sucesso: Código 201 (Created)
{ "id": "int", "titulo": "string", "descricao": "string", "status": "int" }
- Erro: Código 400 (Bad Request)
- Sucesso: Código 201 (Created)
Descrição: Retorna uma lista de todas as tarefas.
- URL:
/tarefas
- Método: GET
- Resposta:
- Sucesso: Código 200 (OK)
[ { "id": "int", "titulo": "string", "descricao": "string", "status": "int" } ]
- Erro: Código 500 (Internal Server Error)
- Sucesso: Código 200 (OK)
Descrição: Retorna os detalhes de uma tarefa específica com base no ID fornecido.
- URL:
/tarefas/:id
- Método: GET
- Parâmetros da URL:
id
(int): ID da tarefa.
- Resposta:
- Sucesso: Código 200 (OK)
{ "id": "int", "titulo": "string", "descricao": "string", "status": "int" }
- Erro:
- Código 404 (Not Found): Tarefa não encontrada.
- Código 500 (Internal Server Error).
- Sucesso: Código 200 (OK)
Os arquivos do Postman estão disponíveis em Postman Collection.
A pasta "Postman Collection" contém:
-
Coleções do Postman: Arquivos
.json
que incluem todas as requisições configuradas para os endpoints da API. -
Documentação de Requisições: Parâmetros, corpos de requisição e exemplos de respostas para facilitar o teste e a validação da API.
-
Baixe os arquivos da pasta "Postman Collection".
-
Importe os arquivos no Postman:
-
Abra o Postman.
-
Clique em "Import" no canto superior esquerdo.
-
Selecione o arquivo
.json
baixado.
-
-
Utilize as requisições configuradas para testar a API com facilidade.