Lecture 16 - RESTful API (Part 1)

Get an API Testing tool

Please download Insomnia app an install in your PC. This a tool for testing your API.

Go to Insomnia website

Content

How to create Express + Typescript project
Express app structure
- Route handlers
- express.json() middleware
How to create /students endpoint
- CRUD operation (GET, POST, PUT, DELETE methods)
- Extract request's query parameters using `request.query.{param_name}
- Extract request's body (JSON payload) using request.body

Create an Express + TypeScript project

Create a project directory and go inside.

mkdir lecture16
cd lecture16

Initialize project using pnpm. This creates package.json and pnpm-lock.yaml files inside your project directory.

pnpm init

Install Express as runtime dependency.

pnpm add express

Install necessary development dependencies

pnpm add -D typescript @types/node @types/express tsx nodemon

Open the project with your code editor

code .

Create tsconfig.ts to specify Typescript compiler (tsc)

npx tsc --init

Open and edit the tsconfig.ts file (update: 21/9/2025)

{
  "compilerOptions": {
    /* Base Options: */
    "esModuleInterop": true,
    "skipLibCheck": true,
    "target": "es2022",
    "allowJs": true,
    "resolveJsonModule": true,
    "moduleDetection": "force",
    "isolatedModules": true,
    "verbatimModuleSyntax": true,

    /* Strictness */
    "strict": true,
    "noUncheckedIndexedAccess": true,
    "noImplicitOverride": true,

    /* If transpiling with TypeScript: */
    "module": "NodeNext",
    "outDir": "dist",
    "rootDir": "src",
    "sourceMap": true,

    /* If your code doesn't run in the DOM: */
    "lib": ["es2022"]
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

Open the package.json file and modify the "type" and "scripts" sections

{
  ...
  "type": "module",
  "scripts": {
  "dev": "npx nodemon --exec tsx src/index.ts",
  "build": "npx tsc",
  "serve": "node dist/index.js",
  },
  ...
}

Create .gitignore file as followed

Simple Express App (update)

import express, { type Request, type Response } from 'express';

const app = express();
const port = 3000;

// An Express middleware that parses request's payload
// make the data available in 'req.body' object
app.use(express.json()); 

app.get('/', (req: Request, res: Response) => {
 res.send('Hello from Express with TypeScript!');
});

app.listen(port, () => {
 console.log(`🚀 Server running on http://localhost:${port}`);
});

Running scripts

Run app in development mode (from src directory)

pnpm run dev

Build app from src and output to dist directory

pnpm run build

Run app in production mode (from dist directory)

pnpm run serve

Vercel Deployment

When deploy an Express project on Vercel, make sure that you configure Framework Settings corresponding to your project setup.

Modify the index.ts by add the following line of code at the bottom of the file

...

export default app

Framework Settings

Framework Preset : Express
Build Command : npx tsc
Output Directory : dist
Install Command : pnpm install

This should be enough for our Express project setup

Codes templates

Interfaces (for data object)

src/libs/types.ts

Database (variables)

src/db/db.ts

Zod validators (for HTTP request validation)

Install zod as a dependency

pnpm add zod

potikanond/README.md