Criando uma aplicação com NodeJS e Express [GoStack Desafio 01]

O primeiro desafio do bootcamp GoStack 9.0 é criar uma aplicação com NodeJS e Express para armazenar projetos e suas respectivas tarefas.

O projeto deve ter os seguintes requisitos:

Rotas

• POST /projects: A rota deve receber id e title dentro do corpo e cadastrar um novo projeto dentro de um array no seguinte formato: { id: "1", title: 'Novo projeto', tasks: [] }; Certifique-se de enviar tanto o ID quanto o título do projeto no formato string com aspas duplas.
• GET /projects: Rota que lista todos projetos e suas tarefas;
• PUT /projects/:id: A rota deve alterar apenas o título do projeto com o id presente nos parâmetros da rota;
• DELETE /projects/:id: A rota deve deletar o projeto com o id presente nos parâmetros da rota;
• POST /projects/:id/tasks: A rota deve receber um campo title e armazenar uma nova tarefa no array de tarefas de um projeto específico escolhido através do id presente nos parâmetros da rota;

Middlewares

• Crie um middleware que será utilizado em todas rotas que recebem o ID do projeto nos parâmetros da URL que verifica se o projeto com aquele ID existe. Se não existir retorne um erro, caso contrário permita a requisição continuar normalmente;
• Crie um middleware global chamado em todas requisições que imprime (console.log) uma contagem de quantas requisições foram feitas na aplicação até então;

Iniciando o projeto

Crie a pasta onde vai ficar o projeto, acesse pelo terminal ou prompt de comando e digite os código a seguir

yarn init -y

yarn add express

A primeira linha cria o package,json, já a segunda adiciona o express ao projeto.

O segundo passo é criar o arquivo index.js na pasta do projeto. Como o projeto vai guardar as informações apenas em arrays não será necessário criar uma estrutura completa de pastas, podemos concluir o desafio todo em um único arquivo, no caso o index,js.

Com o arquivo criado é hora de codar.

const express = require('express');

const server = express();

server.use(express.json())

const projects = [];

//rotas ficam aqui

server.listen(3000);

A primeira linha importa o express, que depois é carregado dentro da variável server. A terceira linha de código força o uso de json nas requisições. Depois é criado o array projects e na última linha especifica de qual a porta o servidor vai receber as requisições.

Definindo as Rotas da Aplicação NodeJS e Express

No express as rotas funcionam quando a aplicação responde a uma requisição de uma URI (caminho) e com um método HTTP específico (GET, POST, PUT …). Cada rota tem um função diferente que age de acordo com o método HTTP

A definição de rotas aceita a seguinte estrutura:

app.METHOD(PATH, HANDLER)

Onde:

• app é uma instância do express.
• METHOD método de solicitação HTTP.
• PATH o caminho no servidor.
• HANDLER é a função executada quando a rota é correspondida.

Post ou Criar

Vamos iniciar pela rota POST que cria novos projetos.

//Insert
server.post('/projects', (req, res) => {
    const { id, name } = req.body;
  
    const project = {
        id,
        name,
        tasks: []
    }
    projects.push(project);
  
    return res.json(project);
  });

A rota foi criada com o método post, o PATH é ‘/projeto’ e o HANDLER é uma arrow function que carrega as variáveis id e name através do req.body (corpo da requisição), carregando tudo na variável project e depois inserido no array através do método push.

Listar

Agora que já existem dados dentro do array podemos listar todos e buscar por id. Para listar todos usamos o método GET sem nenhum parâmetro

//Listar todos
  server.get('/projects', (req, res) => {
    return res.json(projects);
  });

Put ou Atualizar

Agora vamos atualizar um registro com o express:

//Atualizar um registro
  server.put('/projects/:id', (req, res) => {
    const { id } = req.params;
    const { name } = req.body;
  
    const project = projects.find(p => p.id == id);
  
    project.name = name;
  
    return res.json(project);
  });

Para atualizar pegamos o id a partir da rota e o novo nome a partir do corpo da requisição. Depois buscamos o projeto baseado no id e atualizamos o nome do projeto. Por fim listamos o projeto.

Delete

//Deletar projeto
  server.delete('/projects/:id', (req, res) => {
    const { id } = req.params;
  
    const projectIndex = projects.findIndex(p => p.id == id);
  
    projects.splice(projectIndex, 1);
  
    return res.send();
  });

Para deletar carregamos o id a partir do route params. Carregamos a o índice do projeto na variável projectIndex e depois deletamos o projeto utilizando o método splice.

Acrescentando os Middlewares Express

