{"id":31266,"date":"2023-03-03T07:00:00","date_gmt":"2023-03-03T15:00:00","guid":{"rendered":"https:\/\/coderpad.io\/?p=31266"},"modified":"2023-06-05T13:38:32","modified_gmt":"2023-06-05T20:38:32","slug":"how-to-get-started-with-typescript-in-node-js","status":"publish","type":"post","link":"https:\/\/coderpad.io\/blog\/development\/how-to-get-started-with-typescript-in-node-js\/","title":{"rendered":"How To Get Started With TypeScript in Node.js"},"content":{"rendered":"\n

TypeScript was the third most popular<\/a> programming language in 2022, following Rust and Python. It\u2019s widely admired by the JavaScript community and used by many companies to build front-end<\/a> and back-end applications. Typescript’s versatility enables use with any framework or technology powered by JavaScript. This includes JavaScript back-end frameworks like Node.js, which developers use to build RESTful web services and back-end systems. <\/p>\n\n\n\n

In this post, we’ll dive deeper into TypeScript and why it can be useful for you. Then you\u2019ll learn how  to use TypeScript in a Node.js application. <\/p>\n\n\n\n

What is TypeScript?<\/strong><\/h2>\n\n\n\n

Typescript<\/a> is an open-source programming language developed by Microsoft. It\u2019s an extended version of JavaScript that offers support for using variable types. <\/p>\n\n\n\n

JavaScript itself is a weakly typed language. That means it assigns variable types at runtime instead of compile time. In Typescript, you can leverage the type system to create and declare type interfaces for your variables. <\/p>\n\n\n\n

This kind of interface defines what type, either primitive or custom, your variable poses. Therefore we can say that TypeScript is a typed superset of JavaScript. When you compile your TypeScript code, the compiler translates it back to JavaScript. Therefore, you can also think of TypeScript as an abstraction layer for JavaScript applications, with an extended type system. <\/p>\n\n\n\n

TypeScript: pros and cons<\/strong><\/h2>\n\n\n\n

As a weakly typed language, JavaScript<\/a> isn’t an ideal choice for writing applications that can grow in size and complexity. This is because variable types aren’t known beforehand, and there\u2019s no development-time check to validate them. A string variable may be assigned a boolean at some point later that causes a bug in the program. TypeScript<\/a> prevents this by identifying those kinds of errors beforehand, due to its strictly typed nature. <\/p>\n\n\n\n

TypeScript has been around for quite some time and is loved by the community. Adding support for variable types in your program not only makes it less prone to errors but also makes your code self-documenting. If any other developer looks at your TypeScript function and the variables it takes and returns, they can easily understand what’s happening in that code. <\/p>\n\n\n\n

In addition, TypeScript has enhanced IDE support that automatically recommends types for your variables, function parameters, return values, and so on. Moreover, as a superset of JavaScript, you can always go back to writing a TypeScript function in pure JavaScript, if needed. <\/p>\n\n\n\n

Therefore, TypeScript makes your application more robust, reduces errors, and makes your code self-documenting. However, as a strongly typed version of JavaScript, it has a steeper learning curve. Hence some developers find it difficult to work with, especially beginners.   <\/p>\n\n\n\n

Getting started with TypeScript in Node.js<\/strong><\/h2>\n\n\n\n

Now that you have an idea about what TypeScript is, let’s see how we can set up and start using it in a Node.js application. <\/p>\n\n\n\n

Setup<\/strong><\/h3>\n\n\n\n

First, we’ll create a new directory for our Node.js project: <\/p>\n\n\n

$ mkdir nodejs-typescript<\/code><\/span><\/pre>\n\n\n
Then, we’ll navigate inside this directory and create a new Node.js project: <\/p>\n\n\n
$ cd nodejs-typescript && npm init -y<\/code><\/span><\/pre>\n\n\n
The above command should return an auto-generated package.json<\/code> file as shown below: <\/p>\n\n\n
\n
\"\"\/
A boilerplate packgae.json<\/code> file generated from the npm init -y<\/code> command.<\/figcaption><\/figure>\n<\/div>\n\n\n
Great! Now, let’s install TypeScript by running the following command in the root directory of the project: <\/p>\n\n\n
$ npm i typescript -save-dev<\/code><\/span><\/pre>\n\n\n
I also like to install the @types\/node<\/code> module. This contains the type declarations for some common Node.js modules, like the file system and OS. <\/p>\n\n\n
$ npm i -D @types\/node<\/code><\/span><\/pre>\n\n\n
You’re all set! You should now have a node_modules<\/code> folder in the project, along with a package.json<\/code> file. <\/p>\n\n\n\n
Adding a TypeScript config file<\/strong><\/h3>\n\n\n\n
Next, create a file called tsconfig.json<\/code> in the root directory with the following contents: <\/p>\n\n\n
{\n\n\u00a0\u00a0\u00a0\u00a0\"compilerOptions\"<\/span>: {\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"module\"<\/span>: \"NodeNext\"<\/span>,\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"moduleResolution\"<\/span>: \"NodeNext\"<\/span>,\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"target\"<\/span>: \"ES2020\"<\/span>,\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"sourceMap\"<\/span>: true<\/span>,\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"outDir\"<\/span>: \"dist\"<\/span>,\n\n\u00a0\u00a0\u00a0\u00a0},\n\n\u00a0\u00a0\u00a0\u00a0\"include\"<\/span>: [\"*\"<\/span>],\n\n\u00a0\u00a0}<\/code><\/span>Code language:<\/span> JSON \/ JSON with Comments<\/span> (<\/span>json<\/span>)<\/span><\/small><\/pre>\n\n\n
This file configures the behavior of the Typescript compiler. Let’s quickly go over what each compiler option means. <\/p>\n\n\n\n