Construindo um Servidor Expresso Simples

Resumo : neste tutorial, você aprenderá sobre a estrutura da web Express e começará a construir um servidor Express simples.

Introdução à estrutura da web Express

Express é uma estrutura web mínima e flexível para Node.js. Express fornece um conjunto de recursos adequados para a construção de aplicações web.

Além disso, o Express fornece utilitários HTTP que permitem desenvolver APIs de forma rápida e fácil. Também é adequado para criar API para aplicativos móveis.

Quando um aplicativo node.js recebe uma solicitação HTTP, ele passa a solicitação para o Express. Por exemplo:

https://localhost:3000/Linguagem de código:  JavaScript  ( javascript )

Quando o Express vê a /rota, ele executa uma função para tratar a solicitação, como retornar um conteúdo ao cliente. A função que trata uma rota é chamada de manipulador de rota.

Instale a estrutura Express

Antes de usar o Express, você precisa instalá-lo usando o seguinte npmcomando:

npm install expressLinguagem de código:  JavaScript  ( javascript )

Se você usa macOS ou Linux, você pode usar o sudo npmcomando.

sudo npm install expressLinguagem de código:  JavaScript  ( javascript )

Crie um aplicativo Express simples

Primeiro, crie um novo diretório de projeto chamado express-server.

mkdir express-serverLinguagem de código:  JavaScript  ( javascript )

Segundo, execute o npm init --yescomando:

npm init --yesLinguagem de código:  JavaScript  ( javascript )

Terceiro, crie um index.jsarquivo com o seguinte código:

const express = require("express");
const app = express();

app.get("/", (request, response) => {
    response.send("Hi there");
});

app.listen(3000, () => {
    console.log("Listen on the port 3000...");
});Linguagem de código:  JavaScript  ( javascript )

Como funciona.

Primeiro, carregue o módulo Express:

const express = require('express');Linguagem de código:  JavaScript  ( javascript )

A expressé uma função que retorna uma instância de um aplicativo Express.

Segundo, chame a express()função para obter uma instância do Expressaplicativo:

const app = express();  Linguagem de código:  JavaScript  ( javascript )

Terceiro, defina um manipulador de rota que lide com a solicitação HTTP GET para a rota do site/

app.get('/', (req, res) => {
    res.send('Hi there');
});Linguagem de código:  JavaScript  ( javascript )

O get()método possui dois parâmetros:

• O primeiro parâmetro é a rota. Neste caso, é a raiz do site /.
• O segundo parâmetro é uma função de retorno de chamada com dois parâmetros: requeste response.

O requestrepresenta a solicitação HTTP e o responseparâmetro descreve a resposta HTTP. Estas são as instâncias das classes Request e Response. Eles têm muitas propriedades e métodos úteis para lidar com solicitações e respostas HTTP.

Neste exemplo, chamamos o send()método do objeto de resposta HTTP para enviar de volta um texto simples.

Por fim, instrua o node.js a escutar a solicitação HTTP na porta 3000:

app.listen(3000, () => {
    console.log("Listen on the port 3000...");
});Linguagem de código:  JavaScript  ( javascript )

Para executar o aplicativo, você pode abrir o terminal e digitar o seguinte comando:

node index.jsLinguagem de código:  JavaScript  ( javascript )

Se você vir a seguinte saída, significa que o aplicativo foi executado com sucesso:

Listen on the port 3000...Linguagem de código:  JavaScript  ( javascript )

Caso contrário, você precisará verificar novamente o código acima se houver algum erro de digitação.

Para enviar uma solicitação HTTP GET para o aplicativo Express, você pode abrir o navegador da web e digitar o seguinte URL:

http://localhost:3000/Linguagem de código:  JavaScript  ( javascript )

E você verá a seguinte mensagem no navegador da web:

Hi thereLinguagem de código:  JavaScript  ( javascript )

Para adicionar outra rota, por exemplo, /aboutvocê adiciona um novo manipulador de rota ao index.jsarquivo assim:

const express = require("express");
const app = express();

app.get("/", (request, response) => {
    response.send("Hi there");
});

app.get("/about", (request, response) => {
    response.send("<h1>About</h1>");
});

app.listen(3000, () => {
    console.log("Listen on the port 3000...");
});Linguagem de código:  JavaScript  ( javascript )

Para executar o novo aplicativo, você precisa interromper o aplicativo atual e iniciá-lo novamente.

Ao navegar para o seguinte URL:

http://localhost:3000/aboutLinguagem de código:  JavaScript  ( javascript )

você verá o seguinte conteúdo:

AboutLinguagem de código:  JavaScript  ( javascript )

Ao visualizar o código-fonte da página, você verá o seguinte HTML:

<h1>About</h1>Linguagem de código:  JavaScript  ( javascript )

Convenção comunitária

Se você olhar o código em outro lugar, encontrará os parâmetros dos manipuladores de rota assim:

app.get("/about", (req, res) => {
    res.send("<h1>About</h1>");
});Linguagem de código:  JavaScript  ( javascript )

Nesta sintaxe, reqsignifica solicitação e ressignifica resposta. É uma convenção da comunidade para economizar digitação. Seguiremos esta convenção no próximo tutorial.

Resumo

• Express é uma estrutura de aplicativo web flexível para construção de aplicativos web.