Para começar, entendemos um pouco de para que serve e como funciona o EJS. Ele será utilizado tanto para exibir códigos HTML dentro da nossa aplicação Node, como também para inserir códigos Javascript dentro de códigos HTML.
Dando uma olhada por cima, vejo que a sintaxe é um pouco parecida com a do PHP, quando inserimos código dentro do HTML.
npm init -y
npm install express --save
npm install ejs --save
Ao montar uma estrutura básica de Servidor, para indicar que será utilizado o EJS é bem simples, só é preciso adicionar uma linha.
const express = require("express");
const app = express();
// Indica para o Express usar o EJS como View Engine
app.set('view engine', 'ejs');
app.get("/", (req, res) => {
res.send("Bem vindo ao meu site!");
});
app.listen(8080, () => {
console.log("App rodando: <http://localhost:8080> (Ctrl+Click)");
});
Todos os arquivos HTML deverão devem seguir a extensão .ejs e serem colocados em um diretório /views na Raiz do projeto. Ao utilizar o método render(), o express automaticamente olha dentro do diretório /views.
E para exibir um parâmetro dentro de um arquivo HTML é bem simples, como veremos nos códigos abaixo.
Arquivo de rota index.js:
app.get("/:nome/:lang", (req, res) => {
//res.send("Bem vindo ao meu site!");
var nome = req.params.nome;
var lang = req.params.lang;
res.render('index', {
nome: nome,
lang: lang,
empresa: "Google",
}); // o render vai pegar o arquivo direto na pasta /views, o outro parametro/objeto será as variaveis que serão passadas para o HTML
});
Arquivo renderizado dentro da rota de rota index.ejs:
<body>
<h1>Hello World!</h1>
<p>Olá, meu nome é <strong><%= nome %></strong>, estou estudando Formação NodeJs,
onde utilizamos a linguagem <strong><%= lang %></strong>.
Eu trabalho na empresa <strong><%= empresa %></strong></p>
</body>