Puzzle learning game for kids as an allegory to TypeScript typings

TypeScript | Why TypeScript? All you need to know about using it in projects

In recent years, TypeScript has become a favorite topic of discussion at JavaScript conferences and talks. Stackoverflow's recent developer survey named TypeScript the second most popular programming language among developers worldwide. Despite being less than ten years old, the language already occupies a firm place in web development tech stacks, including many well-known apps and corporations such as Slack, Medium, and Airbnb. In other words, there are plenty of reasons to take a closer look at the language and determine whether the TypeScript hype is justified. (Minor spoiler alert: we think so!).

What is TypeScript?

Diagramm mit TypeScript auf dem dritten Platz auf der Beliebtheitsskala der Programmiersprachen

In 2021, TypeScript was among developers' three most popular programming languages. Source: Stackoverflow Developer Survey 2021

Short overview (TL;DR)

The more complex apps become to develop, the more the limits of the languages they are written in begin to surface. As a dynamic programming language, JavaScript offers great flexibility, especially in web development. However, 10 years ago (and especially before the transition to ECMAScript 2015), it still lacked many language constructs that contribute to the optimal structuring of source code – especially end-to-end static typing. TypeScript addresses this very issue, fulfilling developers' wishes to add non-native features to the programming language. Co-inventor Anders Hejlsberg expressed this as his original motivation in an interview by saying:

„Let’s see if we can do a little bit better for JavaScript.“

Anders Hejlsberg

A short history of TypeScript and why it was invented

The foundation for TypeScript was developed around 2010 by a team at Microsoft. Both the core of what they had built and its long-term purpose were immediately evident in the name: TypeScript should make JavaScript more manageable by using Types. Several "Technical Fellows" – one of the highest rungs on Microsoft's career ladder – were present in that internal founding team, a good indication that Microsoft was serious about the project. To name a couple: Anders Hejlsberg, authoritative DOS/Windows architect and initiator of C#; and Andreas Lucco, co-inventor of the JavaScript engine Chakra. The official release of the first version in 2012 was soon followed by the launch of TypeScript as an open-source project on Github. Microsoft is now one of the world's biggest open source contributors. However, at the time, the software giant still had a reputation of ambivalence towards open source and with this decision was able to set an example within the development community through a change in its corporate culture towards open standards. On Github, the TypeScript language continues to be maintained and driven forward by a global JavaScript community.

Do you need TypeScript expertise for your Web App? Drop us an email. We are looking forward to it!

Michael Jaser

Your contact person: Michael Jaser, Co-Founder

Why TypeScript – what is it for?

When JavaScript starts to suck: About the limits of a programming language

Many project teams have a similar experience when developing complex software projects based on JavaScript: After a productive initial phase in which feature follows feature, progress in the project begins to slow down. Even in the most experienced and sophisticated dev teams, bug and refactoring tickets pile up over time as services, APIs, and modules interact. New team members face longer learning curves with the need to familiarize themselves with the data model: What properties does a user have? What does this module deliver in the event of an error? What about in the event of success? Even the best unit and integration tests can't avoid bugs that appear only at runtime, requiring in-depth checks of input and output values. If a function is changed so that it now expects two parameters instead of one, all places in the code where this function is called must be located and adjusted. As the level of sophistication increases, so does the complexity and maintenance of an app – so simple yet true.

For what kind of web apps is it worth using TypeScript?

TypeScript is intended for complex apps (and those that someday want to be). The name says it all: a static type system allows developers to specify types in the source code from the start, which are checked and translated into valid JavaScript at the time of compilation. The consistent use of TypeScript in a project initially increases the skill level requirement of all developers. But over the course of a project, this initial effort can pay off in many areas - in plain language: more readability in the code results, easier debugging, fewer runtime errors, and more robust software. Our senior developers report a speed of development that does not slow over time, but remains constant.

TypeScript Intellisense error overlay, giving important information

