Routing & HTTP Methods

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

1. Explain the difference between a GET and a POST request in one sentence each.
2. Add several routes to one Express server, each with its own path.
3. Read a value from the URL with a route parameter and req.params.
4. Open a route like /greet/Aisyah in your browser and see your own name in the reply.

Last lesson you built your first Express server with app.get. Today we add more routes and a second verb.

Requests come in different flavours, called methods. Two everyday ones: one says “show me”, the other says “here, save this”. Match each action to its method:

1. Open your friend's profile page      GET or POST?
2. Post a new photo to an app           GET or POST?
3. Read today's teh tarik price         GET or POST?

Think of ordering at a mamak stall. You can ask for the menu (“show me”), or you can hand over your order (“here, save this”). Same waiter, two different actions. On the web those actions are HTTP methods.

Many routes, one server

A route is a method plus a path. One server can hold as many as you like — each responds to its own address:

app.get('/', (req, res) => res.send('Home'))
app.get('/menu', (req, res) => res.send('Our menu'))
app.get('/about', (req, res) => res.send('About us'))

Route parameters — a blank in the path

What if you want one route to greet anyone? Put a blank in the path with a colon. That blank is a route parameter, and its value arrives in req.params:

app.get('/greet/:name', (req, res) => {
  res.send('Hello ' + req.params.name)
})

The :name matches whatever the visitor types there. Open /greet/Aisyah and req.params.name is 'Aisyah'. Open /greet/Faiz and it is 'Faiz'. One route, endless names.

Why it matters

Every web API you have ever used is built from these pieces: verbs (GET, POST and friends) plus routes with parameters. A product page at /product/512 is a GET route with a parameter. Learn this pattern once and you can read almost any API.

Open server.js from last lesson. We will add routes, then visit them in the browser. Keep the server running with node server.js and restart it after each change.

Step 1 — Add a parameter route

Add this route above your app.listen line:

app.get('/greet/:name', (req, res) => {
  const name = req.params.name       // the blank from the URL
  res.send('Selamat datang, ' + name + '!')
})

Step 2 — Open it in the browser

Restart the server, then visit this address (a plain GET, so the browser can open it directly):

$ node server.js

Then open this address in your browser (a plain path, no https:// because it is your own machine):

http://localhost:3000/greet/Aisyah

The page shows:

Selamat datang, Aisyah!

Change Aisyah in the address bar to your own name and refresh. Same route, a new reply every time.

Step 3 — Add a POST route (a first look)

POST is the “here, save this” verb. Add a route for it so you can see the shape. It returns a pretend “created” message:

app.post('/students', (req, res) => {
  res.send('New student created!')
})

Try opening /students in the browser and you get an error, not the message. The address bar always sends a GET, and this route only answers POST. You cannot easily hit a POST route from the address bar. We will properly send data to a POST route after we meet middleware next lessons — a small tool called express.json() is needed first.

Step 4 — A two-parameter route

A path can hold more than one blank. Here is an adder. Note the parameter values arrive as text, so wrap them in Number() before adding:

app.get('/add/:a/:b', (req, res) => {
  const a = Number(req.params.a)     // text -> number
  const b = Number(req.params.b)
  res.send('Sum is ' + (a + b))
})

Restart, then open /add/3/4 in the browser:

Sum is 7

What changed? In Step 1 one blank fed a greeting. Now two blanks feed a calculation — and because req.params values are always strings, Number() is what stops 3 + 4 becoming '34'.

Add these routes to the same server.js. Restart the server after each change and test in the browser.

1. Task 1 — Square a number

   Add a route /square/:n that returns n multiplied by itself. Remember to Number() the parameter first. Open /square/5 and check the page shows 25.

2. Task 2 — A profile sentence

   Add /profile/:name/:town that replies with a full sentence, for example Priya is from Ipoh. Use both parameters. Test it with /profile/Priya/Ipoh, then try your own name and town.

3. Task 3 — Invent your own

   Design one more parameter route of your own. Ideas: a /double/:n that doubles a number, or a /hello/:name/:language that greets in Malay or English. Open it in the browser and confirm the reply changes with the URL.

Build a route /price/:item that looks a price up in a small object (from Level 2) and returns it. This mixes today's route parameters with objects you already know.

It works if: opening /price/roti in the browser shows RM 1.50, and /price/teh shows its own price.

// price list for a small kopitiam menu
const prices = {
  roti: 'RM 1.50',
  teh: 'RM 2.00',
  nasi: 'RM 5.50',
}

app.get('/price/:item', (req, res) => {
  const item = req.params.item          // e.g. 'roti'
  const price = prices[item]            // look it up in the object
  res.send(price || 'Item not found')
})

RM 1.50

• HTTP methods are verbs: GET reads, POST sends new data to save.
• One server holds many routes — each is a method plus a path.
• A route parameter is a blank in the path, written with a colon like :name.
• Read a parameter's value from req.params — and it is always text, so use Number() for maths.
• The browser address bar only sends GET; hitting a POST route needs a tool we meet next lessons.

New words

• HTTP method — the verb of a request (GET, POST, and more).
• GET — a request that reads data and changes nothing.
• POST — a request that sends new data to be saved.
• Route parameter — a named blank in a path (:id) that captures part of the URL.
• req.params — the object holding those captured values inside your route handler.