Cross-Plattform-Entwicklung mit Ionic 4, Stencil und Capacitor, Teil 1

Mit Version 4 hat sich Ionic nach Angular auch für die Frameworks React und Vue.js geöffnet. Grund genug, es sich im Detail anzusehen.

Werkzeuge  –  14 Kommentare

Ionic ist ein generisches UI-Framework zur einfachen Entwicklung von Apps mit Webtechniken. Die Ionic-Gründer sind vor einigen Jahren mit der Vision gestartet, Entwickler beim Erstellen mobiler Web-Apps zu unterstützen, die sich für Endanwender wie native Apps der jeweiligen Plattform darstellen. Für die ersten drei Versionen des Frameworks war Ionic noch zu einigen technischen Kompromissen gezwungen und stark an das JavaScript-Framework Angular gebunden. Mit Version 4 hat man sich mit Web Components von dieser Historie gelöst. Was das bedeutet und welche Möglichkeiten Ionic und die Schwesterprojekte Stencil und Capacitor nun bieten, betrachtet dieser Artikel.

Was bisher geschah

Wer heute Ionic einsetzt, wird in Support-Foren und bei der Suche nach Blogbeiträgen und Tutorials im Internet vor die Herausforderung gestellt, jeweils zuzuordnen, auf welche Version sich ein Beitrag bezieht. Das kann für Einsteiger verwirrend sein und lässt sich besser nachvollziehen, wenn man die Versionshistorie von Ionic kennt. Das Team hinter Ionic begann 2012 mit der Arbeit an einem UI-Framework für die Erstellung mobiler Apps. Am Anfang hatten sie noch das Ziel, die UI-Komponenten für alle damals verbreiteten Frontend-Frameworks anzubieten. Neben Angular 1 waren das Backbone und Knockout.js.

Schnell mussten sie allerdings feststellen, dass dies zu drei verschiedenen Versionen des Ionic-Frameworks geführt hätte, die sie separat mit hohem Aufwand hätten entwickeln müssen. Da Angular 1 zu der Zeit massiv an Popularität gewann, war die Entscheidung naheliegend, sich nur darauf zu konzentrieren.

Im November 2013 erschien das erste Alpha-Release, im Mai 2015 schließlich die finale Version 1.0. Auf Basis von Angular 1 konnten Anwender mit Ionic 1 mobile Apps mit Webtechniken erstellen. Auch in der ersten Version brachte Ionic schon einen eigenen Router und Funktionen wie Page-Transitions mit. Die Integration mit Cordova zur Kapselung als native App übernahm das Ionic Command Line Interface (CLI) weitgehend automatisch, was insbesondere für Anfänger ein großer Vorteil war und bis heute ist.

Als sich mit Angular 2 viele Konzepte änderten, war auch das Ionic-Team gezwungen, Ionic 2 auf Basis davon neu zu entwickeln. Ionic 2 erschien Anfang 2017 und setzte zwar auf die neue Version des JavaScript-Frameworks, enthielt aber eigene Build-Tools und einen eigenen Router, da man damals die Angular-eigene Lösung für (noch) nicht geeignet hielt. Schon im März 2017 erschien Ionic 3 auf Basis von Angular 4. Ionic 3 wird weiterhin gewartet und ist noch sehr verbreitet.