Full-Stack Web Development

Lesson 1 of 16

Servers, routes & APIs

You've built front-ends — what runs in the browser. Full-stack means also building the back-end — the server side that stores data, handles logic, and powers the front-end. This course teaches how the back-end works: servers, APIs, databases, security, and deployment. Let's start with the foundation: servers, routes, and APIs.

What a server does

A server is a program (running on a computer somewhere) that listens for requests and responds to them. When your browser (the client) asks for a page or data, a server receives that request, does whatever's needed — read a database, check a login, run logic — and sends back a response. The back-end is all the code that runs on the server, out of the user's reach: safely handling data, business rules, and secrets (like database passwords) that must never live in the browser.

The front-end (browser) and back-end (server) talk over the internet via HTTP requests and responses. Your job as a full-stack developer is to build both sides — and the connection between them.

Routes: mapping URLs to code

A server handles different requests based on their URL and method. A route maps a specific request to the code that handles it:

// A simple server with routes (Node.js + Express style):
const express = require("express");
const app = express();

// Route: when a GET request hits "/hello", run this handler:
app.get("/hello", function (req, res) {
  res.send("Hello from the server!");
});

// Route: GET "/users" returns a list of users:
app.get("/users", function (req, res) {
  res.send("Here are the users...");
});

app.listen(3000);   // start the server, listening on port 3000

Each app.get("/path", handler) is a route — "when a GET request comes to this URL, run this function." The handler receives the request (req) and sends a response (res). A server is essentially a collection of routes, each handling a particular request. (This uses Express, a popular Node.js framework — the concept applies to any back-end.)

APIs: your server's interface

An API (Application Programming Interface) is the set of routes your server exposes for others (usually your own front-end) to request data or actions. Instead of returning whole HTML pages, a modern back-end API typically returns data (as JSON), which the front-end uses to build the UI:

// An API route returning DATA (not a web page):
app.get("/api/products", function (req, res) {
  const products = [
    { id: 1, name: "Coffee", price: 250 },
    { id: 2, name: "Tea", price: 200 }
  ];
  res.json(products);   // send the data as JSON
});

This route is an API endpoint — your front-end fetches /api/products and gets back JSON data (recall fetching from APIs on the front-end — now you're building the API being fetched). This split — a back-end API serving data, a front-end consuming it — is the standard modern architecture, and what this course builds toward.

The request/response cycle (recap, now from the server side)

You've seen this from the browser; here's the server's view:

  1. The client (browser) sends an HTTP request to a URL (e.g. GET /api/products).
  2. The server matches it to a route and runs the handler.
  3. The handler does its work (query a database, etc.) and sends a response (data or a page).
  4. The client receives the response and uses it.

As a back-end developer, you write step 2–3: the routes and handlers that receive requests and produce responses. That's the core of server-side work.

The mistake beginners make

Confusing what runs where — the back-end runs on the server (with access to databases, secrets, and full logic), the front-end in the browser (which users can inspect, so it can't hold secrets). Putting sensitive logic or credentials in the front-end is a serious mistake; they belong on the server. Also, thinking a "server" is mysterious hardware — it's just a program that listens and responds. Understand the client/server split, that a back-end is a set of routes, and that modern back-ends serve data (APIs) the front-end consumes.

Your turn

Sketch (in pseudocode or Express style) three API routes for a blog back-end:

// GET  /api/posts        -> return a list of posts
// GET  /api/posts/:id     -> return one post by id
// POST /api/posts         -> create a new post
// (Just outline the routes and what each returns.)

Your turn

  1. Understand the back-end: server-side code that listens for requests and sends responses (with access to data and secrets).
  2. Define routes — mappings from a URL + method to the handler code that runs (app.get('/path', handler)).
  3. Grasp APIs: the set of routes your server exposes, typically returning JSON data the front-end consumes.

Key points

  • Full-stack adds the BACK-END: server-side code that listens for requests and responds (safely handling data, logic, and secrets).
  • A route maps a URL + HTTP method to a handler function (app.get('/users', handler)); a server is a collection of routes.
  • An API is the set of routes your server exposes — modern back-ends return DATA (JSON) that the front-end fetches and uses.
  • The back-end runs on the server (with database/secret access); the front-end runs in the browser (never put secrets there).

Q&A · 0

Enrol to ask questions and join the discussion.

No questions yet — be the first to ask.