Your First Express Server

By the end of this lesson you will be able to:

1. Explain in one sentence what Express is and why we use it.
2. Install Express into a project with npm install express.
3. Write a six-line server and run it with node server.js.
4. Open http://localhost:3000 in the browser and see your own text on the page.

Last lesson you installed packages with npm and pulled code into a project without writing it yourself. Today one of those packages does the heavy lifting.

Read this tiny server. Do not run it yet — just predict:

app.get('/', (req, res) => {
  res.send('Selamat datang')
})

Predict together

• When you visit the home page, what word appears in the browser?
• Which part of the code is the message that gets sent back?

Picture a mamak stall. You sit down and order teh tarik. A waiter takes the order, walks to the kitchen, and comes back with your drink. A web server works the same way: the browser sends a request (the order), and the server sends back a response (the dish).

Writing all of that by hand in plain Node is fiddly. So we use Express — a framework that gives you tidy tools for building web servers. A framework is a ready-made kit: it handles the boring plumbing so you write only the interesting part.

The smallest possible Express server

Six lines is genuinely all it takes. Here is the whole thing:

const express = require('express')
const app = express()

app.get('/', (req, res) => {
  res.send('Hello from my server!')
})

app.listen(3000, () => console.log('Listening on port 3000'))

Reading it line by line:

• require('express') pulls in the package you installed.
• express() makes an app — your server.
• app.get('/', ...) says “when someone visits the home page, run this”. That home page path '/' is a route.
• res.send(...) sends text back to the browser.
• app.listen(3000, ...) starts the server on port 3000 and waits for visitors.

Port and localhost

A port is like a numbered door on your computer. Your server sits behind door 3000. The word localhost means “this very computer”. So the full address http://localhost:3000 reads as “knock on door 3000 of my own machine”.

Why it matters

This little server is the backend your React apps from Level 2 will eventually talk to. The frontend asks; the backend answers. Master this round trip now, and every API you build later is the same idea with more routes.

Follow along on your own machine. Make an empty folder, open it in VS Code, and open the built-in terminal with Terminal → New Terminal.

Step 1 — Install Express

In the terminal, type:

$ npm install express

npm downloads Express and confirms with a short message:

added 69 packages in 2s

You now have a node_modules folder and a package.json — the package list from last lesson.

Step 2 — Write server.js

Make a new file called server.js and type in the six-line server. This one greets Aisyah:

const express = require('express')
const app = express()

app.get('/', (req, res) => {
  res.send('Selamat datang, Aisyah!')
})

app.listen(3000, () => console.log('Listening on port 3000'))

Step 3 — Run it

Back in the terminal, start the server by name:

$ node server.js

The terminal prints your message and then waits:

Listening on port 3000

Notice the prompt does not come back. That is on purpose — the server is running and listening for visitors. It stays awake until you stop it.

Step 4 — Open it in the browser

Open your browser and go to http://localhost:3000. You will see your text on the page:

Selamat datang, Aisyah!

That is your own server answering your own browser. No website online, no magic — just Node, Express, and door 3000.

Step 5 — Add a second route

A server can answer more than one page. Stop the server first with Ctrl + C in the terminal — that ends it and gives the prompt back. Then add an /about route above the app.listen line:

app.get('/about', (req, res) => {
  res.send('This server was built by Aisyah.')
})

Run node server.js again, then visit http://localhost:3000/about. The new sentence appears.

What changed? One server now answers two addresses. Each app.get is a different route, and each route sends back its own response. Remember: Ctrl + C stops the server whenever you need the terminal back.

Keep working in the same server.js. After every change: stop the server with Ctrl + C, run node server.js again, then refresh the browser.

1. Task 1 — Change the message

   Change the text inside the home route's res.send(...) to your own greeting. Restart the server and refresh http://localhost:3000 to see your words on the page.

2. Task 2 — Add a /menu route

   Add a new route at /menu that sends back one line about a dish, for example:

   app.get('/menu', (req, res) => {
     res.send('Nasi lemak — RM 5.50')
   })

   Visit http://localhost:3000/menu and check the line shows.

3. Task 3 — Send some HTML

   res.send can send HTML too, not only plain text. Add a route that sends a heading and a paragraph as one HTML string. Notice how the browser renders real bold, big text — not raw tags.

   app.get('/hello', (req, res) => {
     res.send('<h1>Hello!</h1><p>My first HTML from a server.</p>')
   })

Build a single server with three routes: /, /about and /contact. Each one sends back different text. Use today's Express routing plus the variables you know from earlier lessons.

It works if: you can open all three addresses — localhost:3000/, localhost:3000/about and localhost:3000/contact — in the browser and each shows its own message.

// server.js — three routes for Wei Jie's café
const express = require('express')
const app = express()

app.get('/', (req, res) => {
  res.send('Welcome to Wei Jie Kopitiam!')
})

app.get('/about', (req, res) => {
  res.send('We have served kopi-O in Ipoh since 2015.')
})

app.get('/contact', (req, res) => {
  res.send('Find us on Jalan Bandar, Ipoh. Open daily.')
})

app.listen(3000, () => console.log('Listening on port 3000'))

• Express is a framework for building web servers in Node with tidy, short code.
• Install it once per project with npm install express.
• app.get(path, handler) answers a route; res.send(...) sends the response.
• app.listen(3000, ...) starts the server on port 3000.
• Open http://localhost:3000 in the browser; stop the server with Ctrl + C.

New words

• Framework — a ready-made kit of tools; Express is a web-server framework.
• Server — a program that receives requests and sends back responses.
• Route — one path the server answers, such as / or /about.
• Port — a numbered door on your computer; our server uses 3000.
• localhost — a name that means “this very computer”.