Express para gerenciamento de rotas no Node.js
Todo container web precisa ser capaz de responder adequadamente a uma requisição de usuário. Essa resposta depende do caminho digitado no navegador (URL). Cada caminho irá direcionar o usuário para uma página específica ou executar uma operação específica no servidor. Esse gerenciamento dos caminhos, ou rotas, disponíveis na aplicação é chamado de roteamento.
No Node.js, esse controle pode ser feito utilizando um código Javascript semelhante ao código abaixo:
Para cada rota disponível, é feito um condicional que carrega o código HTML respectivo daquela rota. Dá para perceber que essa estratégia não é das melhores, já que esse código tende a crescer bastante e será complexo de manter com tantos caminhos alternativos. É para resolver esse problema de forma mais elegante que iremos utilizar o módulo Express:
O Express é um framework web projetado para construir aplicações e APIS.
Nesse post iremos utilizar o Express para construir um projeto Node.js configurando as rotas da aplicação.
Pré requisitos
Recomendo a leitura desse post para introdução ao Node.js e configuração do ambiente.
Criação do Projeto
O processo de criação de projetos é muito simples. Quando você instala o Node.js, você também instala o seu gerenciador de pacotes, que é o famoso npm. É com ele que iremos criar o projeto no diretório projetoexpress, através do comando abaixo (digite no terminal de sua preferência):
$ mkdir projetoexpress && cd projetoexpress
$ npm init💡 Nesse post, os comandos utilizados no terminal são compatíveis com o bash do Ubuntu. Se você utiliza o Windows, sugiro a utilização de um terminal compatível.
O npm irá solicitar algumas informações sobre o projeto, é necessário preenchê-las conforme forem sendo requisitadas. Caso queira manter as definições padrão, é só apertar Enter para todas as opções:
O comando irá criar um arquivo chamado package.json, que irá conter os metadados do projeto e suas dependências.
Instalação do Express
Vamos utilizar o npm para instalar o Express no nosso projeto Node.js. Para isso, execute o comando abaixo na pasta projetoexpress:
$ npm install express@4.17.1 --save-exactEsse comando instala o módulo Express na versão exata 4.17.1 e salva essa informação no arquivo package.json. Isso é importante pois se outro desenvolvedor baixar o nosso projeto ele precisa instalar as dependências utilizando o arquivo package.json (isso é feito apenas executando o npm install no diretório do arquivo package.json). Mas como é que o npm instala as dependências? Ele simplesmente cria um diretório chamado node_modules e coloca nele todo o código javascript das dependências do projeto, tanto as diretas como as transitivas (dependências das dependências).
💡 Você deve ter observado que foi criado um arquivo chamado package-lock.json como resultado da operação de install. Esse arquivo mantém as versões instaladas de cada dependência. Isso evita problemas de compatibilidade em casos nos quais as versões das dependências no package não sejam especificadas precisamente. Para saber mais sobre esse arquivo, recomendo a leitura desse post.
💡 O diretório node_modules é criado pelo npm install de acordo com o seu sistema operacional. Por isso, ao compartilhar projetos é comum excluir esse diretório, visto que o projeto pode não funcionar em diferentes plataformas. O procedimento correto é que o usuário baixe o projeto sem o diretório node_modules e execute o comando npm install para que as dependências sejam baixadas de acordo com o seu sistema operacional.
Estrutura do Projeto
Nosso projeto Node.js terá a seguinte estrutura:
O diretório src irá conter o código fonte da aplicação contido no subdiretório app, e as configurações no subdiretório config. O arquivo server.js será o arquivo que criará o servidor da aplicação.
Configuração do servidor Express
Vamos agora utilizar o Express de fato! Ele será configurado no arquivo server.js, e o primeiro passo é adicionar o código que utiliza esse módulo:
Esse módulo retorna uma função, e por isso temos que invocá-la para configurar a aplicação:
Falta um detalhe. É necessário informar em qual porta o Express irá escutar requisições, e isso é feito utilizando a função listen:
A função listen pode receber uma função como argumento que pode ser usada para informar ao desenvolvedor que o servidor foi iniciado com sucesso. Podemos fazer isso modificando o código da seguinte forma:
Agora, inicie o servidor com o comando abaixo e observe a mensagem exibida:
Configurando uma rota
Até agora nós apenas criamos um servidor Express, que escuta requisições na porta 3000. O problema é que ainda não dissemos o que ele deve fazer quando receber uma requisição. Essa configuração é feita declarando rotas na nossa aplicação e adicionando uma lógica de execução para cada uma dessas rotas.
Vamos então definir uma rota padrão para a aplicação, que é a rota “/” (é ativada ao digitar o http://localhost:3000). Isso será feito através do objeto app, que contém um método para cada verbo HTTP. Como a operação GET é por padrão disparada ao digitar um endereço no navegador, vamos configurar a rota com esse verbo:
O get recebe uma função callback como parâmetro, que irá configurar a resposta através do parâmetro res (abreviação de response). Esse parâmetro possui a operação send, que irá receber o HTML que deve ser retornado quando a rota for requisitada.
Inicie ou reinicie o servidor (utilize o comando npm start no terminal) e acesse o endereço dessa rota no seu navegador:
💡 O comando npm start é utilizado para iniciar um projeto Node.js. Por padrão, executar esse comando significa executar o comando: node server.js. Também é possível configurar um script de inicialização diferente no arquivo package.json.
Utilizando o Router
No nosso exemplo definimos uma rota dentro do arquivo server.js. O projeto funciona, mas semanticamente está confuso. O propósito do arquivo server.js é apenas criar o servidor, e não configurar as suas rotas. Isso deve ser feito em outro contexto, por questões de boas práticas. Com essa finalidade, vamos então criar um contexto adequado para a configuração das rotas utilizando a feature de módulos do Node.js.
A função require permite a utilização de diferentes módulos dentro do nosso projeto. Mas e para os códigos internos que desenvolvemos, como podemos reutilizá-los no próprio projeto? Vamos entender como isso funciona analisando o nosso arquivo server.js:
As linhas acima fazem duas coisas: importam o módulo Express e chamam a função que retorna o app. Sempre que precisarmos utilizar o Express, vamos ter que escrever essas duas linhas. Para encapsular essa lógica de configuração do Express, vamos criar um módulo que executa essas operações. Isso será feito criando um arquivo chamado custom-express.js na pasta config do projeto:
Veja que copiamos as duas linhas mas isso não foi suficiente. Para exportar a variável app, que precisa ser utilizada para configurar o servidor, é necessário utilizar o module.exports. Isso faz com que a importação desse módulo retorne o objeto app:
Veja que foi simples modificar o arquivo server.js, pois será retornado o app construído pelo módulo que criamos. Como o módulo é local, tivemos que passar o caminho completo até ele a partir do diretório do arquivo server.js.
Agora, vamos deixar esse módulo encarregado de configurar as rotas. Para isso, vamos começar criando um diretório routes dentro do diretório app:
No diretório routes, vamos adicionar um arquivo index.js com o código da rota que tínhamos implementado no arquivo server.js, adicionando algumas pequenas modificações:
A primeira mudança notável foi na primeira linha onde nós utilizamos a classe Router do módulo Express. Essa classe retorna um roteador que nos permite configurar todas as rotas da nossa aplicação Node.js chamando os métodos respectivos de cada verbo HTTP. No nosso caso, mantivemos o get e o HTML retornado. No final, como já foi explicado, é necessário retornar essas rotas configuradas utilizando o module.exports.
E agora, onde vamos dizer que essas rotas precisam ser utilizadas? No custom-express.js, que é o nosso módulo customizado da aplicação:
Utilizamos o método use para utilizar as rotas declaradas em routes. Esse método permite que nós reusemos as rotas declaradas em outros lugares do nosso projeto. Assim conseguimos separar as responsabilidades em seus contextos específicos.
Nossa solução evoluiu bastante, mas falta um detalhe. Vamos voltar ao index.js do routes:
A lógica de retorno da rota está declarada no arquivo de roteamento. O problema é que o index.js está com duas responsabilidades: declarar a rota e a lógica executada. O ideal é que separemos a lógica num objeto específico do tipo controller. Para isso, vamos criar um novo diretório chamado controllers no projeto:
Nessa pasta, vamos criar um arquivo chamado get.js para adicionar a lógica de retorno das requisições para o endereço / (endereço padrão):
Nós exportamos uma função que retorna o HTML padrão para requisições no endereço /. Agora, vamos usar esse controlador no nosso index.js do routes:
O nosso projeto está pronto, de acordo com as boas práticas, e pode ser testado reiniciando o servidor (npm start):
Conclusão
Nesse post, vimos como construir uma aplicação Node.js utilizando o Express para o gerenciamento de rotas. Nós evoluímos nossa solução para a adoção de boas práticas de desenvolvimento visando melhorar a manutenibilidade do sistema. Com o conteúdo apresentado aqui, espero que você seja capaz de desenvolver suas aplicações Node.js utilizando o Express. Em caso de dúvidas ou sugestões, deixe um comentário!
Se você gosta do meu conteúdo, não deixe de conferir o meu canal do Youtube, onde falo sobre desenvolvimento de software. Espero te ver por lá! 😉
