Como criar um servidor com o Node.js

Como criar um servidor com o Node.js

Quando falamos de Backend nos referimos a todo o desenvolvimento voltado para bancos de dados, servidores e estruturas de uma aplicação. Enquanto o Frontend é responsável pela interação de maior nível entre a aplicação e o usuário (como inputs, botões, ícones, etc.), o Backend trabalha em um nível baixo se comparado ao front, provendo tudo o que é necessário para que a informação ou funcionalidade solicitada seja resgatada de onde ela se encontra e retorne para o Frontend, que irá processá-la e apresentá-la ao usuário.

Existem diversas tecnologias hoje em dia nas quais podemos nos ater para desenvolver o Backend de uma aplicação, como por exemplo Python, Ruby, PHP, C#, etc. Hoje iremos trabalhar com o Node.js, que usa como base o JavaScript. Aprenderemos por meio deste artigo a estrutura fundamental para criar o nosso primeiro servidor com esta ferramenta. Sendo assim, mão na massa!

O que é o Node.js?

O Node é um intérprete da linguagem JavaScript, criado a partir de um outro chamado V8. Com o passar dos anos foi se tornando cada vez mais utilizado porque suporta o Javascript tanto no lado cliente quanto do lado servidor, além de ser de fácil compreensão. Hoje, é utilizado por diversas empresas como Paypal, Amazon e Netflix.

Durante o desenvolvimento neste artigo, utilizaremos o sistema de módulos CommonJs, mas não se atenha apenas a esta maneira de exportar e importar módulos, uma vez que a partir da versão 14 o Node começou a oferecer suporte para o ECMAScript 6.

Instalando o Node

É importante destacar que o Node deve estar instalado em sua máquina para que você possa desenvolver utilizando a ferramenta. Caso o seu sistema operacional seja o Mac ou Windows, navegue até o endereço https://nodejs.org/en/, realize o download da versão LTS (versão mais atual e estável do Node.js) e efetue a instalação executando o arquivo baixado. Se você utiliza alguma versão do Linux, digite as seguintes linhas de comando no seu terminal:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

