Quest

Views and SSR with EJS

Join us on Discord
STATUS Past
TOTAL REWARDS
$800
REWARD AMOUNT
$1
STARTS (GMT +08:00)
ENDS (GMT +08:00)

Learning Outcomes

Upon completing your learning, you will be able to

  • Differentiate between Server Side Rendering (SSR) and Client Side Rendering (CSR) and grasp the benefits and drawbacks of each approach.
  • Explore the concept of Embedded JavaScript (EJS) as a powerful templating language for generating dynamic HTML content.
  • Learn how to set up a Server Side Rendering (SSR) back-end application that renders content on the server before sending it to the client.
  • Dive into EJS templating syntax and understand how to integrate dynamic data into HTML templates using EJS tags.
  • Discover the process of creating front-end views using EJS, combining HTML and CSS to craft visually appealing user interfaces.
  • Explore the role of EJS Middleware in handling and rendering ".ejs" templates, enabling seamless integration with your Express.js application.

Quest Details

Introduction

Note: This quest has been tested on Gitpod.io, a cloud development environment with a standardized set up. This means that your experience going through this quest will be the same as the quest master's – seamless!

In the realm of web development, many avenues exist for crafting your Front End. You have the freedom to choose from a variety of front-end frameworks such as NextJS, ReactJS, and more. These frameworks harness the power of Client Side Rendering (CSR) to construct engaging web interfaces for users.

In this journey, we will embark on a quest to master the creation of a Server Side Rendering (SSR) back-end application. Through SSR, we will serve the user-requested content directly from our server, eliminating the need for frameworks like NextJS or ReactJS.

Our tool of choice will be EJS, or Embedded JavaScript, a versatile templating language that empowers us to generate templates for the Front End. Leveraging HTML and CSS, EJS breathes life into the structure and aesthetics of our applications. EJS comes with a distinct file extension, ".ejs," which will seamlessly be handled by the EJS Middleware.

Without further delay, let's dive into the process of crafting our back-end application to seamlessly render EJS content for our users!

Deliverables

This quest has 1 deliverable.

  1. Screenshot

This quest is part of a campaign so do check out other quests!

More Quests
Help Center Need help?

Find articles to support you through your journey or chat with our support team.

Help Center