Bl- użu Template Engine fi Express.js

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.