How do you href a .ejs file in HTML

Question

I'm trying to build a login system with Nodejs and express. I have a login page with the login forms using ejs.

In my index.html file there's a button that's supposed to direct the user to that login page:

 <button id="loginBtn"> <a href="views/login.ejs"><LI> LOGIN </LI></a> </button>

but it prints the ejs code of the login page instead of displaying the actual page. Anyone know what I'm doing worng?

Answer 1

To render a view, you only specify an endpoint in expressjs and call only that end point

You should not try to call the .ejs file location

Example: in this code login.ejs will automatically render behind the scene, the server library will do it, res.render('login') will automatically call login.ejs

 router.get('/home', function(req, res, next) {
    res.render('login');
 });

You hyperlink should be calling the router mapping endpoint alone

 <a href="/home"><li> LOGIN </li></a>

once you decided using EJS, for UI designing purpose, if the UI designing part alone is given to you, then you can do a dummy code to render one EJS with fixed data, you don't have to run the entire website with DB

For example: there a data which is assumed which will render a EJS, to render with dummy data you can do this

Get the data from the developer who is doing his part and do this code

 router.get('/home', function(req, res, next) {
    var data = {"name": "Emmanuel"}
    res.render('login', data);
 });

as you can see the data is directly coded temporary