Blog

Interview mit Hans-Christian Otto und Elmar Burke zum Thema Progressive Web Apps

Nov 27, 2017

Hans-Christian Otto und Elmar Burke im Interview auf den React Days 2017 in Berlin. Sie sprechen über den aktuellen Stand von Progressive Web Apps und den Benefits von Veranstaltungen wie den React Days.

Was ist eigentlich der rote Faden der React Days? Worauf muss man achten, wenn man React Application entwickelt? Ist die Diskussion um Web-Apps und Native-Apps noch immer aktuell und welche neuen Möglichkeiten bieten PWAs? Diese und weitere Fragen beantworten Elmar Burke (Blendle) und Hans-Christian Otto (Suora GmbH) im exklusiven Interview mit Mirko Hillert (Entwickler Akademie).

 

 

Mirko Hillert: Elmar, an dich die erste Frage. Du bist Program Chair der React Days und damit auch verantwortlich für das Programm. Was ist der rote Faden der React Days?

Elmar Burke: Der erste Tag ist ganz klar davon gekennzeichnet, Grundlagen aufzubauen. Es werden alle Dinge, die wirklich benötigt werden, um in das Thema einzusteigen, geklärt und sich zunächst erst einmal damit vertraut gemacht. Daraufhin wird am zweiten Tag die Basis vertieft. Christian und ich bauen eine Progressive Web App zusammen, mit allem was benötigt wird. Der dritte Tag ist dann eine Vertiefung mit weiteren spannenden Themen. Es gibt einen Deep Dive und die React Internals werden erklärt. Wir zeigen auf, was eigentlich zu machen ist, um eine App für eine Millionen Benutzer fertig zu bekommen und diese auch langfristig zu warten. Der Workshop beinhaltet also alles von der anfänglichen Basis bis zum Ende und beantwortet Fragen wie: „Was muss man eigentlich machen? Wie kann ich meine Product Manager überzeugen, dass ich genau das machen muss?“ Das findet man alles im Programm wieder.

Mirko Hillert: Ihr beide habt gestern im Team den Workshop „Progressive Web Apps“ gehalten. Was genau sind die wichtigsten Überlegungen, die man anstellen sollte, bevor man eine React Application entwickelt?

Hans-Christian Otto: React hat gegenüber anderen Frameworks wie zum Beispiel AngularJS oder Ember eine ganz große Herausforderung. Es ist nämlich ein sehr kleiner Bestandteil einer Anwendung. Es ist kein vollständiges Framework wie Angular, sondern ein kleiner Bestandteil. Es ist die Viewschicht – die Darstellungsschicht – und das auch ohne CSS. Es ist wirklich nur JavaScript-Code, um eine Komponente zu rendern. Das bedeutet, wenn wir mit React beginnen zu arbeiten, müssen wir uns überlegen, wo wir den Zustand unserer Anwendung halten. Wir brauchen etwas wie einen Redux, Mobbix oder bauen es uns selber – all das sind Möglichkeiten. Es muss überlegt werden, welche Programmiersprache eingesetzt wird. Wenn man Angular macht, liegt es sehr nahe, TypeScript zu machen. Bei React muss man sich selber überlegen, mache ich TypeScript, mache ich ECMAScript oder was auch immer. Es gibt viele Möglichkeiten. Es muss überlegt werden, wie mit dem Backend kommuniziert wird, und es wird zudem irgendeine CSS-Bibliothek benötigt. Wir können uns das alles selbst entwickeln, beispielsweise mit Styled Components, mit Bootstrap oder wir nehmen etwas wie Ant-Design, also fertige Komponenten für React. All das sind Fragen, die im Voraus beantwortet werden müssen. Wenn man sich also dafür entschieden hat, React zu machen, müssen zuvor noch viele weitere Entscheidungen gefällt worden sein.

Elmar Burke: Es müssen nicht nur Entscheidungen für das Programm gefällt werden, sondern auch für das eigentliche Set-up. Es muss geklärt werden, wie die Anwendung später laufen soll, ob sie fertig gebaut und als Dirty Bundle irgendwo hingeschoben werden kann, oder ob ein Server-side Rendering benötigt wird. Zudem stellt sich die Frage, was eigentlich mein Build-System ist. Somit sind unzählig viele Entscheidungen zu treffen. Das macht es einerseits schwieriger, andererseits aber auch so großartig. React ist auf alles anpassbar und man kann es in alle Richtungen schieben, wie man es gerade benötigt.

