How to Learn Typescript with Visual Studio Code + Environment setup + for beginners?

Issue

Many beginners still facing the difficulties while doing Environment setup for Learn typescript. [before step-up to Angular]

Thanks.

Solution

So it's 8 simple steps to set an Environment to learn TypeScript with Visual Studio Code.

1. Installing the TypeScript compiler by:

     npm install -g typescript
   

2. Install Visual Studio Code
3. Create new folder or open existing folder (empty Ex.LearnTSFolder) in - Visual Studio Code

4. Create a file - tsconfig.json - inside your folder(ex. LearnTSFolder) and put this code inside - tsconfig.json - file

   {
       "compilerOptions": {
           "target": "es5",
           "module": "commonjs",
           "sourceMap": true
       }
   }
   

5. Now Create a simple TS file HelloWorld.ts, and put this code inside this ts file:

   class Startup {
       public static main(): number {
           console.log('Hello World, Wazz Up');
           return 0;
       }
   }
   
   Startup.main();
   

6. Now at Terminal run this command:

   tsc HelloWorld.ts 
   

   ............
   so by this you can see new transpiled file - HelloWorld.js generate inside the our folder

7. Now Execute Run Build Task (Ctrl+Shift+B) from the global Terminal menu

8. IT'S DONE NOW..: To execute code; just run below command at Terminal:

   node HelloWorld.js 
   

   this way we can see below message in Terminal:

   Hello World, Wazz Up
   

Answered By - ThermeshB