nvm install lts/*

Se a instalação do Node foi concluída corretamente para qualquer um dos casos citados, ao executarmos o comando abaixo receberemos como informação no nosso terminal a versão do Node instalada:

node --version

Primeiros passos com Node

A primeira ação que faremos será criar um diretório para o nosso projeto e, dentro dele, iniciar um terminal onde executaremos o seguinte comando:

npm init -y

Esta linha digitada é responsável por criar um arquivo package.json que terá todas as informações importantes sobre o projeto que estamos criando. Podemos alterar este arquivo de duas formas: ou alteramos diretamente após ele ser criado, ou fazemos isto executando o comando npm init ao invés de npm init -y. Isto permitirá que sejam disponibilizadas uma série de perguntas antes da criação do arquivo, para que ao respondê-las estejamos preenchendo as informações do package.json.

O arquivo package.json ao ser iniciado com o comando citado anteriormente (npm init -y) criará um arquivo com as informações contidas a seguir:

Figura 1 - Arquivo package.json.

O campo name é criado com o nome do diretório em que estiver inserido. Já os campos version e description trazem a versão e descrição do projeto. Sinta-se à vontade para atualizar a versão de acordo com as alterações que forem realizadas e também para inserir uma descrição resumida e detalhada sobre a aplicação.

No campo main iremos preencher o endereço do nosso arquivo principal em que estará contido o servidor. Criaremos para isso o arquivo server.js dentro da pasta src e na main detalharemos o caminho até este arquivo criado, tomando como referência a pasta raíz:

Figura 2 - Criação do arquivo principal server e personalização do package.json.

Antes de direcionarmos nosso foco para o arquivo server.js, precisamos fazer uma última alteração essencial no arquivo package.json: o campo scripts. Nele, podemos inserir qualquer rotina de execução que será feita por meio do comando npm em um terminal aberto na pasta raíz. Neste caso, criaremos uma rotina que sempre execute por meio do Node o nosso arquivo server.js:

Figura 3 - Criação do script dev.

OBS - Colocamos o nome de dev no script criado, mas é possível inserir qualquer nome que desejarmos, então não se atente apenas a ele quando estiver criando os seus scripts!

Finalmente está tudo preparado para começarmos a criar nosso primeiro servidor. O foco agora é no arquivo server.js.

Estrutura básica de um servidor

Para que possamos construir uma aplicação capaz de manipular requisições e respostas, precisamos de um framework capaz de organizar estas informações e nos auxiliar em todo o processo. Esta ferramenta se chama Express e o instalaremos por meio do seguinte comando que deve ser executado na pasta raíz da nossa aplicação:

npm install express

A primeira ação a ser realizada deve ser importá-lo e executá-lo no arquivo server.js. Lembre que estamos utilizando o sistema de módulos CommonJs, então utilizaremos o require para a importação:

Figura 4 - Importação e execução do Express.


Feito isto, precisamos informar ao express em qual porta nós queremos que nossa aplicação funcione e qual função deve ser executada ao utilizarmos o script dev. Para tal, iremos utilizar a função listen localizada dentro do Express, que receberá como parâmetros o número da porta e uma função que no nosso caso executará apenas um console.log com a mensagem a seguir:

Figura 5 - Criando o método listen para a aplicação.

Abra o seu terminal na pasta raíz do projeto e digite agora o script que nós criamos no arquivo package.json:

npm run dev

Se tudo der certo, a mensagem que criamos na linha 6 deve aparecer no seu terminal da seguinte forma:

Figura 6 - Servidor em execução.


Tudo pronto! Temos o nosso primeiro servidor Node em execução! Todavia, se você acessar o endereço da porta que criamos (acesse o endereço http://localhost:3333 no seu navegador) verá que não há absolutamente nada a ser exibido além da mensagem “Cannot GET /”. Isto acontece porque não enviamos nenhuma informação via resposta para o nosso servidor.

Para qualquer tipo de ação realizada via protocolo HTTP (que é o que estamos prestes a fazer), existem métodos (ou verbos, como também são chamados) que definem qual ação deve ser realizada e qual resposta o servidor deve devolver. Hoje iremos trabalhar com o verbo GET. Para que isso aconteça, nos valeremos de uma função do Express chamada get, que receberá a rota onde as informações serão exibidas e uma função que recebe a requisição (req) e a resposta (res) como parâmetros:

Figura 7 - Criando o método GET.


O parâmetro req conterá todas as informações que forem enviadas para o nosso servidor (geralmente utilizamos outros métodos para isto, como o PUT, DELETE ou POST), enquanto o parâmetro res terá todas as respostas que enviaremos para exibição. Neste exemplo, utilizaremos apenas o res, retornando uma resposta do tipo send com um elemento HTML como parâmetro:

Figura 8 - Criando o método GET com a resposta criada.

Existem vários tipos de respostas que podemos encaminhar, seja no formato JSON (res.json), ou redirecionamentos (res.redirect), ou ainda páginas inteiras (res.render) e a que estamos utilizando, que permite o envio de textos e elementos HTML. É exatamente isto que estamos fazendo: Adicionando para a resposta um elemento HTML do tipo div, que por sua vez possui outros elementos inseridos dentro dele.

Note que mesmo fazendo todas estas implementações, quando você atualizar sua página existente na porta 3333 ainda não haverá nada sendo exibido. Isso acontece porque, da forma como estruturamos nosso servidor, precisamos sempre reiniciá-lo para que ele atualize as informações que inserimos. Sendo assim, encerre o servidor no terminal (Ctrl+C) e execute novamente o script npm run dev e, ao atualizar a página, a magia acontecerá.

Figura 9 - Aplicação em execução.

Muito chato ter que reiniciar o nosso servidor sempre que realizamos uma alteração, não acha? E se eu te disser que existe uma forma para que sempre que salvarmos os arquivos do projeto, a própria aplicação já atualize o servidor automaticamente? Primeiramente, encerre a execução do servidor (Ctrl+C) e faça a seguinte instalação na pasta raíz via terminal:

npm install nodemon

Feito isto, iremos editar o nosso script, informando para a nossa aplicação que, a partir da agora, ao invés do Node executar o nosso arquivo server.js, quem irá fazer isso será o nodemon que acabamos de instalar. Esta ferramenta faz exatamente a função desejada por nós: ela observa se houve algum novo salvamento dos arquivos que compõem a aplicação e, em caso positivo, atualiza o servidor sem precisar “derrubá-lo”.

Figura 10 - Substituindo no script dev o node pelo nodemon.

Agora, quando executamos o nosso script no terminal, teremos o seguinte retorno:

Figura 11 - Executando o script com a nova alteração.


OBS - Sempre que enviamos uma resposta para o nosso servidor, é comum que esta também possua um status que, a partir dele, seja possível identificar do que se trata a mensagem, se ela deu certo e se está tudo nos conformes. Para enviar um status junto com a resposta basta inserir a seguinte alteração na função res:

Figura 12 - Adicionando um status para a response enviada.

Considerações Finais

Neste artigo, vimos os conceitos básicos e essenciais para criar um servidor funcional com o uso do Node.js, utilizando o verbo GET. É importante destacar que existem diversos métodos HTTP sendo os mais conhecidos GET, POST, PUT e DELETE.

Cada um é utilizado para uma determinada funcionalidade e situação e é essencial entender o máximo possível a respeito deles para que possamos realizar requisições e respostas efetivas com o Node.js. Mas diz aí: Você já conhecia outros verbos além do GET? Conta para gente nos comentários!

Até logo!

💡
As opiniões e comentários expressos neste artigo são de propriedade exclusiva de seu autor e não representam necessariamente o ponto de vista da Revelo.

A Revelo Content Network acolhe todas as raças, etnias, nacionalidades, credos, gêneros, orientações, pontos de vista e ideologias, desde que promovam diversidade, equidade, inclusão e crescimento na carreira dos profissionais de tecnologia.