TypeScript-Workshop

    TypeScript

    Ein praktischer Einstieg mit TypeScript und HTML5

    image

    Christopher Stock

    Developer

    Der TypeScript-Workshop

    Sie interessieren sich für den Workshop?
    Schreiben Sie uns eine E-Mail und fordern Sie unverbindlich weitere Informationen an.

    Alternativ können Sie auch unseren TypeScript-bezogenen Newsletter abonnieren.

    TypeScript

    TypeScript basiert auf den Vorschlägen des ECMAScript-2015-Standards und bietet mit statischer Typisierung, Klassen und Interfaces Sprachkonstrukte, die aus anderen Hochsprachen bekannt sind. Der Compiler kompiliert TypeScript-Code nach beliebige JavaScript-Versionen; außerdem kann er JavaScript-Code verarbeiten, was die Arbeit mit bestehenden Projekten vereinfacht. Aufgrund des Featuresets ist TypeScript ein idealer Einstiegspunkt für Entwickler aller Sprachen. Unterstützt durch ein ausgefeiltes Tooling bietet TypeScript die ideale Grundlage für die Entwicklung professioneller Webprojekte.

    TypeScript-Workshop

    Dieser Ganztagesworkshop gibt Ihnen eine praktische Einführung in die Programmiersprache TypeScript.

    Sie lernen die Grundprinzipien der Sprache sowie die darauf basierenden Kernpraktiken zum Erstellen einer Spiele-Engine unter HTML5 kennen. Anhand von praktischen Beispielen sehen Sie, wie einfach TypeScript das Schreiben von strukturiertem und typisiertem Code ermöglicht.

    Sie erfahren, wie Sie die Zeichenfläche und das Soundsystem von HTML5 für sich nutzen können, und wie die Programmarchitektur des Spiels entworfen und umgesetzt werden kann. Im Laufe des Tages wenden Sie neu erlerntes Wissen bei der Umsetzung eines einfachen Browser-Spiels praktisch an.

    Der Fokus bleibt beim Erlernen der Programmiersprache TypeScript sowie der Erstellung einer eigenen Programmarchitektur bestehen, ohne dass Sie hierbei die Kontrolle über Ihr Programm an ein bestehendes System oder Framework abgegeben müssen.

    Ein weiterer Schwerpunkt liegt auf der Integration von TypeScript in bestehende JavaScript-Projekte, sodass diese nahtlos in strukturierten und gut verwaltbaren TypeScript-Code überführt werden können. Zudem werden Sie erfahren, wie Sie externe JavaScript-Bibliotheken in Ihre TypeScript-Projekte einbinden und diese somit typisiert nutzen können.

    Die Kenntnisse und Techniken über das Grundprinzip der Spiele-Engine können Sie nach Abschluss des  Workshops auch auf jeder anderen beliebigen Plattform und Programmiersprache, beispielsweise Java, Android, C#, Swift oder Windows Phone, zur Erstellung von Spielen oder gethreadeten Applikationen nutzen.

    TypeScript als JavaScript-Alternative

    Gute Gründe, warum man auf TypeScript setzen sollte

    Warum eigentlich TypeScript? Ihr Trainer Christopher stellt in seinem Blogpost die Programmiersprache TypeScript vor und zeigt Gründe auf, warum sie der Verwendung von JavaScript als Programmiersprache für die Entwicklung dynamischer Webapplikationen vorzuziehen ist.

    TypeScript entdecken

    Der große TypeScript-Workshop

    Erste Schritte mit TypeScript

    In diesem TypeScript-Workshop bietet Christopher einen praktischen Einstieg in die Programmiersprache TypeScript. Entwickelt wird eine Demo in HTML5 mit animierten Canvas-Elementen.

    Erste Schritte mit TypeScript

    Agenda

    Das erwartet Sie im TypeScript-Workshop

    1. Begrüßung und Kurzvorstellung
    2. Verwendung des Versionierungssystems GIT
    3. Installation und Einrichtung des TypeScript-Compilers unter PHPStorm / WebStorm
    4. Entwicklung der HTML5-Game-Engine    
      4.1 Grundlagen der Programmierung    
      4.2 Erstellen der HTML-Datei    
      4.3 Erstellen des JS-Einstiegpunktes    
      4.4 Verwendung des HTML5-Canvas-Elements    
      4.5 Realisierung des Key-Systems    
      4.6 Realisierung des Haupt-Threads    
      4.7 Erstellung der Spiele-Engine    
      4.8 Realisierung des Image-Systems    
      4.9 Realisierung des Sound-Systems
    5. Einbinden externer JS-Bibliotheken und Typisierung via TypeScript-Declaration-Files
    6. Generierung einer Dokumentation via TypeDoc
    7. Refactoring des Quellcodes    
      7.1 Kapseln einzelner Klassen und Module    
      7.2 Zusammenfassen wiederholender Werte durch die Erstellung neuer Klassen    
      7.3 Extrahieren von Lib-Klassen    
      7.4 Erstellen abstrakter Klassen und Schnittstellen    
      7.5 Einsatz von Enumerations

    Lernziele

    Was Sie aus dem TypeScript-Workshop mitnehmen

    Am Ende des Workshops werden Sie in der Lage sein, die folgenden Fragen zu beantworten:
    • Was ist TypeScript?
    • Welche Vorteile bietet mir TypeScript gegenüber JavaScript?
    • Wie funktioniert der TypeScript Compiler?
    • Wie kann ich TypeScript unter PHPStorm einrichten und nutzen?
    • Wie kann ich die wichtigsten Komponenten für meine Game-Engine realisieren?
    • Wie kann ich meine bestehenden JavaScript-Projekte nach TypeScript überführen?
    • Wie kann ich externe JavaScript-Bibliotheken typisiert einbinden?
    • Wie kann ich eine Dokumentation meines Quellcodes erstellen?
    • Welche Möglichkeiten zur Refaktorisierung habe ich in TypeScript?

    Zielgruppe

    Anfänger und Fortgeschrittene

    Onlinedemo

    Sie möchten sich ein Bild davon machen, was Sie im TypeScript-Workshop erwartet?

    Voraussetzungen

    Ein paar Dinge, die Sie vorbereiten sollten …

    Es gibt ein paar Dinge, die Sie vorbereiten sollten, damit der Workshop ohne Verzögerung beginnen kann:
    • Bringen Sie einen Rechner mit
    • Installieren Sie WebStorm oder PhpStorm 1
    • Optional Installieren Sie NodeJS 2
    • Denken Sie an die gute Laune!
    1 In diesen IDEs ist der TypeScript-Compiler bereits integriert 2 Der TypeScript-Compiler benötigt NodeJS

    Wenn Sie die Seite weiterhin nutzen, akzeptieren Sie die Verwendung von Cookies. Weitere Informationen

    The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

    Close