Environment Setup for Development in TypeScript
What is TypeScript
For development in TypeScript, one needs to know the following:
A Text Editor
The text editor helps you to write your source code. Examples of a few editors include Windows Notepad, Notepad++, sublime & atom, etc. Editors used may vary with Operating Systems.
The source files are typically named with the extension .ts.
The TypeScript Compiler
Figure-2, (Image source: https://www.tutorialspoint.com)
For installing TypeScript, we need to install NodeJs and npm.
Installation on Windows
Download the LTS version of node from https://nodejs.org/en/download/ and install it.
Figure-3 (Node.js installation window)
This package would also include the latest LTS version of npm (In my case node: v8.9.0 and npm: v5.5.1). you can verify the installation of node and npm with executing following commands in command prompt.
Figure-4 (Command Prompt showing versions of node and npm)
Installation on Ubuntu (16.04 LTS)
Installation of node in Ubuntu is much simple, you just need to open the terminal and execute following commands:
First you need to update apt packages list using following command.
Figure-5 (Terminal command to update packages list)
After updating apt packages list execute following commands.
Figure-6 (Installation of curl, no need if you already installed)
Figure-7 (Put the path of node version 8 so that it can be downloaded from this path)
Figure-8 (This will install the latest LTS version of node and npm)
Now to check version of installed node and npm execute following commands:
Figure-9 (Node and npm versions installed)
To install TypeScript, we just need to execute the following command in either command prompt (for windows) or terminal (for Ubuntu/Linux)
Figure-10 (It will install the latest version of typescript)
This will include ‘tsc’ environment variable for transpilation of TypeScript, for verification of installation of TypeScript execute the following command:
Figure-11 (Showing the installed version of typescript)
The most common and powerful IDE for development of TypeScript is Visual Studio Code. For installation of Visual Studio Code visit this website and download the respective installation package i.e. for windows or Ubuntu/Linux. https://code.visualstudio.com/
After it in windows open the installer follow the on screen instructions,
Figure-12 (Visual Studio Code installation window)
And in Ubuntu run the following command in terminal
Figure-13 (Terminal command to install a Debian package)
Hello World Program
Open Visual Studio and write your first program:
Figure-14 (Snippet of Visual Studio Code)
Let us see how to compile and execute a TypeScript program using Visual Studio Code. Follow the steps given below.
Step 1 − Save the file with .ts extension. We saved the file as Test.ts. The code editor marks errors in the code, if any, while you save it.
Step 2 − Right-click the TypeScript file under the Working Files option in VS Code’s Explore Pane. Select Open in Command Prompt/terminal option.
Figure-15 (Right click Hello.ts File and select Open in Terminal)
Figure-16 (In terminal write tsc Hello.ts to transpile and node index.js to execute it)