Tutorial do Framework Node.js Express.js

Neste tutorial, estudaremos o framework Express. Este framework foi desenvolvido de forma a funcionar como um framework de aplicação web Node.js minimalista e flexível, fornecendo um conjunto robusto de recursos para a construção de aplicações web de página única, multipágina e híbridas.

O que é Express.js?

Express.js é um framework de servidor de aplicações web Node.js, projetado especificamente para a construção de aplicações web de página única, múltiplas páginas e híbridas.

Tornou-se o framework de servidor padrão para Node.js. O Express é a parte de backend de algo conhecido como MEAN stack.

O Express oferece roteamento e middleware em camadas sobre o núcleo HTTP do Node.js. córregos e APIs de eventos.

O MEAN é gratuito e de código aberto JavaScript pilha de software para construção de sites e aplicações web dinâmicos que possui os seguintes componentes;

1) MongoDB — O banco de dados NoSQL padrão

2) Expresso.js — A estrutura padrão para aplicações web

3) AngularJS - O JavaFramework Script MVC usado para aplicações web

4) Node.js — Framework utilizado para aplicações escaláveis ​​de servidor e de rede.

A estrutura Express.js torna muito fácil desenvolver um aplicativo que pode ser usado para lidar com vários tipos de solicitações, como solicitações GET, PUT e POST e DELETE.

Instalando e usando o Express

Express é instalado através do Node Package Manager. Isso pode ser feito executando a seguinte linha na linha de comando

npm instalar expresso

O comando acima solicita ao Node Package Manager que baixe o pacote express necessário. módulos e instale-os de acordo.

Nota de versão: O npm agora instala o Express 5.2; muitos projetos ainda usam o Express 4. Ambos executam os exemplos abaixo em um Versão compatível com Node.js.

Vamos usar nosso framework Express recém-instalado e criar um aplicativo simples “Hello World”.

Nosso aplicativo criará um simples módulo de servidor que ficará escutando na porta 3000. Em nosso exemplo, se uma requisição for feita através do navegador nessa porta, o servidor enviará uma resposta "Olá Mundo" para o cliente.

var express=require('express');
var app=express();
app.get('/',function(req,res)
{
res.send('Hello World!');
});
var server=app.listen(3000,function() {});

Code Explicação:

1. Em nossa primeira linha de código, estamos usando a função require para incluir o “módulo expresso”.
2. Antes de começarmos a usar o módulo express, precisamos transformá-lo em um objeto.
3. Aqui, estamos criando uma função de retorno de chamada (callback). Essa função será chamada sempre que alguém acessar a raiz do nosso aplicativo web, que é http://localhost:3000. A função de retorno de chamada será usada para enviar a string 'Olá Mundo' para a página web.
4. Na função de retorno de chamada, estamos enviando a string “Hello World” de volta ao cliente. O parâmetro 'res' é usado para enviar conteúdo de volta para a página web. Este parâmetro 'res' é fornecido pelo módulo 'request' para permitir o envio de conteúdo de volta para a página da web.
5. Em seguida, usamos a função listen para fazer com que nosso aplicativo servidor escute as solicitações do cliente na porta 3000. Você pode especificar qualquer porta disponível aqui.

Se o comando for executado com sucesso, a seguinte saída será mostrada quando você executar seu código no navegador.

Saída:

Da saída,

• Você pode ver isso claramente se navegar até o URL Ao acessar o localhost na porta 3000, você verá a string 'Hello World' exibida na página.
• Como especificamos em nosso código que o servidor deve escutar na porta 3000, conseguimos visualizar a saída ao acessar este endereço. URL.

O que são rotas?

Uma única rota raiz é apenas o ponto de partida.

O roteamento determina a forma como uma aplicação responde a uma solicitação de um cliente para um determinado ponto de extremidade.

Por exemplo, um cliente pode fazer uma requisição HTTP GET, POST, PUT ou DELETE para diversos fins. URL tais como as mostradas abaixo;

http://localhost:3000/Books
http://localhost:3000/Students

No exemplo acima,

• Se uma solicitação GET for feita pela primeira vez URL, então a resposta ideal deveria ser uma lista de livros.
• Se a solicitação GET for feita pela segunda vez URL, então a resposta idealmente deveria ser uma lista de alunos.
• Então, com base em URL Ao acessar uma determinada página, uma funcionalidade diferente do servidor web será invocada e, consequentemente, a resposta será enviada ao cliente. Esse é o conceito de roteamento.

Cada rota pode ter uma ou mais funções de tratamento, que são executadas quando a rota é correspondida.

A sintaxe geral para uma rota é mostrada abaixo

app.METHOD(PATH, HANDLER)

Em que,

1) app é uma instância do módulo expresso

2) METHOD é um método de solicitação HTTP (GET, POST, PUT ou DELETE)

3) PATH é um caminho no servidor.

4) HANDLER é a função executada quando a rota é correspondida.

