Primeira aplicação web com Node.js do zero

Fala galera, como vocês estão ?

As coisas estão ficando cada vez melhores, nesse artigo vamos criar nosso primeiro servidor web com node.js sem bibliotecas externas.

O que fazemos

Como foi dito, vamos criar um servidor em nodejs que vai renderizar uma tela html. Iremos consumir essa tela pelo navegador do PC e pelo navegador do smartphone. Sim, meus queridos, o servidor vai rodar no seu computador e vai ser possível acessá-lo no seu smartphone. Bora nóis !

Requisitos e ferramentas

Para criar esse projeto precisamos de algumas ferramentas:

  • Node.js: Caso ainda não tenha instalado em sua máquina acesse o artigo Hello World: Nodejs onde eu apresento o nodejs e mostro como instalar ele na máquina linux.
  • npm: Instalado junto com o Node.js no artigo Hello World: Nodejs
  • Além disso estou utilizando o editor de texto Visual Studio Code (Opcional)

Criando o servidor web

O primeiro passo é criar uma pasta para o nosso projeto, no meu caso vou chamar de first_web_service. Dentro da pasta execute o comando abaixo para iniciar o projeto node:

npm init -y



O comando npm init cria um arquivo package.json que armazena as configurações, informações e dependências do seu projeto node.js. A tag -y evita que algumas perguntas sejam feitas, como exemplo o nome do autor, descrição do projeto versão e por aí vai.

Atenção: para mais informações sobre arquivo package.json acesse link da documentação

Continuando vamos criar um arquivo chamado service.js e dentro dele vamos adicionar o código para que nosso servidor fique disponível.

  • Importar o módulo http do Node. Esse módulo tem o método que utilizaremos para criar o servidor
  // importar módulo http do Node
  var http = require('http');
  • Agora vamos criar o servidor com o método createServer
  // importar módulo http do Node
  var http = require('http');

  // criação do servidor
  const server = http.createServer();
  • Com o servidor criado e registrado na variável server precisamos que ele escute solicitações de requisições e retorne alguma informação
  // importar módulo http do Node
  var http = require('http');

  // criação do servidor
  const server = http.createServer();

  // Escutar eventos
  server.on('request', (request, res) => {
     res.end("<h1> Hello World!! :D</h1>");
  });
  • Para finalizar precisamos iniciar o servidor e definir a porta em que ele vai rodar na sua máquina
  // importar módulo http do Node
  var http = require('http');

  // criação do servidor
  const server = http.createServer();

  // Escutar eventos
  server.on('request', (request, res) => {
     res.end("<h1> Hello World!! :D</h1>");
  });

  // porta que o servidor vai rodar
    const port = 3003
  // Iniciando o servidor
  server.listen(port, function() {
    console.log(`Servidor iniciado na porta ${port}!`);
  });



Prontinho, é isso. Agora basta executar node server.js no seu terminal e você vai receber o seguinte resultado:

drawing Resultado da execução

Agora acesse seu navegador com o link: http://localhost:3003/

drawing Resultado da execução

Muito bom não é ? agora você tem um servidor rodando na porta 3003 do seu computador e pode ser acessada por qualquer navegador na sua máquina

Acessando pelo smartphone

Vamos acessar nosso servidor pelo smartphone. Para isso precisamos ter atenção em alguns pontos:

  • O servidor tem que está rodando
  • O smartphone tem que está na mesma rede do computador que está executando o servidor



Com isso em mente, o primeiro passo é descobrir o ip no seu computador. No linux podemos rodar o seguinte comando:

  ifconfig



Esse comando vai apresentar várias informações de rede da sua máquina. Procure algo parecido com 192.168.1.15. É possível encontrar essa informação nas suas configurações de rede.

Com o ip do seu PC em mãos basta abrir o navegador do seu smartphone e acessar o link http://192.168.1.15:3003/.

Atenção: 192.168.1.15 é o ip da minha máquina. Para que funcione no seu smartphone é preciso utilizar o ip da sua máquina http://IP_DO_SEU_PC:3003/.

A imagem abaixo mostra o servidor sendo acessado pelo meu smartphone:

drawing

Parabéns e obrigado por ter chegado até aqui. Finalizamos mais um artigo sobre node.js. Criamos um servidor e acessamos ele do navegador do smartphone. Espero que tenha gostado e até a próxima.

Links