Serving from multiple directories in Express - Mini Project: Build & Apply

Serving Static Files from Multiple Directories in Express

📖 Scenario: You are building a simple web server using Express.js. You want to serve static files like images, CSS, and JavaScript from two different folders: public and assets. This way, your website can load files from both places seamlessly.

🎯 Goal: Build an Express server that serves static files from two directories: public and assets. When a user visits your site, files from both folders should be accessible.

📋 What You'll Learn

Create an Express app instance

Serve static files from the public directory

Serve static files from the assets directory

Listen on port 3000

💡 Why This Matters

🌍 Real World

Web servers often need to serve static files like images, stylesheets, and scripts from multiple folders. This project shows how to do that with Express.

💼 Career

Knowing how to serve static assets from multiple directories is a common task for backend developers working with Node.js and Express.

1

Create the Express app

Write code to import express and create an Express app instance called app.

Express

# Import express and create app
# Your code here

Need a hint?

Use import express from 'express' and then const app = express().

2

Serve static files from the public directory

Add code to serve static files from the public directory using app.use(express.static('public')).

Express

import express from 'express';
const app = express();

# Serve static files from 'public' directory
# Your code here

Need a hint?

Use app.use(express.static('public')) to serve files from the public folder.

3

Serve static files from the assets directory

Add code to serve static files from the assets directory using app.use(express.static('assets')).

Express

import express from 'express';
const app = express();

app.use(express.static('public'));

# Serve static files from 'assets' directory
# Your code here

Need a hint?

Use app.use(express.static('assets')) to serve files from the assets folder.

4

Start the server on port 3000

Add code to make the app listen on port 3000 using app.listen(3000).

Express

import express from 'express';
const app = express();

app.use(express.static('public'));
app.use(express.static('assets'));

# Start server on port 3000
# Your code here

Need a hint?

Use app.listen(3000) to start the server on port 3000.