⚠️ Expresso 5 notas: essas assinaturas permanecem inalteradas, mas app.del() tornou-se app.delete(), res.sendfile() tornou-se res.sendFile() e os curingas agora precisam de nomes como /*splat.

Vejamos um exemplo de como podemos implementar rotas no Express. Nosso exemplo criará 3 rotas da seguinte forma:

1. Uma rota /Node que exibirá a string “Tutorial on Node” se esta rota for acessada
2. Uma rota /Angular que exibirá a string “Tutorial on Angular” se esta rota for acessada
3. Uma rota padrão / que exibirá a mensagem “Bem-vindo ao Guru99 tutoriais.”

Nosso código básico permanecerá o mesmo dos exemplos anteriores. O trecho abaixo é um complemento para mostrar como o roteamento é implementado.

var express = require('express');
var app = express();
app.route('/Node').get(function(req,res)
{
    res.send("Tutorial on Node");
});
app.route('/Angular').get(function(req,res)
{
    res.send("Tutorial on Angular");
});
app.get('/',function(req,res){
    res.send('Welcome to Guru99 Tutorials');
});

Code Explicação:

1. Aqui estamos definindo uma rota se o URL http://localhost:3000/Node is selected in the browser. To the route, we are attaching a callback function which will be called when we browse to the Node URLA função possui 2 parâmetros.
   • O principal parâmetro que utilizaremos é o parâmetro 'res', que pode ser utilizado para enviar informações de volta ao cliente.
   • O parâmetro 'req' contém informações sobre a solicitação que está sendo feita. Às vezes, parâmetros adicionais podem ser enviados como parte da solicitação feita e, portanto, o parâmetro 'req' pode ser usado para localizar os parâmetros adicionais que estão sendo enviados.
2. Estamos usando a função send para enviar a string “Tutorial on Node” de volta ao cliente se a rota do Node for escolhida.
3. Aqui estamos definindo uma rota se o URL http://localhost:3000/Angular is selected in the browser. To the route, we are attaching a callback function which will be called when we browse to the Angular URL.
4. Estamos usando a função send para enviar a string “Tutorial on Angular” de volta ao cliente se a rota Angular for escolhida.
5. Esta é a rota padrão escolhida ao acessar a raiz da aplicação — http://localhost:3000. Ao escolher a rota padrão, a mensagem “Bem-vindo ao Guru"99 tutoriais" serão enviados ao cliente.

Se o comando for executado com sucesso, a seguinte saída será mostrada quando você executar seu código no navegador.

Saída:

Da saída,

• Você pode ver isso claramente se navegar até o URL Ao acessar o localhost na porta 3000, você verá a string 'Welcome to Guru99 tutoriais exibidos na página.
• Porque em nosso código, mencionamos que nosso padrão é URL exibirá esta mensagem.

Em seguida, navegue até /Node.

Da saída,

• Você pode ver que se o URL se a rota for alterada para /Node, a rota Node correspondente será selecionada e a string “Tutorial on Node” será exibida.

Em seguida, navegue até /Angular.

Da saída,

• Você pode ver que se o URL se a rota for alterada para /Angular, a rota Node correspondente será selecionada e a string “Tutorial on Angular” será exibida.

Exemplo de servidor Web usando express.js

No exemplo acima, vimos como podemos decidir qual saída exibir com base no roteamento. Esse tipo de roteamento é usado na maioria das aplicações web modernas. A outra parte de um servidor web envolve o uso de templates em Node.js.

Ao criar aplicações Node.js rápidas e práticas, uma maneira fácil e ágil é usar templates. Existem muitos frameworks disponíveis no mercado para a criação de templates. Neste caso, usaremos o framework Jade como exemplo.

O Jade é instalado através do Node Package Manager. Isso pode ser feito executando a seguinte linha na linha de comando.

npm instalar jade

O comando acima solicita ao Node Package Manager que baixe os módulos Jade necessários e os instale adequadamente.

OBSERVAÇÃO: Na versão mais recente do Node, o jade foi descontinuado. Em vez disso, use pug.

⚠️ Equivalente moderno: instalar Pug, renomeie index.jade para index.pug e defina app.set('view engine','pug'). O pacote jade não recebe atualizações; as etapas abaixo ainda são executadas.

Vamos usar o framework Jade que acabamos de instalar e criar alguns modelos básicos.

Passo 1) O primeiro passo é criar um modelo Jade. Crie um arquivo chamado index.jade e insira o código abaixo. Certifique-se de criar o arquivo na pasta “views”.

1. Aqui estamos especificando que o título da página será alterado para qualquer valor passado quando este modelo for invocado.
2. Também estamos especificando que o texto na tag de cabeçalho será substituído por qualquer texto passado no modelo Jade.

Segue abaixo o código do aplicativo que o renderiza.

var express=require('express');
var app=express();
app.set('view engine','jade');
app.get('/',function(req,res)
{
res.render('index',
{title:'Guru99',message:'Welcome'})
});
var server=app.listen(3000,function() {});

Code Explicação:

1. A primeira coisa a especificar na aplicação é o "mecanismo de visualização" que será usado para renderizar os templates. Como usaremos o Jade para renderizar nossos templates, especificamos isso de acordo.
2. A função render é usada para renderizar uma página da web. Em nosso exemplo, estamos renderizando o modelo (index.jade) que foi criado anteriormente.
3. Estamos transmitindo os valores de “GuruOs valores “99” e “Welcome” serão substituídos pelos parâmetros “title” e “message”, respectivamente. Esses valores serão substituídos pelos parâmetros 'title' e 'message' declarados no modelo index.jade.

Se o comando for executado com sucesso, a seguinte saída será mostrada quando você executar seu código no navegador.

Saída:

Da saída,

• Podemos ver que o título da página é definido como “Guru99” e o cabeçalho da página é definido como “Bem-vindo”.
• Isso ocorre devido ao modelo Jade que é invocado em nossa aplicação Node.js.

Perguntas Frequentes