Was ist neu in Ionic 6?

18 Feb Was ist neu in Ionic 6?

Ionic 6 wurde im Dezember 2021 veröffentlicht und bringt viele Verbesserungen und eine Hand voll neuer Komponenten, aber keine „revolutionären“ Neuigkeiten. Das wiederum hat den Vorteil, dass ein Upgrade von Ionic 5 auf Ionic 6 im Normalfall schnell und unkompliziert funktioniert. Entwickler können die Schritt-für-Schritt-Anleitung (Migration Guide) für Angular, Vue oder React durchgehen, und so ihre Apps auf Plattform v6 aktualisieren.

Diese Version des Open-Source-Toolkits zur Erstellung von Hybrid-Apps und Progressive Web Apps (PWA) auf Basis von HTML5, CSS, Sass und JavaScript/TypeScript bietet verbesserte Desktop-Unterstützung, überarbeitete Komponenten, iOS- und Android-Designänderungen und vieles mehr!

In diesem Video sprechen Mike und Liam von Ionic über die Neuerungen in Ionic 6 und geben auch eine Anleitung für Programmierer mit den wichtigsten Schritten, die zum Update notwendig sind:

Die wichtigsten Neuerungen

• Design-Änderungen:
  • iOS: Neuer „Refresher“ Style sowie aktualisierte Toolbar und „modal styles“ für Dark Mode.
  • iOS: Neue „collapse“ Option für ion-header und ion-footer
  • Android: Die Styles für Input-Felder und ion-select wurden an die Material Design Guidelines angepasst
• Komponenten:
  • Bottom Sheet (neu!)
  • Datetime (neu!)
  • Accordion (neu!)
  • Breadcrumbs (neu!)
  • Select (verbessert)
  • Popover (kann jetzt auch deklarativ in Komponenten verwendet werden)
  • Item (verbessert)
• Performance and Tooling
  • Custom Elements
  • Unterstützung für Vite, Rollup, and ESBuild
• Vue Routing
• Platform Detection Customization
• TypeScript Verbesserungen (Custom Event Interfaces)

Fazit

Zusammengefasst kann man sagen, dass Ionic 6 mit Datetime („Kalender“) und Bottom Sheet („Bottom Drawer“) zwei lange erwartete neue Komponenten mit sich bringt, die es noch einfacher machen, Apps bzw. PWAs cross-platform mit einer UX zu entwickeln, die nativen Apps für Android und iOS um nichts nach steht! Ich rate jedem Entwickler bzw. Freelancer, der eine App mit Ionic 5 im Einsatz hat, diese auf Ionic 6 zu aktualisieren, um von den Neuerungen profitieren zu können. Für ein Upgrade von Version 4 auf 6 wird empfohlen zuerst ein Update auf Version 5 zu machen, die Version der App gut zu testen, und erst danach auf Version 6 zu gehen.