Optimal approach to displaying views with Express.js and EJS

Question

Optimal approach to displaying views with Express.js and EJS

Recently, I came across a website that only renders EJS templates using Express.js routing. All the routes are defined in the /routes/index.js file. As the file grows with more routes being added, I am thinking about restructuring it to make it more developer-friendly. Despite having multiple categories, the URLs are only one level deep.

Check out this navigation bar which displays categories and pages.

For instance, when you click on "Gamble Diagram," it redirects you to the route /acidbase-belance. A more logical approach would be /acidbase/belance to avoid code repetition.

Current setup:

 <!-- Current route implementations -->

Considering the code repetition and the need for a better structure, I have a few ideas in mind:

Split each category into a separate file (routes\categorieName.js).
Create an array of possible routes in routes\index.js and implement a lookup mechanism.

 <!-- Example lookup mechanism -->

Alternatively, a combination of both ideas by splitting categories into separate files and implementing a mechanism for pages.

javascript express ejs

Answer 1

Answer №1

Ah, now I see the approach you are suggesting.

Here's how you could implement it:

const router = require('./routes/productRouter.js');
app.get('/product', router));

The product router file could look something like this:

const express = require('express');
const router = express.router();

router.get('/acidbaseblabla', (req, res) => {
    res.render('yourview.ejs')
});

export default router;

You can repeat this pattern for different routes, organizing them in separate files.

Remember to use request parameters like /:product only for dynamic content, not static views.

I trust this explanation clarifies the process for you! :)

Answer 2

Ah, now I see the approach you are suggesting.

Here's how you could implement it:

const router = require('./routes/productRouter.js');
app.get('/product', router));

The product router file could look something like this:

const express = require('express');
const router = express.router();

router.get('/acidbaseblabla', (req, res) => {
    res.render('yourview.ejs')
});

export default router;

You can repeat this pattern for different routes, organizing them in separate files.

Remember to use request parameters like /:product only for dynamic content, not static views.

I trust this explanation clarifies the process for you! :)

Optimal approach to displaying views with Express.js and EJS

Answer №1

Similar questions

Navigating through props outside a class component in React

Using jQuery, prevent the user from entering text into an input box when a checkbox

Exploring Angular's capabilities with filtering and handling $http promises

Troubleshooting VueJs and vue-i18n issues

Error encountered: Element cannot be clicked on at specified coordinates - Angular/Protractor

Preventing jQuery plugin from loading in Ajax response

Refresh the html of the contenteditable element with the most recent targeted information from the textarea

What could be causing the read-only error in my presentation?

Unable to fetch source for HTML img tag

Streaming the request body in NodeJS using ExpressJS without buffering

Building a hierarchical tree structure using arrays and objects with Lodash Js

Navigating through an ajax-based webpage entirely with selenium webdriver

The expected React component's generic type was 0 arguments, however, it received 1 argument

Discover the Power of Node.js with the @aws-sdk/client-s3 Package, Leveraging AWS CLI Credentials Stored in

Is there a way to operate both websocket and http methods concurrently on a server in Typescript?

Can the Flash Configurator be converted to PHP or Javascript?

What methods are available to fill a canvas with shapes other than circles?

When deploying my NodeJs with ExpressJs API to the server, I encounter a 404 error

Utilizing AngularJS to Extract JSON Data from Gzipped Files Stored Locally via Ajax

Is it possible to verify if a bearer token has expired within an Angular application?