Boehrsi.de - Blog

Vor wenigen Tagen erschien im Rahmen des Flutter 2.0 bzw. Dart 2.12 Releases der stabile Null Safety Support für Dart. Entsprechend begab ich mich gestern Abend das erste Mal auf den Migrationspfad und aktualisierte meine kleine Anwendung zur Auswertung von Statistiken. Selbige nutze ich produktiv zum erfassen der Nutzerzahlen hier im Blog und auch um die monatlichen Top 10 Listen zu erstellen.
Die Migration ist sehr gut dokumentiert open_in_new und was extrem großartig ist, ist der dart migration Befehl, welcher versucht ein Projekt ohne Null Safety für euch anzupassen. Dabei erhält man einen geführten Prozess, bei welchem ihr die Liste der geplanten Änderungen auf einer interaktiven lokalen Website zu sehen bekommt und dort noch weitere Anpassungen vornehmen könnt. Meiner Meinung nach ist dieses Tool im Kontext der Migration eine glatte Eins mit Sternchen.
Nachdem ausführen der Migration für das kleine Projekt mit ca. 1000 Zeilen reinem Code, blieb tatsächlich nur eine Stelle an der ich manuell Hand anlegen musste. Die App lief anschließend ohne Probleme und weiterer Aufwand war nicht nötig. Hier kommt nun aber eine Empfehlung, die mehr Arbeit bedeutet, selbige meiner Meinung nach aber wert ist.

• Dart Null Safety Migration Guide open_in_new
• Null safety in Flutter open_in_new
• Flutter Website open_in_new

Weiter geht es heute mit meiner kleinen Newssammlung zum Thema Boehrsi.de Statusseite. Heute geht es noch einmal um den reinen Code und wie ich die eigentliche UI erstellt habe. Während die folgenden Beiträge sich eher auf das Setup und Deployment beziehen. Bei Fragen stehe ich wie gewohnt gerne Rede und Antwort in den Kommentaren.
Das Thema Design ist für mich ein spezielles, da ich nicht sonderlich kreativ bin, aber trotz dessen versuche gut aussehende User Interfaces zu erstellen. Ich setze dabei meist auf Minimalismus und den Fokus auf den Content. Generell baue ich fast alles von Grund auf selbst, doch bei diesem Projekt habe ich einen anderen Weg eingeschlagen. Aus verschiedenen Gründen wollte ich weitere Erfahrungen zum Thema Bulma sammeln und entschied mich aus diesem Grund wieder für das CSS Framework.

• Bulma Website open_in_new
• Boehrsi.de-Status GitHub Repository open_in_new

Es gibt wieder was auf den Sehnerv, denn ein neues Humble Book Bundle ist verfügbar. Das Humble Book Bundle: Pocket Reference Guides by O’Reilly bringt euch über 250 $ an Büchern zu diversen Programmiersprachen. Das Bundle ist noch ca. zwölf Tage lang verfügbar und bietet euch unter anderem den SQL Pocket Guide, Java Pocket Guide und Linux Pocket Guide.
Die Inhalte sind auf drei Stufen aufgeteilt, wobei ihr wie gewohnt schon ab 1 € einsteigen könnt. Alle 15 Bücher erhaltet ihr ab 14,89 €. Eine gut gemischte Lieferung von Coding-Inhalten würde ich sagen, was denkt ihr? Alle Humble Bundle Links sind Affiliate- / Partner-Links die meinen Blog unterstützen.

• Humble Book Bundle: Pocket Reference Guides by O'Reilly open_in_new

