- Client
- GrN.dk — flutter.grn.dk
- Sector
- Flutter / mobil- og webapps
- Periode
- juli–august 2026
At a glance
flutter.grn.dk er en hylde med tredive små cases, én pr. Flutter-pakke, der er værd at kende — routing, state management, animation, diagrammer, kort, lagring, i18n — og hver af dem er en levende demo, som den besøgende kan pille ved, med koden ved siden af og rigtige apps, der bruger pakken. Der er ingen skærmbilleder af Flutter på sitet: sitet er selv Flutter-appen, kompileret til web, med en rigtig URL pr. case, en side bag hver URL, som søgemaskiner kan læse, og en 3D-»casepark«, hvor hver case har sin egen stand.
The challenge
Flutter på nettet har et ryproblem: ét stort canvas, ingen rigtige URL’er, intet for en søgemaskine at læse og demoer, der dør, i samme øjeblik en pakke opdateres. En portefølje for Flutter-arbejde skulle modbevise det i mediet selv — dybe links, der opfører sig som links, en tilbage-knap, der virker, metadata pr. case, som en crawler kan indeksere — og samtidig være ærlig om, hvad hver pakke er god til, uden at opfinde brugere. Og den skulle kunne vokse: de tredive cases blev skrevet i fire omgange over to måneder, så at tilføje én skulle være en post i et register, ikke en ombygning.
The solution
Ét register (kCases) driver alt: forsiden, routeren, tællingerne, sitemappet og parken. Hver case er en fil med demo-widgetten, et afsnit om hvorfor det betyder noget, kodeeksemplet og en liste over eksempler fra virkeligheden — brugere nævnes kun, hvor deres egen pubspec eller en leverandørpublikation bekræfter det, ellers formuleret som et mønster med link til den officielle dokumentation; en test sikrer, at hver case har mindst to, alle https, ingen dubletter. Deploy-scriptet bygger appen, genererer en statisk HTML-side pr. case med egen titel, beskrivelse, Open Graph-tags og kanonisk URL, synkroniserer til serveren, genindlæser den, tømmer CDN-cachen og tjekker hver URL — også at en opdigtet stadig giver 404.
Parken (/world) er et frit hub-landskab tegnet med én CustomPainter og almindeligt perspektiv — ingen 3D-pakke, for ingen af dem er pålidelige på Flutter web endnu — med seks zoner afledt af casenes tags og én plakatstand pr. case; en ny case sætter selv sin stand op.
The results
Tredive cases live, hver med en delbar URL og en ordentlig side bagved, 32 URL’er i sitemappet og en testsuite, der fejler, hvis en case er forkert bygget, et eksempel mangler eller registret skrider. Forsidens »i pipelinen«-afsnit skjuler sig selv, når køen er tom — og det er den — og næste omgang sættes i kø med én streng.
Det er den anden halvdel af Flutter-historien på dette site: Mit Håndværk-casen handler om at få en app ud i to butikker, denne om, hvad der går ind i at bygge én.
