Changing the look of an Express application
While the default Express theme is fairly nice, we'll always want to tweak how the application looks to suit our own preferences. That way it's our application.
Express provided us with this line of code in the <head>
section of the HTML:
<link rel='stylesheet' href='/stylesheets/style.css' />
This CSS file is stored in the public/stylesheets
directory. The public
directory has three child directories;
images
,
javascripts
, and stylesheets
. These directories represent the most common static assets you could use in an application.
Additionally, the whole public
directory is served by the Express framework as if it were a regular web server. In app.js
this is configured as follows:
app.use(express.static(path.join(__dirname, 'public')));
Because any file you drop into the public
directory is served to web browsers, you must ensure that you do not configure an application route that conflicts with one of the static assets. It also means...