Wer im Dart / Flutter Kontext mit Streams arbeitet hat hin und wieder etwas umfangreichere Anforderungen, als das was Dart von Haus aus mitbringt. Denn obwohl der Stream Support in Dart durchaus gut ist, fehlt z.B. die Möglichkeit Streams zusammenzuführen oder Events zu sammeln / zu verwerfen (Debounce).
Dieses Problem lässt sich natürlich einfach lösen, denn es gibt verschiedene Packages die Darts Stream Support erweitern. Sehr gerne wird hier zu RxDart gegriffen, einer bekannten und umfangreichen Library. Ich selber habe z.B. mit dem Java Ableger RxJava gearbeitet und sehr gute Erfahrungen gemacht. Entsprechend ist RxDart natürlich auch ein gangbarer Weg. Aber man muss ja nicht immer gleich mit Kanonen auf Spatzen schießen, denn selbiges wird vor allem gerne auf Stack Overflow gerne mal empfohlen.
Dabei gibt es für einfache Aufgaben das Paket stream_transform, welches direkt von den Dart Entwicklern kommt und eine Reihe kleiner und gezielt anwendbarer Utility Methoden mitbringt. Mit stream_transform könnt ihr Streams buffern oder debouncen, sie kombinieren oder anders manipulieren. Am Ende sind es nur ca. 20 Methoden, welche aber diverse Fälle abdecken, ohne einen gigantischen Footprint in eurem Code zu hinterlassen. Ich bin ein Freund davon sich nur ins Haus zu holen was man auch braucht. Entsprechend war ich froh für meinen Einsatzzweck - Debounce von Events für eine Suchfunktion – mit stream_transform das Problem schnell und einfach lösen zu können.
Wie erwähnt habe ich allerdings auch gar nichts gegen RxDart und wenn man umfangreichere Aktionen im Bereich Streams durchführt ist man mit RxDart vermutlich auch besser bedient, hier geht es ausschließlich darum das richtige Tool für die richtige Aufgabe zu nutzen.

• stream_transform auf pub.dev open_in_new
• RxDart auf pub.dev open_in_new

Zusammen mit der vorgestern erschienenen Flutter 2.0 Version gibt es auch neues externes Tooling von 3rd-Party Anbietern. Die Continuous Integration und Continuous Delivery (CI/CD) Plattform Codemagic open_in_new hat ein kleines feines neues online Tool veröffentlicht, welches unter pub.green open_in_new erreichbar ist.
Selbiges hat als Ziel die Kompatibilität und Funktionalität von bekannten und viel genutzten Flutter Plugins mit diversen Flutter Versionen zu verifizieren. Sinn und Zweck ist es euch schnell und einfach zu zeigen ob ihr ein Plugin nutzen könnt oder ob es Probleme gibt.
Falls ihr gerne auch mal auf dem Flutter Beta oder Dev Branch unterwegs seid, um neue Features direkt aus erster Hand zu bekommen, dann sind solche Informationen einiges Wert. Denn man spart sich Zeit und Arbeit, wenn man von vornherein weiß ob die gewählten Plugins laufen. Werft also ruhig mal einen Blick auf die neue Plattform.

• pub.green Website open_in_new
• Flutter Website open_in_new

Ich nutze Flutter bereits seit langem und entsprechend schaute ich mir natürlich auch das gestrige Flutter Engage Event an. Die Neuigkeiten sind umfangreich und sehr positiv. Ich werde hier entsprechend nur die größeren Neuerungen anreißen und alle weiteren Informationen findet ihr wie gewohnt in den Related Links.
Flutter 2.0 wurde im Rahmen des Events nicht nur angekündigt, sondern auch direkt auf dem Stable Channel veröffentlicht. Dieses Update ist gemäß der Versionierung ein Major Update und bietet entsprechend auch große Änderungen. Flutter unterstützt nur Android, iOS, Web und Desktop in der stabilen Version. Der Desktop Support ist dabei zwar noch im Beta Status, kann aber direkt vom Stable Channel aus genutzt werden.
Auch Dart hat ein Upgrade erhalten und ist nun in Version 2.12 verfügbar. Dieses bringt euch unter anderem Dart FFI (Foreign Function Interface) Support, welcher einen einfachen und direkten Weg zu in C geschriebenen Plattformfunktionen ebnet. Ebenfalls neu ist der nun enthaltene Sound Safe Null Support, welcher ohne Probleme parallel mit unsicherem Code genutzt werden kann, wodurch die Migration wesentlich einfacher werden dürfte.

• Flutter Release Infos im Flutter Blog open_in_new
• Dart Release Infos im Dart Blog open_in_new
• Flutter Engage Event Seite open_in_new
• Flutter Website open_in_new

