Up and Running Quickly

So, what exactly is TypeScript? And how can we use it? Well, it really is as simple as "TypeScript generates JavaScript", to quote Anders Hejlsberg, the designer of the TypeScript language. Wherever we see a use for JavaScript in the modern world, we can generate this JavaScript using TypeScript.

JavaScript is being used everywhere – the more you look, the more JavaScript you find running in the most unlikely of places. Just about every website that you visit is using JavaScript to make the site more responsive, more readable, or more attractive to use. The power and flexibility of JavaScript also means that more and more tools are moving on-line. Where we once needed to download and install a program to write a document, or draw a diagram, we can now do this all from within the confines of our humble web browser.

The popularity and simplicity of JavaScript has inspired a whole host of runtime environments that can now run on a server...

A simple TypeScript IDE

TypeScript generates JavaScript through what is called a compilation step. This means that once you have written some TypeScript code, you will need to compile, or, more correctly, transpile this code, which will generate JavaScript. In order to do this compilation step, you will need a Node environment, and the TypeScript compiler itself. In this section of the chapter, we will explore the setup of a simple TypeScript IDE.

Node is a JavaScript runtime environment. Similar to how a web browser can interpret and run JavaScript code, Node can do the same thing. It is a command-line driven environment, which means that all you need is a standard command prompt in order to run JavaScript.

Installing Node is as simple as downloading the Node installer package from the Node website (https://nodejs.org) for your operating system of choice, and running it. As it is an open source package, so you can also download the source code, and compile it from scratch...

TypeScript basics

JavaScript is not strongly typed. It is a language that is very dynamic, as it allows for objects to change their types, properties, and behavior on the fly. TypeScript, however, is strongly typed, and as such will enforce rules that govern how we use variables, functions, and objects.

In this section of the chapter, we will work through the basics of the TypeScript language. We will start with the concepts of strong typing, or static typing as it is also known. We will then move on to exploring some of the basic types that the language uses, and how the language can detect what type a variable is, based on how and where it is used within our code. We will then tackle the basics of function signatures, show how to debug our code with VS Code, and finally see how to import and use third-party JavaScript libraries.

Strong typing

Strong typing, or static typing as it is also known, means that when we create a variable, or define a parameter in a function...

Summary

This has been a fast-paced introduction to what TypeScript is, and what it can do for JavaScript development. We started by setting up a simple development environment, got the TypeScript compiler installed, and started to use it to generate JavaScript. We then took a look at the basics of the type system, and explored how types can elevate the development experience. Finally, we used a third-party JavaScript library with the help of the declaration files.

In the next chapter, we will take a closer look at the type syntax in a lot more detail, get to understand where and how to use the available types, and how the type syntax can be used in different ways when writing functions.