Render HTML file in ExpressJS

ExpressJS allows you to develop a custom web server according to your need. You don’t need to install multiple packages to handle HTML files. If you have Node.js installed, you are good to go.

In this short tutorial i am going to explain how to render HTML files in ExpressJS.

About sendFile() function.

ExpressJS provides sendFile() function which will basically send HTML files to browser which then automatically interpreted by browser. All we need to do is in every route deliver appropriate HTML file.

Final words:

Right now we are resolving path in each router. You can optimise this little bit. Express have configuration variable which let’s you define static file path so that you don’t need to resolve path in every routes. Here is how to do so.

Further reading

Conclusion:

There are scenarios where you need to develop web server which delivers HTML files like how your apache does. However, this is not the optimal use of Node.js but you can use such a feature to achieve custom web server for your own application.

Hi,
In my application, I have “index.html” in app folder, and other pages are in “app/views” folder. Now when I use app.get(), I am able to access only the pages in views folder.
How to load views as part of “index.html” so that it will be a Single Page Application.??

Is there a way that you can have all of the files registers/sent without having to declare this in your code? For example, setting up a node server you could say /index.html and this file will display on your new server.

Great tutorial! You can almost never find a client side template rendering example for express on the web, you always find jade server side templating examples. This helped a ton for setting up my nodejs server as an email service with sendgrid without getting a 502 bad gateway error. Thanks!

thanks so much for this, really helped me understand the node-express way of rendering pages based on requests made. My question is, can one use a master template html page and make it a default layout engine like handlebars?

Is it possible to redirect or stream a video along with html from the server itself. Imean I wish to stream the video into an or a tag from my local machine to index.html file using server.js file. I have learned how to stream video using nodejs but I am unknown about how to place it onto a html file within some container.

Maybe I’ve just not yet had enough coffee, but your code `res.sendFile(path.join(__dirname+’/sitemap.html’));` seems to be missing the point of `path.join` as JS will evaluate `__dirname+’/sitemap.html’` to a single value, and so the `join` function is only being passed one argument

Hi there!very well done with your article. Is it still relevant as it’s a few years old?I’m asking this because I’ve tried your method and it didn’t work, I made a path to my js files by defining a /public folder and I can clearly see them if I do localhost:9000/public/MY SCRIPT. js but the script is not loaded in my page.
My script only contains a console.log for testing but nothing happens. CSS works fine but js is totally ignored, is there any security settings that might be blocking it?

hello I did the same process and created a root folder auth, inside this there is one another folder that is password where html file is stored and same inside it again there are another folders for css, images, js and another files, I’m including using exports.render_reset_password_template = function(forgotpassModel, res) { //template path!!//
return res.sendFile(path.resolve(‘./auth/password/css/main.css’));
}; and rendering with html file like exports.render_reset_password_template = function(forgotpassModel, res) { //template path!!//
return res.sendFile(path.resolve(‘./auth/password/reset-password.html’));
}; but I’m confused with it what’s wrong with it??