close

பயன்படுத்துகிறது Template Engine _ Express.js

இணைய வளர்ச்சியில், இணையப் பக்கங்களில் சேவையகத்திலிருந்து தரவைக் காண்பிப்பது ஊடாடும் மற்றும் மாறும் பயனர் அனுபவங்களை உருவாக்குவதற்கு முக்கியமானது. இங்குதான் மீட்புக்கு வாருங்கள் Template Engine. Express.js A Template Engine என்பது சேவையகத்திலிருந்து தரவை HTML குறியீட்டில் செலுத்துவதன் மூலம் டைனமிக் HTML டெம்ப்ளேட்களை உருவாக்க உங்களை அனுமதிக்கும் ஒரு கருவியாகும்.

ஏன் பயன்படுத்த வேண்டும் Template Engine ?

Template Engine சேவையகத்திலிருந்து வரும் தரவுகளிலிருந்து HTML மார்க்அப்பைப் பிரிக்க உதவுங்கள். ஒவ்வொரு வரியிலும் தரவை உட்பொதிக்காமல் HTML குறியீட்டை எளிதாக நிர்வகிக்க இது உங்களை அனுமதிக்கிறது. அதற்கு பதிலாக, நீங்கள் HTML குறியீட்டிற்குள் "பிளேஸ்ஹோல்டர்கள்" அல்லது "குறிச்சொற்களை" உருவாக்குவீர்கள், இது Template Engine பின்னர் சேவையக தரவை நிரப்பும்.

பயன்படுத்துகிறது Template Engine _ Express.js

Express.js template engine பக்(முன்னர் ஜேட் என அறியப்பட்டது) மற்றும் EJS(உட்பொதிக்கப்பட்ட ஜாவாஸ்கிரிப்ட்) போன்ற பலவற்றை ஆதரிக்கிறது. கீழே Pug மற்றும் EJS ஐப் பயன்படுத்துவதற்கான எடுத்துக்காட்டுகள் Express.js:

பக் பயன்படுத்துதல் Template Engine

பக் நிறுவவும்: நீங்கள் npm வழியாக தொகுப்பை நிறுவ வேண்டும் pug.

npm install pug --save

கட்டமைக்கவும் Template Engine: உங்கள் பயன்பாட்டின் உள்ளமைவு கோப்பில்(எ.கா., app.js), பக் என வரையறுக்கவும் template engine.

app.set('view engine', 'pug');

ஒரு பக் டெம்ப்ளேட்டை உருவாக்கவும்: கோப்பகத்தில் பக் கோப்புகளை உருவாக்கவும் views. எடுத்துக்காட்டாக, ஒரு index.pug கோப்பை உருவாக்கவும்:

doctype html  
html  
  head  
    title My Express App  
  body  
    h1 Welcome to My Express App  
    p #{message}

template engine பாதை கையாளுதல் மற்றும் தரவு வழங்குதல்: வழி கையாளுதலில், நீங்கள் பயன்பாட்டிற்கு தரவை அனுப்பலாம் res.render().

app.get('/',(req, res) => {  
  const message = 'Hello from Express!';  
  res.render('index', { message });  
});

EJS ஐப் பயன்படுத்துதல் Template Engine

EJS ஐ நிறுவவும்: ejs npm வழியாக தொகுப்பை நிறுவவும்.

npm install ejs --save

கட்டமைக்கவும் Template Engine: template engine உங்கள் பயன்பாட்டின் உள்ளமைவில் EJS ஐ வரையறுக்கவும்.

app.set('view engine', 'ejs');

EJS டெம்ப்ளேட்டை உருவாக்கவும்: கோப்பகத்தில் EJS கோப்புகளை உருவாக்கவும் views. எடுத்துக்காட்டாக, ஒரு index.ejs கோப்பை உருவாக்கவும்:

<!DOCTYPE html>  
<html>  
<head>  
  <title>My Express App</title>  
</head>  
<body>  
  <h1>Welcome to My Express App</h1>  
  <p><%= message %></p>  
</body>  
</html>

பாதை கையாளுதல் மற்றும் தரவு வழங்குதல்: வழி கையாளுதலில், பயன்பாட்டிற்கு தரவை template engine அனுப்பவும் res.render().

app.get('/',(req, res) => {  
  const message = 'Hello from Express!';  
  res.render('index', { message });  
});

 

முடிவுரை

Template Engine உள்ள பயன்படுத்தி Express.js நீங்கள் டைனமிக் இணைய பக்கங்களை உருவாக்க மற்றும் பயனர் உலாவியில் சர்வரில் இருந்து தகவலை காண்பிக்க அனுமதிக்கிறது. Pug, EJS அல்லது பிறவற்றைப் பயன்படுத்துவதன் மூலம் template engine, சிறந்த பயனர் அனுபவத்தை வழங்கும் மற்றும் HTML குறியீடு மற்றும் தரவின் நிர்வாகத்தை மேம்படுத்தும் ஊடாடும் மற்றும் நெகிழ்வான வலைப்பக்கங்களை நீங்கள் உருவாக்கலாம்.