Die Veranstaltung 'Flutter 101' bietet eine Einführung in Flutter, ein UI-Toolkit von Google zur Entwicklung plattformübergreifender Anwendungen aus einer einzigen Codebasis. Die Agenda umfasst Themen wie die Möglichkeiten von Flutter, die Entwicklung von Prototypen und eine Networking-Gelegenheit mit Pizza und Getränken. Teilnehmer erfahren, wie sie mit Flutter beginnen können und welche Ressourcen und Unterstützung die Community bietet.

1. Flutter 101
Eine kleine Einführung

2. Agenda
● Was ist dieses Flutter und warum sollte ich es lernen? (10 min)
● Was kann ich mit diesem Flutter cooles machen? (45 min)
● Was mache ich jetzt mit diesem Wissen? (5 min)
● Austausch, Pizza und Getränke (bis 21 Uhr)

3. Über uns: Das Team
hinter coodoo

4. https://coodoo.de
Unser Team

5. https://coodoo.de
Unsere Speaker
Markus ist Gründer von coodoo
und verantwortlich für agiles
Projektmanagement und Scrum
orientierte Softwareentwicklung.
markus.kuehle@coodoo.de
Markus Kühle, GF
Jan ist ebenfalls Gründer und Experte
für kundenorientiertes UI/UX,
insbesondere unter Verwendung von
Flutter und Angular.
jan.marsh@coodoo.de
Jan Marsh, GF

6. Consulting Produkte
HALBZEIT.app Alarmcloud
Workhorse
Unsere Arbeit
https://coodoo.de

7. Über Flutter

8. Was ist Flutter?
“Flutter is Google’s UI toolkit for
building beautiful, natively
compiled applications for mobile,
web, and desktop from a single
codebase.”

9. Flutter hilft das eigene Branding
und Design in einer mobilen
App zu verwirklichen ohne
Abstriche machen zu müssen.
Für wen eignet sich Flutter?
Design Prototyp Entwicklung
Prototypen lassen sich in
Rekordzeit erstellen. Man
erhält in extrem kurzer Zeit
eine klickbare App.
Entwickler profitieren von
einer sehr guten IDE
Unterstützung, großer Auswahl
von Widgets und weiteren
Features wie z.B. Hot Reload.
Dem eigenen Branding
steht nichts im Weg.
Die Hürde zum Einstieg in
die Entwicklung sinkt.
Entwicklung von Features
steht im Vordergrund.

10. Ein Framework hebt ab
Sucheingaben auf Google von 2014 bis 2019

11. Ein Framework hebt ab
Sternvergabe für Flutter auf Github
https://github.com/flutter/flutter
73.554

12. Ein Framework hebt ab
2 Flutter Meetups pro Tag
finden durchschnittlich auf
der ganzen Welt statt.

13. Flutter: Beispiele
Google Adwords
10.000.000 Downloads
Alibaba
50.000.000 Downloads
Hamilton Musical
500.000 Downloads
Reflectly
500.000 Downloads

15. Flutter: Wie bekomm ich es?
https://flutter.dev/docs/get-started/install
https://flutter.de/artikel/flutter-entwicklungsumgebung-einrichten.html

16. Flutter: Kurzes Cheatsheet!
flutter create app Erstellt eine neue Flutter-App
--template = app, plugin, package
--sample = id of scaffold
--list-samples = json output filename
flutter doctor Prüft ob dein Setup korrekt ist
flutter install Installiert die App und alle Abhängigkeiten der pubspec
flutter devices Show a list of connected devices
flutter run Startet eine Debug Version der App
--release = Startet eine Release Version der App
-d = Id des gewünschten Device
flutter upgrade Automatisches Updaten der Flutter Installation
flutter build Baut ein Release für Android & iOS
flutter channel Welche Flutter Version gerade genutzt wird

17. Zeit zum Davonfluttern :)

18. Dart: Basiswissen

19. ● Open-Source Web Programmiersprache von Google
● 2011 veröffentlicht, 2014 standardisiert (ECMA 408), aktuell 2.4.0
● Kompiliert in ARM and x86 Code, Dart VM & Javascript Cross-Compiler für
Webapps
● Features
○ Strongly Typed (Type Checking)
○ Klassen, Abstrakte Klassen, Interfaces, Mixins
○ Functions
○ Getter & Setter
○ Lambda’s
○ Async/Future
○ Generics
Dart: Programmiersprache (in 2min.)

20. Dart: Programmiersprache (in 2min.)

21. Dart: Eigenheiten

22. Dart: Packages
https://pub.dev

23. Flutter: Basiswissen

24. Cross-Platform Landscape

25. Cross-Platform Framework:
1.Generation

26. Cross-Platform Framework:
2.Generation

27. Cross-Platform Framework:
Flutter
https://hackernoon.com/whats-revolutionary-about-flutter-946915b09514

28. Everything is a Widget
https://flutter.dev/docs/reference/widgets

29. Layouts
https://flutter.dev/docs/reference/widgets

30. Inputs
https://flutter.dev/docs/reference/widgets

31. Dialogs
https://flutter.dev/docs/reference/widgets

32. Flutter: Der Widget-Baum

33. Flutter: Der Widget-Baum

34. Flutter: Web/Flutter Syntax

35. ● Eine Sprache für die gesamte Logik
● Einfaches Debugging (One Debugger, Formatter)
● Easy Code Refactoring (Try refactoring HTML/CSS)
Warum keine Markup-Syntax?

36. Flutter: Base Widgets

37. Testen wir unser neues
Wissen!

38. Flutter: Ausblick

39. Flutter: Mind-Blowing
https://fuchsia.dev/fuchsia-src/glossary

40. Web, Desktop: Erste Prototypen
https://flutter-widget-livebook.blankapp.org/basics/introduction/

41. Web, Desktop: Erste Prototypen
https://www.nytimes.com/games/prototype/kenken

42. Flutter: Lernkurve
React-Native, NativeScript, PhoneGap... Flutter
3. Party Plugins + Framework Updates
Basiswissen Java, C#, C++ vorhanden
Time Time
Komplexität
Komplexität
Basiswissen Skriptsprache JS, Python, PHP vorhanden

43. Bootcamp: Proof of concept (48h)
Java Developer JavaScript Developer
Text to Speech Pong Game

44. Fazit

45. Warum sollte ich es lernen?
● Gleicher Quellcode, mehrere Plattformen
● Riesen UI-Bibliothek (Widgets)
● Stateful Hot Reload macht die Entwicklung extrem schnell
● Open Source erleichtert den Einstieg
● Wachsende Community

46. Flutter.de
https://flutter.de

47. Join the Community
Meetup: meetup.com/de-DE/Rhein-Main-Flutter-Meetup
Website: https://flutter.de
Slack: Flutter-de
Twitter: @flutter_de

48. Wie geht’s weiter?
24.10.2019
Flutter: It’s all about Widgets

49. Vielen Dank!