A Simple Introduction to TypeScript
Recently, I’ve been hearing a lot of chatter around TypeScript and how it is pretty powerful. I was curious to see what all the fuss was about, so naturally, I took to the wonderful world of Udemy and jumped right in a course. This article will be a series of articles where I share the basics of TypeScript and my findings in hopes that this will help make those cloudy thoughts about TypeScript a little more clear.
⚠️ This article only reflects my opinion, lessons I learned, and quoted the opinions of other developers.⚠️
So… What is TypeScript?
To put it simply, when you’re writing TypeScript you’re just coding in Javascript. All the knowledge you have around JavaScript; arrays, objects, functions, and even ES2015 syntax, still applies to the world of TypeScript as well. The only thing different with TypeScript is adding a bit of additional syntax to our code to handle something called the type system.
The goal of the type system is to help catch errors during development. I like to think of it as the Javascript version of Grammarly. It tests your code while you are developing, and lets you know in advance when something is going to fail. To check for errors, the TypeScript compiler uses type annotations to analyze your codebase. These annotations describe the information that is flowing through your program. As the developer, it is your responsibility to add the TypeScript annotations to your codebase.
A few other things about the type system, it is only active during development. Neither the browser nor Node will ever know about your TypeScript code. Essentially what happens is your TypeScript code is compiled into Javascript which will then be executed into the browser. It’s that simple!
To better understand how this works check out this website, an in-the-browser Typescript compiler that will compile the TypeScript code, and print out the equivalent Javascript code for you!
Summary
In this intro chapter we saw:
- Writing TypeScript is the same as writing JavaScript but with some extra comments about your code.
- TypeScript has no role in how your code gets executed by the browser or Node.
- One might think of TypeScript as a fortune-teller while you are coding, letting you know if something is going to fail in advance.
As a developer, I find it worthy to take some time to learn what happens behind the scenes when learning new technologies, so that you have a better understanding of what’s going on. In my opinion, it brings a lot of clarity as you code. In the next chapter, I will create a simple application that executes some TypeScript code to put all this newfound knowledge to work. Stay Tuned!
I want to thank Stephen Grider for creating the course Typescript: The Complete Developer’s Guide [2020] for guiding me along my journey with TypeScript, and for providing the information for this article.
