Typescript project setup#

If you're an absolute beginner to TypeScript and want to learn it from scratch, this section is for you. Although I have explained the typescript concepts throughout the course, this section is to make you feel more confident about Typesctipt. Before starting this section, make sure you have installed VS Code and Node Js. Now, let's start working.

In this section, we are not covering React. The whole purpose of this section is to learn all the important TypeScript concepts. For that, first of all, let's create a new project. Open the terminal, and move to a location where you want to create the project. Type:

mkdir typescript-concepts

cd typescript-concepts

touch index.html

code .

I will name the project, typescript-concepts. You can name it the way you want. Let's create an index.html file by typing touch index.html. Now let's open the project in the terminal by typing code .. If you haven't followed the course yet, and you don't know how to make code and period command work, open the first section and come back. Now that we're inside the project, let's open index.html file. VS Code comes with an inbuilt Emmet command which adds a skeleton of our html file; just type exclamation mark and press tab. Let's name the title, Learning Typescript. In the same directory, let's create another file; this time, it's going to be the JavaScript file — let's call it scripts.js. Now let's refer the js file inside index.html

<script src="scripts.js" defer></script>

Let's add the attribute, defer. It will indicate to a browser that the script is meant to be executed after the document has been parsed. Before writing the code, let's install TypeScript. The one we are using in the project comes bootsrapped with React, but we'll have to install TypeScript in our environment if we want to use it with native JavaScript.

Let's open the browser and type TypeScript. Open the first link and click on download. We want to install it globally so let's copy this command and let's run it in the terminal. Before running it, make sure you have node js installed. Now let's install TypeScript globally.