Auch wenn immer mehr Webseiten auf komplexe Ansätze und moderne Frameworks setzen, so bleiben grundlegende HTML, CSS und JavaScript Kenntnisse ein Muss. Genau selbige könnt ihr euch im Rahmen des Humble Software Bundle: Learn Front-End Web Development holen oder vertiefen.
Das Bundle ist noch 18 Tage lang verfügbar und bietet diverse Inhalte aus dem genannten Bereich. Ab 1 € könnt ihr auf der ersten Stufe einsteigen und um die finale dritte Stufe zu erreichen sind 16,46 € nötig. Unter anderem könnt ihr euch Creating Offline-first Mobile Apps with HTML5, Creating Page Layouts with CSS und Optimizing and Deploying a Website sichern.
Auch wenn ich in diesem Bereich schon einiges gemacht habe und relativ aktiv bin, so überlege ich trotzdem zuzuschlagen. Denn im Web-Development Kontext gibt es extrem viele Bereiche und entsprechend viele Wege sich fortzubilden. Alle Humble Bundle Links sind Affiliate- / Partner-Links die meinen Blog unterstützen.

• Humble Software Bundle: Learn Front-End Web Development open_in_new

Ich habe in den letzten Monaten häufiger mit Bulma im Kontext der Webentwicklung gearbeitet und das Open-Source-CSS-Framework zusammen mit Hugo, dem Static Site Generator meiner Wahl, genutzt. Resultat ist unter anderem meine Status Website open_in_new. Dieses kleine Projekt hat aber noch ein paar mehr Eigenheiten, denn abseits der eigentlichen Entwicklung nutzte ich bei diesem Projekt das erste Mal umfangreicher GitHub Actions fürs Deployment und GitHub Pages open_in_new fürs Hosting.

• Hugo Website open_in_new
• Boehrsi.de-Status GitHub Repository open_in_new

Libraries machen das Leben von Entwicklern einfacher, denn man muss nicht alles selber schreiben und kann sich auf die eigentlichen Features einer Anwendung konzentrieren. Allerdings gibt man auch Kontrolle und Übersicht ab und entsprechend kann man sich Probleme einhandeln.
Um externe Abhängigkeiten automatisch auf dem neusten Stand zu halten gibt es Dependabot. Früher war Dependabot eine eigenständige Firma, mittlerweile ist man bei GitHub untergekommen, was die dortige Integration natürlich noch einfacher macht. Außerdem ist der Dienst nun komplett kostenlos.
Vor allem auf Sicherheitsupdates weißt Dependabot hin, denn häufig integriert man Abhängigkeiten, aktualisiert selbige aber nicht solange alles läuft. Dabei gehen Sicherheitsprobleme in den Abhängigkeiten natürlich unter. Im Fall eines erkannten Updates wir einfach ein Pull Request erstellt und alles folgt dem gewohnten Flow.
Unterstützt werden unter anderem Ruby, JavaScript, Python, Java (Gradle / Maven), .NET und Docker. Leider ist Dart und somit auch Flutter aktuell noch nicht mit von der Partie und soweit ich es erkennen kann ist derzeit auch nicht geplant das sich dies ändert. Das ist zwar sehr schade, aber durch die pub.dev open_in_new Plattform und das Tooling drum herum, kann man den Prozess der Überprüfung auf Updates hier zumindest teilautomatisiert umsetzen.

• Dependabot Dokumentation open_in_new
• Dependabot Website open_in_new
• GitHub Website open_in_new

Auch wenn ich auf meinem Server ein On-Premise Git Setup habe, welches kleine Aufgaben automatisiert übernimmt, so habe ich mittlerweile immer mehr GitHub Repositories und auch solche wollen automatisiert werden.
Für diese Zweck bietet GitHub mit seinem Actions Setup eine sehr gute und flexible Lösung, welche euch nicht nur viel Arbeit abnehmen kann, sondern auch sehr einfach zu nutzen ist. Aufgrund der Größe der Plattform gibt es bereits jetzt extrem viele Actions, die ihr nur eurem Repository hinzufügen müsst und schon geht es los. Ich nutze GitHub Actions z.B. um für meine Status Seite open_in_new (GitHub Repository open_in_new) automatisiert nach einem Push die Build und Deploy Schritte auszuführen.

• GitHub Actions open_in_new
• GitHub Marketplace open_in_new
• GitHub Website open_in_new