Hands-on-Workshop: Echtes Cross-Plattform für alle mit Angular

Christian Liebel
@chris_liebel
Lösungen für alle mit Angular, HTML5,
CSS3 und Co.
Cross-Plattform Workshop – hands-on
Manuel Rauber
@ManuelRauber
Architect
Christian Weyer
@christianweyer
CTO Consultant

View Slide

Lösungen für alle mit Angular, HTML5, CSS3 und Co.
Cross-Plattform Workshop - hands-on
https://www.thinktecture.com
Sprecher
Christian Liebel Christian Weyer Manuel Rauber

View Slide

Prepare it Code it
Build it Deploy it

View Slide

08:30–10:00 Prepare it
10:00-10:30 Pause
10:30-12:00 Code it
12:00-13:00 Mittagessen
13:00-14:30 Build it
14:30-15:00 Kuchenbuffet
15:00-16:30 Deploy it
Zeitplan

View Slide

08:30–10:00 Prepare it
10:00-10:30 Pause
10:30-12:00 Code it
12:00-12:45 Mittagessen
12:45-14:15 Build it
14:15-14:45 Kuchenbuffet
14:45-16:15 Deploy it
Zeitplan (Vorschlag)

View Slide

Willkommen

View Slide

Prepare it
• Cross-Platform
• HTML5, CSS3,
JavaScript
• Zielarchitektur
Code it
• TypeScript
• Angular
Build it
• Electron
• Cordova
Deploy it
• Windows, macOS, Linux
• iOS, Android
• Ausblick

View Slide

Nintendo DS
Windows
Windows Mobile
iOS
Android
BlackBerry 10
FireOS
macOS
Linux Fernseher
Kühlschrank
Browser
Single-, Multi- und Cross-Plattform
Cross-Plattform == Cross-Plattform?

View Slide

„Das sieht ja aber gar
nicht wie eine native
Anwendung aus!“

View Slide

https://spotifyblogcom.files.wordpress.com/2014/12/overview.png

View Slide

http://media.idownloadblog.com/wp-content/uploads/2014/06/Google-Docs-Sheets-Slides-teaser-001.jpg

View Slide

Single-Page Web Applications
Cross-Plattform-Technologiestack

View Slide

Zielarchitektur
• REST APIs, HTTP APIs, “irgendwas APIs”
• Use Case orientierte Modellierung: Funktionale Services
mit einem dedizierten Interface
• Kann weitere Datenquellen
(Dateisystem, Datenbank, …) anbinden
• Abgesichert via Tokens
• Kann von jedem HTTPS-sprechenden Client
konsumiert werden
• Nutzung von WebSocket für Echtzeitkommunikation
HTTP HTTPS WebSocket
Web API
HTML5-Application
(Single-Page Application)
Web Cordova Electron
Node.js .NET Core

View Slide

Wir schreiben heute eine App…
• auf Basis von Angular, TypeScript und HTML
• die sich an die Bildschirmabmessungen anpasst
(Responsive Design)
• auf unterschiedlichen Geräten und Plattformen
funktioniert (Cross-Platform)
• die native Plattformfeatures nutzt
Demo
LIVE DEMO

View Slide

git clone https://github.com/thinktecture/basta-herbst-2017-
xplatform-ws.git
cd basta-herbst-2017-xplatform-ws
npm install
# Hat es geklappt?
ng version
npm start
Repository-Setup

View Slide

git pull
git reset --hard
Hilfreiche Git-Befehle

View Slide

Prepare it
• Cross-Platform
• HTML5, CSS3,
JavaScript
• Zielarchitektur
Code it (Teil I)
• TypeScript
• Angular
Build it
• Electron
• Cordova
Deploy it
• iOS, Android
• Ausblick

View Slide

TypeScript

View Slide

macOS
iOS
Windows Mobile
Android
Windows Desktop
Windows 10/UWP
Linux
Browser

View Slide

• Open-Source-Entwicklung von Microsoft
• Superset von JavaScript
• Statische Typisierung
• Bietet diverse Features von ECMAScript 2017+
• Transpilierung nach JavaScript
• TypeScript Compiler CLI
• Vielseitiger IDE Support: Visual Studio (Code), WebStorm/IntelliJ IDEA, Atom, …
TypeScript

View Slide

