Express: Create static web server

README.md

Express: Serving static files

Prerequisites

1. Express "Hello World!" app created.

Example directory structure

project-root
    └─ node_modules
    └─ public
       └─ css
          └─ main.css
       └─ images
          └─ example.webp
       └─ js
          └─ client.js
       └─ index.html
    ├─ package-lock.json
    ├─ package.json
    └─ server.js

Instructions

1. Create a Hello World! express app or use an existing express project.

2. Add express.static middleware before any other middleware that sends a response (i.e. app.get()). This checks if a request URL matches a static file located anywhere in the public directory.

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

   • Don't forget to put your website files in ./public. If one of your files is found, it's returned as a response back to the client. Magic!
   • Placing this middleware above other server responses (and database connections) saves server resources by sending a response before middleware functions are needlessly called.

Related Gists

• Express: Catch 404 Not Found errors