Cookie-Einstellungen

Bitte wählen Sie aus, welchen Cookie-Kategorien Sie zustimmen möchten.

Dotbite

Flutter: Zwei Fliegen mit einer Klappe

Was ist Flutter?

Flutter ist ein Frontend-Framework, das auf Dart basiert. Es nimmt den Dart-Code und übersetzt ihn superschnell in JavaScript, das natürlich plattformübergreifend ist. Wir mögen Flutter sehr, deshalb wollen wir in diesem Blog darüber sprechen.

Wir haben Flutter auf unserer ersten richtigen Geschäftsreise entdeckt. Damals, im Jahr 2019, wurden uns irgendwie Tickets für die WeAreDevelopers Conference in Berlin angeboten und wir dachten: "Warum nicht?" Die Reise entpuppte sich als ziemlich lohnend. Als wir bei der Google-Präsentation über das brandneue Flutter-Framework sahen und welche Apps bereits mit diesem Entwicklungskit realisiert wurden, waren wir total begeistert. Wir waren kurz davor, uns zu entscheiden, ob wir Quinn mit Swift und Java bauen sollten, entschieden uns dann aber dafür, Flutter auszuprobieren.

Das war eine der besten Entscheidungen, die wir je getroffen haben.

Material und Cupertino

Der größte Vorteil von Flutter ist, dass es plattformübergreifend ist.Das heißt, du brauchst nur eine Codebasis für alle Plattformen. Das heißt, du sparst 50 % der Entwicklungszeit für Apps, die du für iOS und Android entwickelst. Flutter vermeidet natürlich diese Namen, weil es Open-Source ist, und verwendet stattdessen "Material" und "Cupertino", um die jeweiligen UI-Elemente zu bezeichnen. Standardmäßig sehen deine Apps eher wie Android-Apps als wie iOS-Apps aus, denn auch für Android-Apps ist es Standard, "Material"-Design zu verwenden. Das Besondere an diesem plattformübergreifenden Devkit ist, dass du über spezielle Plugins auch native Funktionen wie Face ID oder Google Pay nutzen kannst.

Das Tolle daran ist, dass du trotz deiner Dart-Codebasis auch Teile von Swift- und Java-Code in deine Anwendung einbauen kannst. Jedes Flutter-Projekt ermöglicht es dir, sowohl das Swift- als auch das Java-Projekt zu bearbeiten. Das funktioniert auch andersherum. Wenn du willst, kannst du in Flutter ein Widget erstellen, das andere dann mit ihrem Paketmanager in ihre Android- und Swift-Apps integrieren können. Verrückt, oder?

Seit kurzem kann Flutter auch stabiles HTML ausgeben. Du kannst also eine Homepage, eine iOS-App und eine Android-App in einem Framework erstellen. Damit sind es drei Vögel! (Falls du dich an die Überschrift erinnerst. Außerdem, was für eine schreckliche Redewendung! Anstatt mit Steinen auf Vögel zu werfen, könntest du hier deinen eigenen Dash Avatar erstellen).

Alles ist ein Widget

... außer Tabellenzeilen. Das hat uns einiges an Nerven gekostet. Aber zurück zu den positiven Aspekten: Die leicht verständliche Widgetisierung von Funktionen und Elementen macht die Entwicklung elegant.

Aber was bedeutet das? Das ist ziemlich einfach: Alles, was du auf deinem Bildschirm sehen kannst, ist ein Widget. Das heißt, jede Komponente, Unterkomponente, Unter-Unter-Unterkomponente und so weiter. Wenn du diesem einfachen Prinzip folgst, wird die Erstellung des Frontends sehr intuitiv, da du dich immer auf die Abstraktion eines Widgets verlassen kannst. Außerdem kannst du dir dieses Muster zunutze machen und deine eigene "Widget"-Klasse erstellen, von der deine Komponenten erben können, was dir noch mehr Freiheit gibt. Wir haben das aus Gründen der Fehlersuche gemacht, aber es gibt unzählige Möglichkeiten.

Brutzelnd heiß

Hot Reload ist eine tolle Funktion, mit der du deine App nahtlos während der Programmierung testen kannst. Bei anderen Devkits musst du einen Neustart durchführen, um die vorgenommenen Änderungen in deiner App zu sehen. Hier kannst du die Änderungen innerhalb der Build-Methoden eines bestehenden Widgets sofort sehen. Abgesehen von der offensichtlichen Praktikabilität, deinen Code in Echtzeit zu testen, lädt dich das dazu ein, mit deinen Designs zu experimentieren, was für deine Kreativität hervorragend ist. Dies ist eine Funktion, die du vielleicht von React- oder Vue-Apps kennst. Immer, wenn du auf "Speichern" drückst, fügt das Framework nur die Teile in den Editor ein, die aktualisiert werden müssen. So war es noch nie so einfach, ein Layout zu erstellen.

https://www.youtube.com/watch?v=sgPQklGe2K8

🔥🔥🔥

Ein weiterer Vorteil von Flutter, das zur Google-Familie gehört, ist die eingebaute Unterstützung für Firebase. Die Plattform ist ein echtes Kraftpaket, das sich um das gesamte Backend deiner App kümmern kann: Du kannst sie als Datenbank, als Push-WebSocket und für viele andere Aufgaben nutzen. Wir nutzen Firebase hauptsächlich für Nutzerstatistiken ("Wie oft wurde die App von unseren Nutzern geöffnet?") und Benachrichtigungsdienste für unsere gemeinnützige App Hilfma ("Ein Helfer in deiner Nähe wurde gefunden!"). Ein Vorteil, der nicht übersehen werden sollte: Es ist kostenlos (solange du keine Premium-Funktionen wie maschinelles Lernen brauchst) und damit ziemlich gut für aufstrebende Unternehmen geeignet.

Projekte

Wir haben Quinn und Hilfma mit Flutter entwickelt. Beide Apps laufen auf Android und iOS, und die Entwicklungszeiträume für beide Apps waren sehr knapp bemessen, wenn auch aus unterschiedlichen Gründen. Für Quinn konnten wir in nur drei Wochen einen voll funktionsfähigen Prototyp der App bereitstellen, während wir bei Hilfma weniger als einen Monat nach dem Schreiben der ersten Codezeile bereits über 5.000 aktive Nutzer in der Live-App hatten. Was beide Projekte gemeinsam haben, ist der Fokus auf eine klare und leicht verständliche Benutzeroberfläche. Die Arbeit mit Flutter hat es uns ermöglicht, bequeme Umgebungen für verschiedene Endnutzer zu schaffen. Auf diese Weise hat Flutter uns eine Menge Zeit gespart, was das Beste ist, was man über ein Tool sagen kann.

Ready to connect the dots?

Hi, ich bin Emir, CEO und Mitgründer von Dotbite.

Du hast eine interessante Idee für ein digitales Projekt und suchst einen Sparringspartner, der die Herausforderung gemeinsam mit dir angeht?

Dann bist du bei uns genau richtig.