TypeScript Intellisense error overlay, giving important information about missing arguments

Many runtime errors could be avoided with TypeScript

... if used correctly. An example that underscores this thesis? In a large-scale refactoring, the Airbnb group converted its codebase to TypeScript over the last few years. The previously accumulated bug reports were analyzed for months in a post-mortem study. The result: 38% of all bugs in the Airbnb codebase could have been avoided with TypeScript. This was the conclusion of Airbnb software developer Brie Bunge, presented in her talk "Adopting TypeScript at Scale" at JSConf Hawaii in 2019. Our developers have worked in projects with and without TypeScript and agree: every bug that is already detected at compile time means one less runtime error. Great tooling like Autocompletion helps makes bug prevention possible, where even entering a line of code in an IDE like VSCode can reveal important information provided by TypeScript through a practical overlay.

TypeScript versus JavaScript

The most important difference between TypeScript and JavaScript?

JavaScript or TypeScript?

TypeScript is not a completely independent programming language, but rather a superset of JavaScript – it puts something "on top" of the language – so to speak. In view of this 100 percent compatibility of JavaScript and TypeScript, the question of "either/or" becomes superfluous. In the mind of its inventors, a JavaScript program is also a valid TypeScript program – or in other words: Every line written in JavaScript is also valid TypeScript code. Thus, in a file with the extension .ts, JavaScript can also be written without any problems. The risk of both languages drifting apart is low. Anders Hejlsberg's commitment - and a lively global open source community always at hand – ensures that this remains the case. The conversion of the tech stack to TypeScript is therefore more of an extension of certain language features such as type declarations, which then exist in the source code. The existing JavaScript code can remain - and the most popular JavaScript libraries can continue to be used.

TypeScript as a JavaScript superset

Browser cannot read any TypeScript – it is compiled to JavaScript-Code by the TypeScript compiler.

The main pros of TypeScript

Our colleague Johannes says, "Whenever I have trouble writing code in TypeScript, I realize my logic was still a bit too complicated." With TypeScript, experienced developers can quickly jot down code even without a data model. Here's an overview of what other advantages TypeScript can offer:

  • Excellent support by all popular editors and IDEs (Our recommendation: VSCode).

  • Continuous development of the language by the Microsoft Consortium & the TypeScript community

  • Natural transition for experienced developers of other "high level" languages like C# and Java

  • Modern language features - very close to the latest JavaScript developments of the TC39 committee

  • Earlier detection of bugs, more productivity, and more robust software

  • ESLint and TypeScript: a dream combo

  • Great compatibility and support with major frameworks (e.g. React, Angular, Vue)

5 Don’ts when switching to TypeScript

At Peerigon, we've been programming with TypeScript since 2018, so we've already learned from our mistakes. Here are our top 5 common TypeScript don'ts (so you don't suffer the same fate)

Practical advice for TypeScript beginners

Last but not least: a few practical tips for anyone who wants to try out TypeScript. The best thing is to get started right away!

  • A great tool: the Typescript Playground on the official Docs site is ideal if you want to quickly try out and execute code. It features an editor, live view, and the option to share your work with colleagues.
  • When larger objects like HTTP requests need to be typed, you can run them through Typehole. It automatically creates typings and strips away the first hurdle of typing.
  • Here's one not for the absolute beginners: In the small but tricky training units of Type Challenge developers can prove their knowledge and put their own TypeScript skills to the test.
  • Small tip for teams that want to migrate their professional tech stack to TypeScript: The combination of a new language under fixed time frames and budget pressure also raises the potential for frustration. As mentioned before, some previous TypeScript experience should be present in the project team - if in doubt, bring in senior support for the first phase of the transition.

A strong partner for TypeScript apps

Our software developers use methods where they make sense. Whether it's helping a start-up with setup or a seamless transfer of existing codebases into TypeScript: Just ask us!

 

 

 

 

 

 

Peerigon logo