• Open-Source-Projekt von Google
• Entwicklungsplattform für Desktop- und Web-Apps
• Framework für Web und Mobile optimiert
• Angular CLI: Zentraler Ausgangspunkt für Angular-Projekte
Angular

View Slide

Komponentenorientierung
• Erlaubt Entwicklung nach dem MV*-Entwurfsmuster
• Ziel: Reusability, Skalierung
• Konstrukte
• Komponente: Abgeschlossener und wiederverwendbarer Softwarebaustein
• eigene UI
• eigenes Routing, …
• Service: Wiederverwendbare Klassen ohne UI
• Bspw. für clientseitige Businesslogik
Angular

View Slide

Features
• Besonders einfaches und schnelles Setup
• Keine Konfiguration notwendig
• Unterstützung für E2E- und Unit-Tests
• Der zentrale Ausgangspunkt unter anderem
• zum Lernen von Angular
• für schnelle Ergebnisse
Angular CLI

View Slide

Verwendung
Bootstrapping
• ng new project
Buildprozess
• ng build
Entwicklungsserver
• ng serve
Angular CLI

View Slide

Und jetzt Sie!
Binden Sie das Poké API (https://pokeapi.co/) in die Anwendung ein. Auf den
folgenden Slides finden Sie zusätzliche Informationen zu allen Punkten, die Sie
beachten müssen:
1. Datenmodell
2. Service
3. Komponente
4. Routing
5. Verlinkung im Menü
Poké API

View Slide

Datenmodell
• Daten sind der eigentliche Kraftstoff jeder App. Im nächsten Schritt wollen wir mit der PokéAPI
einen Webservice anbinden, der uns diese Daten liefert. Einer der Vorteile von TypeScript ist
die optionale statische Typisierung. In TypeScript können Sie die Datenstruktur mithilfe von
Interfaces oder Klassen modellieren.
• Legen Sie ein Interface für das Modell eines Pokémon an
• Die Eigenschaften eines Pokémon können Sie sich auf der Website zur PokéAPI anschauen:
https://pokeapi.co/
• Gibt es Tools, die eine TypeScript-Klasse oder ein -Interface aus JSON-Daten heraus
generieren können?
Poké API

View Slide

Service
• Das Konstrukt, um wiederverwendbare nicht-UI-bezogene Funktionalität in Angular zu
kapseln, wird als Service bezeichnet. Services dienen der horizontalen Segmentierung Ihrer
Anwendung. Denken Sie sich einen Service als Gegenstück zu Ihrem Controller in ASP.NET
MVC: Er schachtelt alle HTTP-Anfragen, die zu einem bestimmten Teilbereich Ihrer
Problemdomäne gehören.
• Legen Sie einen Service zum Zugriff auf die PokéAPI an
• Folgende Liste muss beim Entwickeln des Services beachtet werden, welche auf den
nachfolgenden Slides beschrieben sind:
• Injecting des HTTP-Services
• Abruf der Pokémon-Liste
• Abruf eines einzelnen Pokémons
• Einhängen des Services in die Dependency Injection
Poké API

View Slide

Service – Injecting des HTTP-Services
• Zum Konsumieren von Abhängigkeiten können Sie sich diese einfach in Ihren Konstruktor
einreichen lassen. Die Konstruktorinjektion ist typbasiert. Der HTTP-Service, der von Angular
bereitgestellt wird, heißt "Http". Lassen Sie sich diesen in Ihren neuen Service einreichen. Zu
aller Not können Sie beim StarWarsService spicken.
• Achtung: Http künftig deprecated.
Aufgabe für Profis: Den neueren „HttpClient“ verwenden.
Poké API

View Slide

Service – Abrufen der Pokémon-Liste
• Entwickeln Sie eine Methode "list()", welche eine Liste aller Pokémon abruft. Welcher Endpunkt
zu wählen ist, erfahren Sie auf https://pokeapi.co/
• Der Http-Service kapselt die verschiedenen HTTP-Verben (GET, POST, etc.) durch
gleichnamige Methoden: Http.get()
• Diese Methode liefert ein Observable zurück. Darunter versteht man einen (oder mehrere)
Wert(e), die erst in der Zukunft feststehen. Ein Observable hat einen generischen
Typparameter: Http.get() liefert etwa ein Observable zurück, das eine HTTP-Response enthält.
Um auf die Nutzlast der Antwort zuzugreifen, müssen Sie diese zunächst entsprechend der
Antwort des Servers transformieren. Die Poké API gibt JSON zurück, aber es könnte auch
Plain-Text sein.
• Hierbei hilft Ihnen der Rx.js-Operator map: return http.get(…).map(response => response.json())
• Geben Sie das Ergebnis als Observable einer Liste von Instanzen des Interfaces, das sie vorhin
definiert haben, zurück. Das geht ganz einfach: public list(): Observable { … } – ein
Type-Cast ist hier nicht erforderlich.
Poké API

View Slide

Service – Abrufen eines einzelnen Pokémons
• Entwickeln Sie analog zu oben eine Methode "get()", die ein bestimmtes Pokémon unter
Angabe seiner Nummer im nationalen Pokédex (seiner ID).
• Die Implementierung wird sich ähnlich gestalten wie bei der Liste, nur dass diesmal eine ID
übergeben und die URL entsprechend zusammengesetzt werden muss.
• Zum Konkatenieren von Zeichenketten gibt es ab ECMAScript 2015 die sogenannten
Template Literal Strings. Auch in .NET sind sie bekannt, denn dort haben sie mit C# 6 unter
dem Namen String Interpolation Einzug gehalten, wenn auch mit abweichender Syntax. In
JavaScript geht das so: `http://example.com/${id}` – achten Sie auf die Backticks.
• Beachten Sie ebenfalls, dass sich der generische Typparameter des Observables ändert: Wir
geben nun kein Array, sondern einen einzelnen Datensatz zurück.
Poké API

View Slide

Service – Konfiguration der Dependency Injection
• Vorsicht: Services werden nicht automatisch in Ihre Anwendung eingebunden. Stellen Sie nun
den Service über die Dependency-Injection bereit. Finden Sie in der Datei module.ts die
richtige Stelle?
Poké API

View Slide

Komponente
• Der Begriff der Komponente ist so alt wie der Begriff des Software-Engineering selbst. Unter
einer Komponente versteht man wiederverwendbare, einfach kombinierbare
Softwarebausteine. Im Falle von Angular sind diese UI-bezogen. Sie bringen also ein eigenes
Template mit. Erzeugen Sie eine neue Komponente.
• Vergessen Sie nicht, die Komponente ebenfalls beim Anwendungsmodul zu registrieren.
Poké API

View Slide

Komponente – Listenanzeige
• Auch in Komponenten können Sie sich Abhängigkeiten einreichen lassen: Wieder über den
Konstruktor und wieder über die Verwendung des Typs – hier also Ihrer Service-Klasse.
• Legen Sie ein Feld an: public pokemon: Observable.
• Führen Sie im Konstruktor folgende Zuweisung durch: this.pokemon = pokemonService.list();
• Kommen wir nun zum zugehörigen HTML-Template Ihrer Komponente: Legen Sie dort eine
unsortierte Liste (ul) an und legen sie einen Listeneintrag (li) hinein. Zeichnen Sie das li-Element mit
der Direktive *ngFor="let item of pokemon | async" aus.
• Die async-Pipe wartet darauf, dass der Netzwerkrequest abgeschlossen wird. Sobald das der Fall
ist, werden die Pokémon angezeigt und das li-Element für jedes Pokémon wiederholt.
• Innerhalb des li-Tag können Sie nun Data-Binding anwenden. Das geht mithilfe der Moustache-
Syntax: {{ item.name }}
• Zeigen Sie mindestens Namen, Gewicht und Größe des Pokémon in der Liste an.
• Sie können Ihre Komponente ausprobieren, indem Sie diese in Ihre HomeComponent einbetten:

Poké API

View Slide

Komponente – Detailanzeige
• Führen Sie nun ähnliche Schritte auch zur Implementierung einer Detail-Komponente durch.
• Diesmal benötigen Sie aber keine Liste, sondern zeigen Details zu einem bestimmten
Datensatz an. Da wir Data-Binding nur dann anwenden können, wenn auch ein Datensatz
geladen wurde, schalten Sie die Anzeige der Daten nur bei Vorhandensein eines Datensatzes
an: {{ pokemon.name }}
• Innerhalb des "div" können Sie sicher auf das Pokémon zugreifen. Zeigen Sie mindestens Name,
Gewicht, Größe und den Basiserfahrungswert an.
• Verwenden Sie zum Abrufen von Daten zunächst eine statische ID, zum Beispiel 151 für Mew.
Poké API

View Slide

Routing – Liste
• Routing ist ein elementarer Bestandteil von Single-Page Web Applications. Fügen Sie in der
Datei routes.ts eine neue Route für die Listenansicht der Pokémon-Liste ein. Parameter
werden mit führendem Doppelpunkt (:) deklariert.
• Falls nötig, lassen Sie sich inspirieren von der Route zur StarWars-API. Vernachlässigen Sie
dabei die Angabe von "model" und "page".
• Sie können die korrekte Umsetzung prüfen, indem Sie in Ihrem Browser die neue Route
eingeben.
Poké API

View Slide

Routing – Detailseite
• Legen Sie nun auch eine Route für die Detail-Ansicht eines Pokémon an. Falls nötig, lassen Sie
sich inspirieren von der Route zur StarWars-API. Vernachlässen Sie dabei die Angabe von
"model". Die "id" wird allerdings benötigt.
• Innerhalb Ihrer Komponente pokemonDetail müssen Sie nun an die ID kommen, die in der Route
eingegeben wurde. Zugriff auf die Parameter erhalten Sie über den Service mit dem Typ
ActivatedRouteSnapshot. Dieser Service bietet die Eigenschaft "params", auf dem die URL-
Parameter abgelegt sind. Starten Sie abhängig davon die Abfrage gegen Ihren Pokémon-
Service.
• Sie können die korrekte Umsetzung prüfen, indem Sie in Ihrem Browser die neue Route
eingeben.
• Schauen Sie sich die Angular-Dokumentation zu "routerLink" an. Wie können Sie aus der
Pokémon-Liste heraus auf die einzelnen Einträge verlinken?
Poké API

View Slide

Verlinkung im Menü
• Abschließend wollen wir die Pokémon-Liste noch im Menü referenzieren.
• Navigieren Sie dazu zur Datei src/app/components/menu/menu.html
• Fügen Sie einen neuen Menüeintrag analog zu den übrigen Menüeinträgen hinzu.
Poké API

View Slide

Prepare it
• Cross-Platform
• HTML5, CSS3,
JavaScript
• Zielarchitektur
Code it
• TypeScript
• Angular
Build it
• Electron
• Cordova
Deploy it
• iOS, Android
• Ausblick

View Slide

• Nativer Anwendungsrahmen mit integriertem Web Browser
• Android: Android spezifischer Browser / CrossWalk
• iOS: UIWebView / WKWebView
• Windows Mobile: Internet Explorer / Edge
• HTML5 Anwendung wird innerhalb des integrierten Web Browsers gehostet
• Der Anwendungsrahmen erlaubt Zugriff auf darunterliegende native Platform APIs via Plugins
• Native SDKs werden zum Bauen der Apps benötigt
Cordova

View Slide

Cordova Architektur
Cordova Application
Single-Page Application
HTML JS CSS Assets
Cordova Plugins
Geolocation
Notiﬁcations
Media
Camera
Custom Plugins
HTML Rendering Engine (WebView)
Cordova Native APIs
Cordova APIs
HTML APIs
Mobile OS
Android iOS Windows 10 UWP and more…
OS APIs
OS APIs

View Slide

• Erlaubt das Erstellen von echten Desktop Anwendungen (.exe, .app)
• Kombiert einen “full-blown” Chomium Browser mit Node.js
• Anwendung ist nicht abhängig von installierten Browsern des Zielgeräts
• Benötigt keine nativen SDKs zum Bauen der Anwendung
• Ermöglicht Zugriff auf native Plattform APIs
• Electron API
• Node.js Module
• Bringt Features wie ein Auto-Updater oder einen Crash-Reporter mit
Electron

View Slide

Electron Architektur
Desktop OS
Electron Renderer Process
(technically Chromium)
Electron Main Process
(technically Node.js)
macOS Windows Linux
Single-Page
Application
Electron API
Custom Node.js
modules
IPC
Remote
Node.js

View Slide

Prepare it
• Cross-Platform
• HTML5, CSS3,
JavaScript
• Zielarchitektur
Code it (Teil II)
• TypeScript
• Angular
Build it
• Electron
• Cordova
Deploy it
• iOS, Android
• Ausblick

View Slide

Plattformerkennung
• Entwickeln Sie einen Service "PlatformService" mit drei statischen Methoden, die zur
Bestimmung der Plattform genutzt werden können:
• "isBrowserApplication()": Liefert einen boolschen Wert, der true ist, wenn die Anwendung in
einem Browser läuft.
• "isCordovaApplication()": Liefert einen boolschen Wert, der true ist, wenn die Anwendung in
Cordova ausgeführt wird.
• "isElectronApplication()": Liefert einen boolschen Wert, der true ist, wenn die Anwendung in
Electron ausgeführt wird.
• Cordova schreibt auf das globale "window"-Objekt eine gleichnamige Property, wenn die
Anwendung in Cordova ausgeführt wird.
• Bei Electron lässt sich mit Hilfe des User Agents und dem Vorhandensein des Strings
"Electron" prüfen, ob die Anwendung in Electron ausgeführt wird.
Teilen mit Freu(n)de

View Slide

Service – Schnittstellendefinition
• Entwickeln Sie einen abstrakten Service, der die Schnittstelle zum Teilen von Inhalten definiert.
• Definieren Sie ein abstrakte Methode "share()", die einen Titel und eine Beschreibung als String
entgegennimmt.

View Slide

Service – Teilen im Browser
• Entwickeln Sie Service, der den abstrakten Share Service ableitet und implementieren Sie die
Methode "share()".
• Im Falle des Browsers soll das E-Mail-Programm des Benutzers geöffnet werden und sowohl
Titel als auch Inhalt der E-Mail vorausgefüllt werden.
• Das E-Mail-Programm können Sie mit einem "mailto:"-Link öffnen.

View Slide

Service – Konfiguration der Dependency Injection
• Entwickeln Sie eine Funktion "shareServiceFactory()", die eine Instanz des
BrowserShareService erzeugt.
• Fügen Sie diese Factory der Angular Dependency Injection hinzu:
https://angular.io/guide/dependency-injection#factory-providers

View Slide

Komponente – Erweiterung der Detailseite
• Erweitern Sie die Detailseite mit einem "Share to a friend"-Button.
• Bei Klick auf diesen Button soll eine Methode "share()" ausgeführt werden.
• Die Methode "share()" benutzt den ShareService, um den Inhalt zu teilen.
• Vergessen Sie nicht, den Service via Konstruktorinjektion anzufordern.

View Slide

Service – Teilen auf mobilen Geräten
• Entwickeln Sie einen Service, der den abstrakten Share Service ableitet und implementieren
Sie die Methode "share()".
• Im Falle einer Cordova-basierten Ausführung kann die native "Teilen"-Oberfläche des Geräts
benutzt werden.
• Die Anwendung integriert bereits ein Plugin, um die native "Teilen"-Oberfläche anzusprechen:
https://www.npmjs.com/package/cordova-plugin-x-socialsharing
• Benutzen Sie die Funktionen des Plugins, um über JavaScript mit der nativen Funktion zu
sprechen.
• Erweitern Sie Ihre ShareServiceFactory und erzeugen Sie eine Instanz vom
"CordovaShareService", wenn Sie erkennen, dass die Anwendung in Cordova ausgeführt wird.

View Slide

Service – Zugriff auf den Desktop
• Entwickeln Sie einen Service, um Zugriff auf Electron zu erhalten.
• Sie erhalten Zugriff auf Electron, in dem Sie die auf dem "window"-Objekte definierte Methode
"require()" aufrufen und ihr als Parameter den Wert "electron" übergeben.
• Achtung: Die Methode "require()" steht nur zur Verfügung, wenn die Anwendung in Electron
ausgeführt

View Slide

Service – Teilen auf dem Desktop
• Entwickeln Sie einen Service, der den abstrakten Share Service ableitet und implementieren
Sie die Methode "share()".
• Im Falle einer Electron-basierten Ausführung soll, wie im Falle des Browsers, das E-Mail-
Programm geöffnet werden.
• Probieren Sie die Anwendung in Electron mit dem BrowserShareService aus. Was stellen Sie
hier fest?
• Benutzen Sie den ElectronService, um Zugriff auf "shell" zu erhalten, um externe Links zu
öffnen: https://github.com/electron/electron/blob/master/docs/api/shell.md
• Erweitern Sie Ihre ShareServiceFactory und erzeugen Sie eine Instanz vom
"ElectronShareService", wenn Sie erkennen, dass die Anwendung in Electron ausgeführt wird.
• Aufgemerkt: Ihre ShareServiceFactory benötigt eine Abhängigkeit, um den
ElectronShareService zu erzeugen.

View Slide

Prepare it
• Cross-Platform
• HTML5, CSS3,
JavaScript
• Zielarchitektur
Code it
• TypeScript
• Angular
Build it
• Electron
• Cordova
Deploy it
• iOS, Android
• Ausblick

View Slide

Ihre Anwendung verpacken und bereitstellen
• Inspizieren Sie die Datei package.json, die sich im Wurzelverzeichnis des
Repositorys befindet.
• In „scripts“ finden Sie verschiedene Skripte, die das Bauen Ihrer
Anwendung für Desktop- und Mobilbetriebssysteme erlauben.
• Diese Skripte erzeugen einen Build Ihrer Anwendung und verpacken diese
anschließend für die verschiedenen Systeme.
• Bringen Sie diese auf den Zielsystemen und -geräten, die Sie
mitgebracht haben, zum Einsatz.
Buildprozess

View Slide

Zusammenfassung
Windows 10 Mobile
iPhone, iPad
Android
Windows Store
Windows Desktop
Linux
macOS App
Node.js
npm Gulp
TypeScript
ECMAScript 2016
HTML5 CSS3
Restify
Token-Authentication
SequelizeJS
SQLite
Electron NW.js
Apache Cordova
TACO Tools
Angular
Chrome Safari
Firefox
Edge
WebStorm
VS Code Atom
vi Emacs
Sublime Text
Eine Codebasis
ASP.NET Web API
ASP.NET Core 1.0

View Slide

• Chromium Embedded Framework (CefSharp)
• Push
• Applikation
• Plattform
• Touch-Interaktionen
• Native Integrationen
• Offline-Fähigkeit
• Progressive Web Apps
Ausblick

View Slide

• Basiert auf CEF (Chromium Embedded Framework)
• Wrapper um Chromium für WPF und WinForms als Web Browser Control
• Kommunikation zwischen .NET und JavaScript Code über dediziertes API
• Ermöglicht Migrationspfade
• Anwendung nach und nach als SPA in JavaScript neu entwickeln
• Oder nur Teilbereiche in der existierenden Anwendung in der neuen Welt bauen
CefSharp

View Slide

Applikation
• Echtzeit-Daten-Push direkt in die Anwendungen
• Prinzip: Aufrechthalten einer Client-Serververbindung durch WebSockets
• oder Fallback-Technologie, z.B. HTTP Long Polling
• Für aktive, laufende Applikationen
• ASP.NET SignalR oder socket.io
Push

View Slide

Plattform
• Benutzung der nativen, herstellerspezifischen Push-Funktionen
• Bspw. Azure App Services kombiniert iOS, Windows 10 Mobile und Android Push
• Auch für inaktive Applikationen geeignet
Push

View Slide

• Native Touch Events vom Browser
• Abstraktion über hammer.js möglich
• Erkennung von Gesten
• Pinch-to-Zoom
• Rotate
• Swipe
Touchinteraktionen

View Slide

• Integration plattformabhängiger APIs
• Native Menüs
• Geolocation
• Globale Shortcuts
Integration nativer Funktionen

View Slide

• Synchronisieren der Daten in einen lokalen Speicher
• IndexedDB
• HTML5 Web Storage
• Bearbeiten der Daten ohne aktive Internetverbindung
• Synchronisation zurück zum Server nach Wiederherstellen einer Verbindung
Offlinefähigkeit

View Slide

Das Web wird nativ(er)
• Die Idee: Wir brauchen keine App-Stores mehr
• Web-App entspricht der App-App
• Feature Parity: Native Experience mit
Pushbenachrichtigungen, Offlineverfügbarkeit, …
• Angetrieben von Google, auf Android schon
heute verfügbar
• Abwärtskompatibel (Progressive Enhancement)
• Progressive Web Apps sind keine Technologie,
sondern eine Sammlung von Eigenschaften
Apps von morgen…

View Slide

Vielen Dank! Fragen?
Contact
@chris_liebel
[email protected]
@christianweyer
[email protected]
@manuelrauber
[email protected]

View Slide

Hands-on-Workshop: Echtes Cross-Plattform für alle mit Angular

Hands-on-Workshop: Echtes Cross-Plattform für alle mit Angular

Manuel Rauber

More Decks by Manuel Rauber

Other Decks in Programming

Featured

Transcript