Dies soll eine Serie von Blog Posts werden, in denen ich darüber spreche, welche Probleme ich beim Entwickeln von User Apps festgestellt habe und wie ich sie für mich löste. Dafür werde ich mehrere Themen behandeln. Hauptthema wird aber sein “Wie schreibe ich mit modernen Hilfsmitteln eine User App”. Beginnen werde ich aber erstmal mit etwas sehr grundlegendem: Die Programmiersprache an sich.

TypeScript

Aktuell werden User Apps mit JavaScript geschrieben. Dies ist notwendig, da die Apps auf den Knuddels-Servern in einer JavaScript-Laufzeitumgebung laufen (Rhino). Aber das geht auch anders, nämlich mit TypeScript!

TypeScript ist eine Programmiersprache, die vereinfacht gesagt das ist, was JavaScript in vielen Jahren sein könnte. TypeScript wird von Microsoft entwickelt und ist komplett Open Source. TypeScript, wie auch JavaScript, basieren auf dem gleichen Standard: ECMAScript. Das bedeutet, dass jedes gültige JavaScript auch gültiges TypeScript ist. Das macht den Umstieg bzw. den Start damit zu arbeiten relativ einfach. Man muss eigentlich seinen alten Code nicht anfassen. TypeScript kann mit Hilfe des TypeScript-eigenen Compilers zu JavaScript umgewandelt (kompiliert) werden, womit es dann z.B. auf dem Knuddels-Server lauffähig ist. Das gleiche gilt auch für das JavaScript/TypeScript im Browser, bzw. der HTML-Benutzeroberfläche die man hier im Rahmen der User Apps verwenden kann. Das werde ich aber in späteren Teilen der Serie vertiefen.

Unterschiede zu JavaScript

In TypeScript gibt es die sogenannte “statische Typisierung zur Compile-Zeit”, nicht wie bei JavaScript die “dynamische Typisierung” zur “Laufzeit”.

Das heißt, dass bereits während man den Code schreibt vom TypeScript-Compiler überprüft wird ob man z.B. einer Methode das gewünschte Argument vom richtigen Typ übergibt und innerhalb der Methode auch den korrekten Datentyp zurück gibt. Wenn ich bspw. eine Methode “getNameCount()” habe die ein Array von Namen erwartet und eine Zahl zurückgeben soll, dann kann TypeScript exakt dies garantieren. Es wird sofort, während dem Tippen, ein Fehler geworfen der exakt beschreibt was man gerade falsch macht bzw. worin der Fehler liegt.

TypeScript erweitert JavaScript auch um viele sehr nützliche Features, die es erst in sehr neuen Definitionen des ECMAScript Standards gibt, oder noch nicht mal dort. Beispiele wären hier z.B.: Type Inference, Type Erasure, Interfaces, Enumerated Types, Mixin, Generics (ich liebe sie!) und z.B. Namespaces. Features die TypeScript besitzt, die es aber auch in sehr aktuellen ECMAScript-Standards gibt sind z.B. Classes, Modules, “arrow”-Functions, Variable Block-Scoping mit “const” und “let”, Template-Strings, async/await und Optional und Default Parameters.

Wer Sprachen wie z.B. Java oder C# kennt, dem wird vieles hier sehr bekannt vorkommen und auch ohne weitere Erklärungen zu schätzen wissen, warum dies alles wirklich sinnvolle und vor allem nützliche Features sind, die man gerne zur Verfügung hat!

Warum das Ganze?

Warum sollte man sich diesen zusätzlichen Aufwand machen? Gute Frage.

Aus den Unterschieden zu JavaScript erklären sich die Vorteile die TypeScript mit sich bringt. Es bringt einfach eine riesige Menge an Features mit sich, die das Entwickeln wesentlich vereinfachen und gleichzeitig den Code besser und fehlerfreier macht. Viele Fehler die man in JavaScript gerne aus Versehen macht werden hier von vorneherein unmöglich. Das führt natürlich zu besserer Code-Qualität und man ist letztendlich schneller bei der Entwicklung. Zusätzlich muss auch weniger in die Dokumentationen geschaut werden, da einem durch die statische Typisierung direkt gezeigt wird wie man bestimmte APIs, eigene oder auch fremde (z.B. die Knuddels-API) ansprechen muss und was man für Rückgabewerte zu erwarten hat.

TypeScript selbst wird immer beliebter. Immer mehr Webseiten werden (teilweise) mit Hilfe von TypeScript direkt umgesetzt (z.B. Threema), oder mit Hilfe von Frameworks die komplett in TypeScript geschrieben sind (z.B. Angular). Ein Mitglied des Angular-Teams hat dazu einen guten Blog Post geschrieben warum sie sich für TypeScript entschieden haben.

Auch Knuddels wird TypeScript in Zukunft einsetzen.

Was muss ich tun um TypeScript zu benutzen?

Eigentlich nicht viel. Man muss sich den TypeScript-Compiler installieren und diesen mit wenigen Handgriffen so konfigurieren, dass er alle APIs kennt die man benutzen möchte (z.B. die Knuddels-API). Das ist deswegen notwendig, da man den Code sonst nicht kompilieren kann, da man ja APIs benutzt, die der Compiler nicht kennt. Knuddels stellt aber eine sogenannte “TypeScript type definition” für die Knuddels-API bereit, die man im Compiler einrichten kann. Sonst muss man nur noch den eigenen TypeScript Code nach Wunsch zu JavaScript kompilieren und dieses dann auf den AppServer laden.

Darauf wie das ganze in einer echten App eingesetzt werden kann, werde ich im nächsten Teil der Serie mit einem konkreten Beispiel näher eingehen.

Weiterführende Empfehlungen:

Ich bin beim schreiben dieses Blogs auf einen weiteren, sehr aktuellen Blog bzw. ebenfalls Serie gestoßen die sich auch mit diesem Thema befasst.

• App-Entwicklung mit JavaScript, Teil 1: Vorsicht zerbrechlich? (Ekliges, altes JavaScript)
• App-Entwicklung mit JavaScript, Teil 2: Evolution einer Sprache (Das tolle Neue an modernem JavaScript)
• App-Entwicklung mit JavaScript, Teil 3: Aber bitte mit Typen (TypeScript eilt zur Hilfe!)