Mirko Hillert: Es gibt ja seit einigen Jahren die Diskussion: Web-Apps vs. Native-Apps. Ist diese Diskussion immer noch aktuell?

Hans-Christian Otto: Ein ganz klares „es ist kompliziert“. Viele Dinge sind mittlerweile sowohl intuitiv auch als Webanwendung umsetzbar. Die Performance von 3D Rendering mit WebGL ist beeindruckend. Früher habe ich immer gesagt: „Du brauchst eine native App, wenn du Spieleentwicklung machen willst!“ Ob es tatsächlich schon große Spiele für Mobilgeräte gibt, die 3-D machen und mit Webtechnologien entwickelt sind, weiß ich zwar nicht genau, kann ich mir aber gut vorstellen. Denn prinzipiell gibt es die Technologie größtenteils her. Trotzdem gibt es immer noch Gründe, Native zu machen. Ein typisches Beispiel dafür ist der Zugriff auf Adressbücher. Das geht weder auf iOS noch auf Android mit Webtechnologien, und das ist auch erst einmal ganz gut, aber es muss noch etwas kommen, damit das vernünftig funktioniert. Unter iOS haben wir auch noch viele weitere Dinge, die nicht vorhanden sind. Dadurch dass Service Worker nicht existieren, bekommen wir die App nicht offlinefähig. Zwar gibt es dafür andere Technologien, doch wir sind noch nicht richtig da, wo wir hinwollen. Ich glaube jedoch, Progressiv Web Apps sind ein guter Weg dorthin. In ein paar Jahren haben wir damit auch alle Technologien zusammen, um anstatt einer Native-App eine Progressiv Web App zu entwickeln. Es gibt einen Punkt, der wahrscheinlich noch viele Jahre präsent sein wird. Es ist so, dass wir Entwickler nicht immer alleine entscheiden, sondern auch die Stakeholder Einfluss haben. Es kann also sein, dass jemand im Aufsichtsrat, Management oder Ähnliches feststellt: „Unser Wettbewerb ist im App Store – wir müssen auch in den App Store.“ Dann muss man im Zweifelfall seine Progressive Web App doch wieder mit Cordova oder ähnlichen Technologien in den App Store bringen. Wobei die Überlegung aufkommt, ob man nicht gleich Native hätte machen können.

Mirko Hillert: Welche neuen Möglichkeiten bieten PWAs?

Elmar Burke: PWAs sind eine wunderbare Möglichkeit, um voll umfängliche Anwendungen einfach im Web laufen zu lassen. Das Progressive erweitert eigentlich nur die normalen Web-Apps mit dem, was es zusätzlich kann. Für die meisten Anwendungen, die heute geschrieben werden, braucht man nicht unbedingt den Zugriff auf ein Adressbuch oder irgendwelche anderen komplizierten Dinge. Die relevantesten Aspekte sind dabei das Anzeigen von Daten bei schlechter Internetverbindung oder das Empfangen von Push-Benachrichtigungen – genau das kann eine Progressive Web App bieten. PWAs laufen momentan auf Android-Geräten sehr gut. Auf iOS und im Edge-Browser, also auf Microsoftgeräten befindet sich das aktuell in der Entwicklung. Chrome und Firefox unterstützen so ziemlich alle Features. Wir können Push-Nachrichten versenden und auf den Geräten empfangen. Wir können einen Offlinezugriff, also die Funktion der Anwendungen im Web auch ohne Internetverbindung, gewährleisten. Und auch die Datensynchronisation im Hintergrund, ohne dass die Anwendung überhaupt geöffnet sein muss, läuft ordnungsgemäß ab. Das sind Features, die man damals als ausschließlich native Features gesehen hat und damit kann man 80 Prozent aller Anwendungen realisieren.

Mirko Hillert: Warum sind denn diese vier Trainingsevents – also JavaScript Days, HTML5 Days, Angular Days und React Days – auf denen wir hier gerade sind, der richtige Ort, sich mit dem Thema Progressive Web Apps auseinanderzusetzen?

Ein jeder, eines noch so crossfunktionalen Teams, findet auf dem Event etwas für sein Fachgebiet – meiner Meinung nach eine große Besonderheit.