Funções de Middleware são funções que tem acesso req e ao res, elas ficam justamente entre a requisção HTTP e a resposta da aplicação. Geralmente a função middleware tem como parâmetro uma variável chamada next.

Funções de middleware podem executar as seguintes tarefas:

• Executar qualquer código.
• Fazer mudanças nos objetos de solicitação e resposta.
• Encerrar o ciclo de solicitação-resposta.
• Chamar o próximo middleware na pilha.

Se a atual função de middleware não terminar o ciclo de solicitação-resposta, ela precisa chamar next() para passar o controle para a próxima função de middleware. Caso contrário, a solicitação ficará suspensa.

Os requisitos deste desafio solicitam a criação de 2 middlewares, um para verificar se o projeto existe antes de realizar atualizações e remoções e outro para contar a quantidade de requisições feitas no servidor

Middleware contador

O mais simples é o contador:

//Middleware Contador de requisições
function countRequests(req, res, next) {

  console.count("Nº de requisições");
  
  return next();
  }
  
  server.use(countRequests);

O método console.count retorna quantas vezes aquela função foi chamada, sendo assim toda vez que o servidor chamar a função countRequests incrementará o valor do contador.

//Middleware que verifica se o projeto existe
function checkProjectExists(req, res, next) {
    const { id } = req.params;
    const project = projects.find(p => p.id == id);
  
    if (!project) {
      return res.status(400).json({ error: 'Projeto não encontrado!' });
    }
  
    return next();
  }

Middleware de checagem de projeto

A verificação da existência do projeto deve ser feitas em rotas que são passados por Route Params, ou seja, rotas de update ou delete.

//Middleware que verifica se o projeto existe
function checkProjectExists(req, res, next) {
    const { id } = req.params;
    const project = projects.find(p => p.id == id);
  
    if (!project) {
      return res.status(400).json({ error: 'Projeto não encontrado!' });
    }
  
    return next();
  }

Lembrando que a verificação será feita depois de receber a requisição HTTP e antes retornar o resultado, ou seja, o middleware do express terá acesso aos parâmetros req e res.

Então carregamos o id direto da URI verificamos se existe utilizando o método find se não houver projeto com aquele id a aplicação retorna o status 400 informando que o projeto não foi encontrado.

Se o projeto existir retorna o next() para dar continuidade no processamento da requisição.

Atualizando rotas PUT e DELETE

Para concluir devemos inserir o middleware nos métodos PUT e DELETE.

//Atualizar um registro
  server.put('/projects/:id', checkProjectExists, (req, res) => {

...
  
  //Deletar projeto
  server.delete('/projects/:id', checkProjectExists, (req, res) => {

...  

Conclusão do projeto NodeJS e Express

Construímos até aqui uma aplicação que cadastra projetos e suas respectivas tarefas, utilizando NodeJS e Express. O projeto realiza cadastro, atualizações, remoções e listagem dos projetos e ainda conta o recursos de middlewares do Express.

A situação final do arquivo index.js ficou com o código abaixo e pode ser encontrado no GitHub neste repositório.

const express = require('express');

const server = express();

server.use(express.json());

const projects = [];


//Middleware que verifica se o projeto existe
function checkProjectExists(req, res, next) {
    const { id } = req.params;
    const project = projects.find(p => p.id == id);
  
    if (!project) {
      return res.status(400).json({ error: 'Projeto não encontrado!' });
    }
  
    return next();
  }

//Middleware Contador de requisições
function countRequests(req, res, next) {

  console.count("Nº de requisições");
  
  return next();
  }
  
  server.use(countRequests);
  
  

//Insert
server.post('/projects', (req, res) => {
    const { id, name } = req.body;
  
    const project = {
        id,
        name,
        tasks: []
    }

    projects.push(project);
  
    return res.json(project);
  });

  //Listar todos
  server.get('/projects', (req, res) => {
    return res.json(projects);
  });


  //Atualizar um registro
  server.put('/projects/:id', checkProjectExists, (req, res) => {
    const { id } = req.params;
    const { name } = req.body;
  
    const project = projects.find(p => p.id == id);
  
    project.name = name;
  
    return res.json(project);
  });

  //Deletar projeto
  server.delete('/projects/:id', checkProjectExists, (req, res) => {
    const { id } = req.params;
  
    const projectIndex = projects.findIndex(p => p.id == id);
  
    projects.splice(projectIndex, 1);
  
    return res.send();
  }); 


server.listen(3000);

Tags: bootcamp | desafio | express | GoStack | nodejs