Hello World With TypeScript 2.0

Hello World With TypeScript 2.0

Objective

• What is TypeScript
• Nodejs installation
• Install TypeScript
• Create the first project
• Run the project

What is TypeScript

TypeScript is a language superset of JavaScript language. It compiles the code as written in the plain JavaScript code. So all the correct JS code is valid in TypeScript. Apart from that, TypeScript provides extra features also which are very useful for writing a good code.

TypeScript has a compiler/transpiler in place which converts code into javascript. It is open-source and maintained by Microsoft. It’s continuously evolving and providing better features to developers enforcing them in writing better code.

Nodejs installation

1. Go to https://nodejs.org/en/ this is the official site for node.js.
2. Click on downloads.
   

npm -v

• If you are not using npm, then directly you can go to https://www.typescriptlang.org/ and download it from there and use it. It is compatible with Visual Studio 2017, Visual Studio 2015. You can use major text editors for the TypeScript editing also.
  
  

npm install -g typescript

Let’s check the version of the typescript installed first.

1. Run nodejs command prompt as Administrator.
   
   
2. Go to the respective folder in the system where you will be creating the project
   cd <folder path> enter
3. Run the following code to generate a new project config. in the folder
   tsc -init
   It will create the config file for the project in the respective folder. The name of the file will be tsconfig.json. We will discuss the config file in future articles.
4. Let’s see the code editors we can use for TypeScript application. There are many good open-source code editor for typescript or any js files.

Following are some of the best one which I prefer to use.

• Sublime text 3
• Visual studio code
• Atom Editor
• Webstorm

• Let’s open the folder in Visual Studio code for creating the first project. Get Visual Studio code from here.
  File menu - Open folder
  Select the folder where you have created the config file.

• Create a new file in the same folder with name,
  HelloWorld.ts
  ts is the extension used for the typescript files. Once the file will be compiled it will create a js file with the same name automatically.

• In the file write the following code,
  1. var message = "Hello World";
  2. function printIt() {
  3. console.log(message);
  4. }
  5. printIt();

• Let’s build the application.
  Press ctrl+shift+B to build the application

• This build will create a js file for the respective ts
  
  
• You can open a terminal in visual studio code by clicking ctrl+~
  
  
• You call the following command to run the file
  node HelloWorld

• You will get “Hello World” printed in the console.
  

Conclusion