I bhforbairt gréasáin, tá sé ríthábhachtach sonraí ón bhfreastalaí a thaispeáint ar leathanaigh ghréasáin chun eispéiris úsáideora idirghníomhacha agus dhinimiciúla a chruthú. Is é seo an áit Template Engine a Express.js thagann chun an tarrthála. Is uirlis é A Template Engine a ligeann duit teimpléid HTML dinimiciúla a chruthú trí shonraí ón bhfreastalaí a instealladh isteach i gcód HTML.
Cén Fáth Úsáid Template Engine ?
Template Engine cabhrú le marcáil HTML a scaradh ó shonraí a thagann ón bhfreastalaí. Ligeann sé seo duit cód HTML a bhainistiú ar bhealach níos éasca gan sonraí a leabú isteach i ngach líne de chód. Ina áit sin, cruthóidh tú "socraitheoirí" nó "clibeanna" laistigh den chód HTML, a Template Engine líonfaidh siad níos déanaí le sonraí ar thaobh an fhreastalaí.
Ag baint úsáide Template Engine as i Express.js
Express.js tacaíochtaí éagsúla template engine, mar shampla Pug(ar a dtugtaí Jade roimhe seo) agus EJS(Javascript Leabaithe). Seo thíos samplaí de Pug agus EJS a úsáid i Express.js:
Ag baint úsáide as Pug Template Engine
Suiteáil Pug: Ní mór duit an pug pacáiste a shuiteáil trí npm.
npm install pug --save
Cumraigh Template Engine: I gcomhad cumraíochta d'fheidhmchláir(m.sh., app.js), sainmhínigh Pug mar an template engine.
app.set('view engine', 'pug');
Cruthaigh Teimpléad Pug: Cruthaigh comhaid Pug san views eolaire. Mar shampla, cruthaigh index.pug comhad:
doctype html
html
head
title My Express App
body
h1 Welcome to My Express App
p #{message}
Láimhseáil Bealaí agus Rindreáil Sonraí: Agus tú ag láimhseáil bealaigh, is féidir leat sonraí a chur ar aghaidh chuig template engine an res.render().
app.get('/',(req, res) => {
const message = 'Hello from Express!';
res.render('index', { message });
});
Ag baint úsáide as EJS Template Engine
Suiteáil EJS: Suiteáil an ejs pacáiste trí npm.
npm install ejs --save
Cumraigh Template Engine: Sainmhínigh EJS mar an template engine i gcumraíocht d'fheidhmchláir.
app.set('view engine', 'ejs');
Cruthaigh Teimpléad EJS: Cruthaigh comhaid EJS san views eolaire. Mar shampla, cruthaigh index.ejs comhad:
<!DOCTYPE html>
<html>
<head>
<title>My Express App</title>
</head>
<body>
<h1>Welcome to My Express App</h1>
<p><%= message %></p>
</body>
</html>
Láimhseáil Bealaigh agus Rindreáil Sonraí: Agus tú ag láimhseáil bealaigh, cuir na sonraí ar aghaidh chuig template engine an res.render().
app.get('/',(req, res) => {
const message = 'Hello from Express!';
res.render('index', { message });
});
Conclúid
Ligeann úsáid Template Engine isteach Express.js duit leathanaigh ghréasáin dhinimiciúla a chruthú agus faisnéis a thaispeáint ón bhfreastalaí ar bhrabhsálaí an úsáideora. Trí úsáid a bhaint as Pug, EJS, nó eile template engine, is féidir leat leathanaigh ghréasáin idirghníomhacha agus solúbtha a thógáil a sholáthraíonn eispéireas úsáideora níos fearr agus a bhainistíonn cód HTML agus sonraí a bharrfheabhsú.