Hans-Christian Otto: Aus ganz vielen Gründen. Ein wichtiger Part ist, dass man das Thema hier im Programm immer wieder findet. Mit den Angular Days gibt es einen Angular Track. Dort werden Progressive Web Apps mit Angular behandelt. Wir haben das im React Track gemacht und es gibt auch bei den HTML5 Days etwas, wo das Ganze ohne Framework beleuchtet wird. Dort wird genauer betrachtet, wie all das auch selber gemacht wird. Progressive Web Apps sind genau gesehen keine neue Technologie, sondern eine Zusammenfassung beziehungsweise ein Oberbegriff für mehrere Techniken und Technologien. Wichtiger Part von PWAs ist auch, dass sich eine Anwendung flüssig bedienen lässt, dass sie schön aussieht und dass sie weiche Übergänge schafft. Dafür benötigt man wiederum CSS-Technologien. Da bin zumindest ich kein Experte, doch dafür gibt es dann jemanden wie Jens, der einen Workshop zu genau diesem Thema hält. Und genau auch das ist ein wichtiger Bestandteil für Progressive Web Apps. Wir saßen gestern Abend mit Teilnehmern zusammen und unterhielten uns. Das waren vier Leute aus einem Team. Davon waren zwei Entwickler, einer ein Testautomatisierer und einer ein Designer. Alle vier haben hier auf den Angular Days für ihr Fachgebiet relevante Themen gefunden, die allesamt Grundsteine für das Bauen einer Progressive Web App sind. Dass jeder eines solch crossfunktionalen Teams auf nur einem Event etwas findet, ist meiner Meinung nach eine große Besonderheit.

Elmar Burke: Es ist nicht nur, dass die Trainingsevents als solches wahnsinnig hilfreich für die Teilnehmer sind, sondern auch das Austauschen in den ausgedehnten Pausen. So kann man auch über Best Practices sprechen, wie andere agieren und die Leute überzeugen. Sich zu diesen Soft Skills auszutauschen, sie auszubauen und das Sammeln weiterer Erfahrungen, ist unglaublich hilfreich. Ich habe viele Leute aus unterschiedlichen Firmen und anderen Teilen des Landes kommend, die unterschiedlichsten Dialekte sprechend, beobachtet. Leute, die sich vorher wahrscheinlich nicht kannten und sich dennoch miteinander unterhielten. Das, glaube ich, ist einer der besten Punkte, um das Gelernte nochmal zu vertiefen und die Themen ausgedehnter zu behandeln – einfach alles in gemütlicher Runde zu beleuchten und zu gucken „Wie macht ihr das eigentlich?“.

Hans-Christian Otto: Ich denke, du hast dabei einen ganz wichtigen Punkt angesprochen: die unterschiedlichen Dialekte – auch im Sinne der Technologien. Das ist eine Veranstaltung, bei der man auch in den Pausen und am Abend als React-Entwickler mit Angular-Entwicklern sprechen und herausfinden kann, wie bestimmte Dinge in Angular gemacht werden. Gestern hatten wir im Speaker Panel einen Teilnehmer, der angesprochen hat, wie alles in Vue.js aussehen würde. Diese Diversität ist unfassbar gut. Dass wir nicht nur mit React-Entwicklern zusammen sitzen, sondern in den Pausen und am Abend auch mit Angular-Entwicklern und mit Entwicklern, die kein Framework benötigen, sondern alles mit Play und JavaScript machen. Dass man all diese Entwickler an einem Ort hat, ist sehr hilfreich an der Stelle.

Mirko Hillert: Christian, Elmar, ich danke euch für das Interview!

 

Interviewt von: Mirko Hillert

Mirko Hillert verantwortet seit 2007 als Leiter der Entwickler Akademie den Trainingsbereich bei Software & Support Media. Er studierte Betriebswirtschaft an der Westsächsischen Hochschule Zwickau und der Universidad Valencia sowie Marketing an der Westfälischen Wilhelms-Universität Münster. Als ehemaliger Dozent und Ausbilder für Managementprozesse treibt er seit vielen Jahren die fundierte Aus- und Weiterbildung von Entwicklern und Softwarearchitekten im IT-Markt voran, unter anderem mit innovativen Eventformaten und hochwertigen Trainingsinhalten.

Immer auf dem Laufenden bleiben!
Alle News & Updates: