How to Setup Nodejs project with typescript, express for making Restful APIs

Nodejs

Nodejs is a server side langauge.We use it with many frameworks for creating backend APIs and many more functionality.

Express

Express is basically a server side framwork.It makes easier work for developer to create server and APIs quickly by using express framework.

Typescript

Typescript is superset of JavaScript. We can used it with both frontend and backend. It is object oriented programming language. It is developed by Microsoft.

Folder structure

Step1:Create Project directory

lets Create new folder anywhere in your computer and give name by own choice to that folder. I am giving name to my directory is Nodejs-typescript.

Step2:Open folder into visual studio code

Open your terminal window in visual studio code by using dropdown or by using command.

By using command:

CTRL + `

But you must check you are in project folder directory. After this:

first install Packet.json file.

what is package.json file.

In my words it is heard of NodeJS project. If you need any dependency first we install it on package.json file. lets install package.json file

By using this command:

npm init --y

Step3:lets install development dependency of typescript

By Installing development dependency of typescript in our main package.json file.

By using command:

npm i -D typescript

Step4:Add folder with name compiler and index.ts

Create new folder with name compiler in your Root directory folder. After this create file with name index.ts in your Root directory folder not in compiler folder.

Step5:Adding tsconfig file in our project

Tsconfig is used for running typescript code in our project.

Go to terminal and run command:

npx tsc --init

After executing this command you see message in your terminal: message TS6071: Successfully created a tsconfig.json file.

Congratulation you have done 80% work

Step6:Now make your tsconfig file in ready state

Open your Tsconfig.json file and change it as per requirements. In Tsconfig file uncomments these two line 17 and 18 and in 17 line you write folder name of compiler

In file see these two lines:

// “outDir”: “./”, /* Redirect output structure to the directory. */
// “rootDir”: “./”, /* Specify the root directory of input files. Use to control the output directory structure with — outDir. */

Change into

“outDir”: “./compiler”, /* Redirect output structure to the directory. */
“rootDir”: “./”, /* Specify the root directory of input files. Use to control the output directory structure with — outDir. */

Step7:lets go to our index.ts file

lets go to your index.ts file and write simple code

const myname = “Alex hales”;

Step8:Lets Start compiler

Open your terminal and write command

npx tsc — watch

After Successfully running command go to your compiler folder and check one file created with index.js name.This file is created by tsconfig.json file because in this file we initialize root of folder. This file update every time when our project compiled by using flag of — watch.

Step9:lets install express nodemon and type declaration file for server

lets install express and type declaration. We use type declaration for providing types to NodeJS package with .d.ts file extension.

By using command:

npm install express
npm install -D @types/express

Step10:creating our first express app with typescript

lets add these simple code into our project. Open file index.ts and add some code into for making APIs end point and listening our app.

past that code into index.ts file

import express from ‘express’ //importing express
const app = express(); //making instance of app using express
const port = process.env.PORT || 3000; //inilizing port number
//making api end point
app.get(“/”, (req, res) => {
res.end(‘Congratulation your first Nodejs project working with typescript’)
})
//listening our app
app.listen(port, () => {
console.log(`App listen on PORT:${port}`)
})

Step10:lets install nodemon

By using this we can not run multiple time command after changing code in our program.

command:

npm i — save nodemon

step11:lets change our package.json file

In package.json file go to scripts section:

“scripts”: {
“test”: “echo \”Error: no test specified\” && exit 1"
}

Change into

“scripts”: {
“test”: “echo \”Error: no test specified\” && exit 1"
“start”:”node compiler/index.js”
“dev”:”tsc -w & nodemon compiler/index.js”
}

then go to terminal and run command

npm run dev

tap on hand for like and follow for more lovely contents

source code:

https://github.com/atiqurrehman123/nodejswithtypescript