Fl-iżvilupp tal-web, il-wiri tad-dejta mis-server fuq il-paġni tal-web huwa kruċjali biex jinħolqu esperjenzi tal-utent interattivi u dinamiċi. Dan huwa fejn Template Engine jidħlu Express.js għall-salvataġġ. A Template Engine hija għodda li tippermettilek toħloq mudelli HTML dinamiċi billi tinjetta data mis-server fil-kodiċi HTML.
Għaliex Użu Template Engine ?
Template Engine tgħin biex tissepara l-markup HTML mid-dejta li tkun ġejja mis-server. Dan jippermettilek timmaniġġja l-kodiċi HTML b'mod aktar faċli mingħajr ma jkollok daħħal id-dejta f'kull linja ta 'kodiċi. Minflok, inti ser toħloq "placeholders" jew "tags" fi ħdan il-kodiċi HTML, li l- Template Engine aktar tard se jimlew b'dejta fuq in-naħa tas-server.
Bl- użu Template Engine fi Express.js
Express.js jappoġġja diversi template engine, bħal Pug(magħruf qabel bħala Jade) u EJS(Embedded JavaScript). Hawn taħt hawn eżempji ta’ kif tuża Pug u EJS fi Express.js:
Bl-użu Pug Template Engine
Installa Pug: Għandek bżonn tinstalla l pug
-pakkett permezz ta 'npm.
npm install pug --save
Ikkonfigura Template Engine: Fil-fajl tal-konfigurazzjoni tal-applikazzjoni tiegħek(eż, app.js
), iddefinixxi Pug bħala l- template engine.
app.set('view engine', 'pug');
Oħloq Mudell Pug: Oħloq fajls Pug fid- views
direttorju. Per eżempju, oħloq index.pug
fajl:
doctype html
html
head
title My Express App
body
h1 Welcome to My Express App
p #{message}
Immaniġġjar tar-rotot u Rendiment tad-Data: Fl-immaniġġjar tar-rotta, tista 'tgħaddi d-data lill- template engine użu res.render()
.
app.get('/',(req, res) => {
const message = 'Hello from Express!';
res.render('index', { message });
});
Bl-użu tal-EJS Template Engine
Installa EJS: Installa l ejs
-pakkett permezz ta 'npm.
npm install ejs --save
Ikkonfigura Template Engine: Iddefinixxi EJS bħala template engine fil-konfigurazzjoni tal-applikazzjoni tiegħek.
app.set('view engine', 'ejs');
Oħloq Mudell EJS: Oħloq fajls EJS fid- views
direttorju. Per eżempju, oħloq index.ejs
fajl:
<!DOCTYPE html>
<html>
<head>
<title>My Express App</title>
</head>
<body>
<h1>Welcome to My Express App</h1>
<p><%= message %></p>
</body>
</html>
Immaniġġjar tar-rotot u Rendiment tad-Data: Fl-immaniġġjar tar-rotta, għaddi d-data lill- template engine użu res.render()
.
app.get('/',(req, res) => {
const message = 'Hello from Express!';
res.render('index', { message });
});
Konklużjoni
L-użu Template Engine in Express.js jippermettilek toħloq paġni tal-web dinamiċi u turi informazzjoni mis-server fuq il-browser tal-utent. Billi tuża Pug, EJS, jew template engine, tista' tibni paġni tal-web interattivi u flessibbli li jipprovdu esperjenza aħjar għall-utent u jottimizzaw il-ġestjoni tal-kodiċi HTML u d-dejta.