Express JS Static Content

Learn how to load in CSS and JS files for the front-end of your Express app.

When you’re creating your own ExpressJS app you’re probably going to want to add your own images/CSS/JS to create a design / theme.

All you really need to do is reference the files that are stored on the public folder of your Express root folder from your views / templates.

 
 

Notice you don’t need to include public in the path you reference.

https://www.youtube.com/watch?v=hHcoBZkVLY0

Learn more about using static content in ExpressJS on this YouTube video.

The key to making the public folder the source of your static content is to use the express.static function and provide it a specific directory.

app.use(express.static(path.join(__dirname, 'public')));

You can of course have as many static content folders, all you need to do is duplicate the above line and specify a different folder.