Gallery
Share
Explore

the ejs file type

Learning Outcomes:
How does this node technology work?
What is its' role in developing the node application stack?

EJS (Embedded JavaScript) in Node.js Development

Introduction to EJS:
EJS, short for Embedded JavaScript, is a template engine for Node.js and other JavaScript platforms.
It allows us to embed JavaScript code directly into HTML templates, making it easier to generate dynamic content.
EJS is a popular choice for rendering dynamic web pages and email templates in Node.js applications.
How EJS Works:
EJS works by combining data with templates to generate HTML dynamically.
In an EJS file, we use tags <% %> to include JavaScript code that will be executed during rendering.
The <% %> tags are used for control flow, loops, and variable interpolation.
Role of EJS in the Node Application Stack:
In the Node application stack, EJS plays a crucial role in the View layer of the Model-View-Controller (MVC) architecture.
It is responsible for rendering the HTML content that is sent to the client's browser.
When a request is received in the Node.js server, EJS is used to combine data from the Model and templates from the View to create the final HTML output.
EJS allows developers to keep the business logic and data manipulation in the Controller and Model, respectively, separate from the presentation logic in the View.
Advantages of Using EJS:
Simplicity: EJS follows a simple syntax, making it easy for developers to read and write template files.
JavaScript Support: EJS allows us to use JavaScript code directly within the template, enabling dynamic content generation.
Partial Views: EJS supports partial views, which are reusable components that can be included in multiple templates, promoting code reusability.
Performance: EJS templates are pre-compiled into JavaScript functions, leading to faster rendering compared to some other template engines.
EJS Example:
Let's consider a simple example of using EJS in a Node.js application to render a dynamic HTML page.
htmlCopy code
<!-- views/index.ejs -->
<!DOCTYPE html>
<html>
<head>
<title>Dynamic Page</title>
</head>
<body>
<h1>Hello, <%= username %>!</h1>
<p>Today is <%= date %>.</p>
</body>
</html>

javascriptCopy code
// server.js
const express = require('express');
const app = express();
const port = 3000;

// Set the view engine to EJS
app.set('view engine', 'ejs');

// Sample data for rendering the dynamic page
const data = {
username: 'John',
date: new Date().toLocaleDateString(),
};

// Route to render the dynamic page
app.get('/', (req, res) => {
res.render('index', data);
});

app.listen(port, () => {
console.log(`Server is running on http://localhost:${port}`);
});

In this example, we have an EJS template (views/index.ejs) with two variables <%= username %> and <%= date %>. These variables are replaced with actual data when the page is rendered using res.render('index', data) in the Node.js server.
Conclusion:
EJS is a powerful and versatile template engine that facilitates the dynamic rendering of HTML pages in Node.js applications. By embedding JavaScript code within templates, developers can create dynamic content and separate presentation logic from business logic. EJS is widely used for rendering views in Node.js applications due to its simplicity, JavaScript support, and performance benefits.
Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.