How to Create a Simple REST API Using TypeScript And NodeJs

yslee
3 min readApr 4, 2022

--

Step 1: Initialize Node.js

Create Project folder and run

‘npm init’.

This will create a package.json file that will save any installed dependencies for your project.

Step 2: Install project dependencies

run

‘npm install typescript ts-node express @types/express morgan @types/morgan axios @types/axios nodemon’.

  • typescript: A TypeScript compiler with static set type definitions.
  • Ts-node: Allows us to run and configure TypeScript execution environments.
  • Express: Node.js web application framework for setting and managing web -based server.
  • @types/express: Type definitions for Express.
  • Morgan: A Node.js HTTP request logger middleware for Node.js
  • Axios: A Node.js promise-based HTTP client library for Node.js, for sending HTTP requests to query and consume resources from APIs.
  • @types/Axios: Type definitions for Axios.
  • Nodemon: A server utility library for monitoring changes of the code on a text aditor. It automatically restarts the server whenever code changes are detected.

Step 3: Initialize Typescript

run

‘tsc --init’

This will create a tsconfig.json file that will set all the environments required to run TypeScript.

Step 4: Setting up the tsconfig.json

Thie is a TypeScript compiler configuration file with options specifying arguments that simplify the TypeScript compilation and execution pipeline.

Make sure your file look like this.

{
"compilerOptions": {
"forceConsistentCasingInFileNames": true,
"module": "commonjs",
"esModuleInterop": true,
"outDir": "./build",
"rootDir": "./source",
"target": "es6",
"skipLibCheck": true,
"strict": true
}
}

Step 5: Modify package.json

Modify the main and scripts with thw follwing values.

"main": "source/server.ts",
"scripts": {
"dev": "nodemon source/server.ts",
"build": "rm -rf build/ && prettier --write source/ && tsc"
}

This will set up the command to build and compile the .ts file to the .js file. In this case, we can then start the development server using the command ‘npm run dev’

Step 6: Setting up the application structure

Your project files and subfolders should be set up as shown below.

Create the source folder inside your project directory. The source folder will include all the .ts files the application needs to run, as explained earlier.

Setting up the controller

Create the controllers folder. In it have the test.controller.ts file. This module will handle testFuncion.

controllers/test.controller.

  • testFunction — A request to fetch a single todos by id 1.

Adding the routes

Create the route folder, in it have the index.ts and test.ts file. index.ts file connects routes to other’s And test.ts file and other’s connect routes to their controllers.

routes/index.ts

routes/test.ts

Setting up the server

The server.ts file is responsible for setting up the server. This involves express middlewares, the routes, and also starting the server.

server.ts

Step 7: Starting the development server

run

‘npm run dev’

This will start the server as shown below:

Step 8: Testing the API with Browser

http://localhost:3000/test/testRoute

--

--