TypeScript: The What, Why & How!
If you’re a developer in 2021, it’s likely you hear about TypeScript pretty often! Since it hit the market in 2012 its popularity has surged, and now it’s used by some of the world’s biggest companies, like Microsoft, Lyft, Slack, and more. In a 2018 study developed by stateofjs.com, about 80% of developers stated that they’d like to learn or use TypeScript in their next project. But why you ask? Let’s take a look at a few reasons why year after year more developers are using TypeScript. Starting with…
Type Inference = Easier to Understand
Many developers consider TypeScript a “strongly typed” language. Why? Well, with TypeScript a tool called type inference is used. With type inference, the datatype of the variable used is inferred, so that no two values can use multiple data types. When any variable is misdefined, different than it’s previously declared data type, an error is thrown. In TypeScript, you must define your datatypes when you declare your variables and cannot change types once you work further down into your code. This results in a cleaner and more consistent program.
Type Checking for Faster Compiling
If you’ve written in JavaScript you’re probably familiar with PropTypes. These are used to define the type of value you’re using for a variable and is checked at runtime. Type support is a core feature of TypeScript and checks for any discrepancies between your value types before you run your program. This ultimately lets you save time and reduce errors as you code along. You can determine how strict you want TypeScript to be in checking your code as well. Leaving most of the power in your hands as a developer!
Rename Symbol: Refactoring Made Easy
How many times when you’re coding do you need to refactor but are afraid of ruining your entire codeset with your changes? In TypeScript, it’s super easy to refactor using the Rename Symbol tool in your IDE. With this tool, you can see all names and occurrences of a given variable throughout your code, without using the Search/Find All feature. Which can be troublesome to use at times! So if you want to make any big changes, TypeScript makes it easy. You can find all the instances of the variable you’re looking for, refactor, and get an alert if there are any errors after the changes are made. Sounds like a lot of saved time and less debugging!
Easier to Merge
We’ve all seen a Pull Request in GitHub that’s made us nervous when working on a project with other developers. How are you sure that your collaborators have written code that passes your unit test? TypeScript verifies that all unit tests, definitions, and compilations are completed before the PR is allowed to be submitted. Therefore, it’s easier to work with any team and to solve any problems fast together!
Let’s Get Started!
I’m guessing you’re ready to get started with TypeScript now, right? To get going, you first need to install the TypeScript compiler, using the following commands in your terminal:
NPM Installation Method
npm install --global typescript # Global installation
npm install --save-dev typescript # Local installationYarn Installation Method
yarn global add typescript # Global installation
yarn add --dev typescript # Local installation
Next, you’ll need to make sure you’re editor is compatible with TypeScript. If you’re using any popular IDE like VSCode or Atom you should be good to go!
You’ll also need a tsconfig.json file in your project’s root directory. You can add any settings you need here to instruct your system on how to compile your TypeScript code.
Finally, in order to transpile your TypeScript code, you need to run the tsc command in your terminal. This will trigger your compiler, which will look in your tsconfig.json file to check how to compile your code.
You’re all set now! Have fun learning TypeScript and happy coding :)