SlideShare ist ein Scribd-Unternehmen logo
Flutter 101
Eine kleine Einführung
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)
Über uns: Das Team
hinter coodoo
https://coodoo.de
Unser Team
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
Consulting Produkte
HALBZEIT.app Alarmcloud
Workhorse
Unsere Arbeit
https://coodoo.de
Über Flutter
Was ist Flutter?
“Flutter is Google’s UI toolkit for
building beautiful, natively
compiled applications for mobile,
web, and desktop from a single
codebase.”
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.
Ein Framework hebt ab
Sucheingaben auf Google von 2014 bis 2019
Ein Framework hebt ab
Sternvergabe für Flutter auf Github
https://github.com/flutter/flutter
73.554
Ein Framework hebt ab
2 Flutter Meetups pro Tag
finden durchschnittlich auf
der ganzen Welt statt.
Flutter: Beispiele
Google Adwords
10.000.000 Downloads
Alibaba
50.000.000 Downloads
Hamilton Musical
500.000 Downloads
Reflectly
500.000 Downloads
Flutter: Wie bekomm ich es?
https://flutter.dev/docs/get-started/install
https://flutter.de/artikel/flutter-entwicklungsumgebung-einrichten.html
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
Zeit zum Davonfluttern :)
Dart: Basiswissen
● 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.)
Dart: Programmiersprache (in 2min.)
Dart: Eigenheiten
Dart: Packages
https://pub.dev
Flutter: Basiswissen
Cross-Platform Landscape
Cross-Platform Framework:
1.Generation
Cross-Platform Framework:
2.Generation
Cross-Platform Framework:
Flutter
https://hackernoon.com/whats-revolutionary-about-flutter-946915b09514
Everything is a Widget
https://flutter.dev/docs/reference/widgets
Layouts
https://flutter.dev/docs/reference/widgets
Inputs
https://flutter.dev/docs/reference/widgets
Dialogs
https://flutter.dev/docs/reference/widgets
Flutter: Der Widget-Baum
Flutter: Der Widget-Baum
Flutter: Web/Flutter Syntax
● Eine Sprache für die gesamte Logik
● Einfaches Debugging (One Debugger, Formatter)
● Easy Code Refactoring (Try refactoring HTML/CSS)
Warum keine Markup-Syntax?
Flutter: Base Widgets
Testen wir unser neues
Wissen!
Flutter: Ausblick
Flutter: Mind-Blowing
https://fuchsia.dev/fuchsia-src/glossary
Web, Desktop: Erste Prototypen
https://flutter-widget-livebook.blankapp.org/basics/introduction/
Web, Desktop: Erste Prototypen
https://www.nytimes.com/games/prototype/kenken
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
Bootcamp: Proof of concept (48h)
Java Developer JavaScript Developer
Text to Speech Pong Game
Fazit
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
Flutter.de
https://flutter.de
Join the Community
Meetup: meetup.com/de-DE/Rhein-Main-Flutter-Meetup
Website: https://flutter.de
Slack: Flutter-de
Twitter: @flutter_de
Wie geht’s weiter?
24.10.2019
Flutter: It’s all about Widgets
Vielen Dank!

Weitere ähnliche Inhalte

Was ist angesagt?

Flutter
Flutter Flutter
Flutter
Mohit Nainwal
 
Flutter frame work
Flutter frame workFlutter frame work
Flutter frame work
samash
 
Flutter introduction
Flutter introductionFlutter introduction
Flutter introduction
SheilaJimenezMorejon
 
Getting started with flutter
Getting started with flutterGetting started with flutter
Getting started with flutter
rihannakedy
 
Introduction to Flutter.pptx
Introduction to Flutter.pptxIntroduction to Flutter.pptx
Introduction to Flutter.pptx
DiffouoFopaEsdras
 
Flutter
FlutterFlutter
flutter.school #HelloWorld
flutter.school #HelloWorldflutter.school #HelloWorld
flutter.school #HelloWorld
Frederik Schweiger
 
Flutter vs React Native | Edureka
Flutter vs React Native | EdurekaFlutter vs React Native | Edureka
Flutter vs React Native | Edureka
Edureka!
 
Flutter Bootcamp
Flutter BootcampFlutter Bootcamp
Introduction to Flutter
Introduction to FlutterIntroduction to Flutter
Introduction to Flutter
Apoorv Pandey
 
DSC IIITL Flutter Workshop
DSC IIITL Flutter WorkshopDSC IIITL Flutter Workshop
DSC IIITL Flutter Workshop
DSCIIITLucknow
 
Hello Flutter
Hello FlutterHello Flutter
Hello Flutter
rihannakedy
 
Pune Flutter Presents - Flutter 101
Pune Flutter Presents - Flutter 101Pune Flutter Presents - Flutter 101
Pune Flutter Presents - Flutter 101
Arif Amirani
 
Flutter overview - advantages & disadvantages for business
Flutter overview - advantages & disadvantages for businessFlutter overview - advantages & disadvantages for business
Flutter overview - advantages & disadvantages for business
Bartosz Kosarzycki
 
What is Flutter
What is FlutterWhat is Flutter
What is Flutter
Malan Amarasinghe
 
Flutter A year of creativity!
Flutter A year of creativity!Flutter A year of creativity!
Flutter A year of creativity!
Ahmed Abu Eldahab
 
Flutter Intro
Flutter IntroFlutter Intro
Flutter Intro
Vladimir Parfenov
 
Flutter introduction
Flutter introductionFlutter introduction
Flutter introduction
Võ Duy Tuấn
 
Flutter beyond hello world
Flutter beyond hello worldFlutter beyond hello world
Flutter beyond hello world
Ahmed Abu Eldahab
 
Building beautiful apps using google flutter
Building beautiful apps using google flutterBuilding beautiful apps using google flutter
Building beautiful apps using google flutter
Ahmed Abu Eldahab
 

Was ist angesagt? (20)

Flutter
Flutter Flutter
Flutter
 
Flutter frame work
Flutter frame workFlutter frame work
Flutter frame work
 
Flutter introduction
Flutter introductionFlutter introduction
Flutter introduction
 
Getting started with flutter
Getting started with flutterGetting started with flutter
Getting started with flutter
 
Introduction to Flutter.pptx
Introduction to Flutter.pptxIntroduction to Flutter.pptx
Introduction to Flutter.pptx
 
Flutter
FlutterFlutter
Flutter
 
flutter.school #HelloWorld
flutter.school #HelloWorldflutter.school #HelloWorld
flutter.school #HelloWorld
 
Flutter vs React Native | Edureka
Flutter vs React Native | EdurekaFlutter vs React Native | Edureka
Flutter vs React Native | Edureka
 
Flutter Bootcamp
Flutter BootcampFlutter Bootcamp
Flutter Bootcamp
 
Introduction to Flutter
Introduction to FlutterIntroduction to Flutter
Introduction to Flutter
 
DSC IIITL Flutter Workshop
DSC IIITL Flutter WorkshopDSC IIITL Flutter Workshop
DSC IIITL Flutter Workshop
 
Hello Flutter
Hello FlutterHello Flutter
Hello Flutter
 
Pune Flutter Presents - Flutter 101
Pune Flutter Presents - Flutter 101Pune Flutter Presents - Flutter 101
Pune Flutter Presents - Flutter 101
 
Flutter overview - advantages & disadvantages for business
Flutter overview - advantages & disadvantages for businessFlutter overview - advantages & disadvantages for business
Flutter overview - advantages & disadvantages for business
 
What is Flutter
What is FlutterWhat is Flutter
What is Flutter
 
Flutter A year of creativity!
Flutter A year of creativity!Flutter A year of creativity!
Flutter A year of creativity!
 
Flutter Intro
Flutter IntroFlutter Intro
Flutter Intro
 
Flutter introduction
Flutter introductionFlutter introduction
Flutter introduction
 
Flutter beyond hello world
Flutter beyond hello worldFlutter beyond hello world
Flutter beyond hello world
 
Building beautiful apps using google flutter
Building beautiful apps using google flutterBuilding beautiful apps using google flutter
Building beautiful apps using google flutter
 

Ähnlich wie Flutter 101 - eine kleine Einführung - Flutter Rhein-Main Meetup

Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Gregor Biswanger
 
Cross Plattform Apps mit Visual Studio und Apache Cordova
Cross Plattform Apps mit Visual Studio und Apache CordovaCross Plattform Apps mit Visual Studio und Apache Cordova
Cross Plattform Apps mit Visual Studio und Apache Cordova
Peter Hecker
 
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Gregor Biswanger
 
WTC 2019 – Flutter
WTC 2019 – FlutterWTC 2019 – Flutter
WTC 2019 – Flutter
webconia
 
Ueberlegungen Projektmanagement Web Applications
Ueberlegungen Projektmanagement Web ApplicationsUeberlegungen Projektmanagement Web Applications
Ueberlegungen Projektmanagement Web ApplicationsGünther Haslbeck
 
Hands-on Workshop: API-Dokumentation mit OpenAPI / Swagger in ASP.NET Core
Hands-on Workshop: API-Dokumentation mit OpenAPI / Swagger in ASP.NET CoreHands-on Workshop: API-Dokumentation mit OpenAPI / Swagger in ASP.NET Core
Hands-on Workshop: API-Dokumentation mit OpenAPI / Swagger in ASP.NET Core
Gregor Biswanger
 
Microsoft und die Open Source Community - Leaving the death star behind
Microsoft und die Open Source Community - Leaving the death star behindMicrosoft und die Open Source Community - Leaving the death star behind
Microsoft und die Open Source Community - Leaving the death star behind
Christian Heilmann
 
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
Jürgen Gutsch
 
Augmented Reality Workshop
Augmented Reality WorkshopAugmented Reality Workshop
Augmented Reality Workshop
argency
 
Django trifft Flutter
Django trifft FlutterDjango trifft Flutter
Django trifft Flutter
roskakori
 
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
DNUG e.V.
 
B3 Lotus Expeditor Und Composite Applications
B3 Lotus Expeditor Und Composite ApplicationsB3 Lotus Expeditor Und Composite Applications
B3 Lotus Expeditor Und Composite Applications
Andreas Schulte
 
Android Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickelnAndroid Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickeln
André Krämer
 
CSI: WP - Dem Windows Phone auf der Spur, Internetspecial: SDK & Development-...
CSI: WP - Dem Windows Phone auf der Spur, Internetspecial: SDK & Development-...CSI: WP - Dem Windows Phone auf der Spur, Internetspecial: SDK & Development-...
CSI: WP - Dem Windows Phone auf der Spur, Internetspecial: SDK & Development-...
Gordon Breuer
 
Mobile Anwendungen mit Apache Cordova
Mobile Anwendungen mit Apache CordovaMobile Anwendungen mit Apache Cordova
Mobile Anwendungen mit Apache Cordova
Yvette Teiken
 
Einstieg in Xamarin und Xamarin.Forms, DDC 2018
Einstieg in Xamarin und Xamarin.Forms, DDC 2018Einstieg in Xamarin und Xamarin.Forms, DDC 2018
Einstieg in Xamarin und Xamarin.Forms, DDC 2018
André Krämer
 
20091203 Peters Munich Talk1
20091203 Peters Munich Talk120091203 Peters Munich Talk1
20091203 Peters Munich Talk1
Carsten Book
 
DNUG ak-anwendungsentwicklung.18042011
DNUG ak-anwendungsentwicklung.18042011DNUG ak-anwendungsentwicklung.18042011
DNUG ak-anwendungsentwicklung.18042011
Ulrich Krause
 
Open Source und Free Software unter Windows
Open Source und Free Software unter WindowsOpen Source und Free Software unter Windows
Open Source und Free Software unter Windows
Martin Leyrer
 
Agiles Lernen und Software Entwicklung das OSGi Code Camp 2010
Agiles Lernen und Software Entwicklung das OSGi Code Camp 2010Agiles Lernen und Software Entwicklung das OSGi Code Camp 2010
Agiles Lernen und Software Entwicklung das OSGi Code Camp 2010Christian Baranowski
 

Ähnlich wie Flutter 101 - eine kleine Einführung - Flutter Rhein-Main Meetup (20)

Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
 
Cross Plattform Apps mit Visual Studio und Apache Cordova
Cross Plattform Apps mit Visual Studio und Apache CordovaCross Plattform Apps mit Visual Studio und Apache Cordova
Cross Plattform Apps mit Visual Studio und Apache Cordova
 
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
 
WTC 2019 – Flutter
WTC 2019 – FlutterWTC 2019 – Flutter
WTC 2019 – Flutter
 
Ueberlegungen Projektmanagement Web Applications
Ueberlegungen Projektmanagement Web ApplicationsUeberlegungen Projektmanagement Web Applications
Ueberlegungen Projektmanagement Web Applications
 
Hands-on Workshop: API-Dokumentation mit OpenAPI / Swagger in ASP.NET Core
Hands-on Workshop: API-Dokumentation mit OpenAPI / Swagger in ASP.NET CoreHands-on Workshop: API-Dokumentation mit OpenAPI / Swagger in ASP.NET Core
Hands-on Workshop: API-Dokumentation mit OpenAPI / Swagger in ASP.NET Core
 
Microsoft und die Open Source Community - Leaving the death star behind
Microsoft und die Open Source Community - Leaving the death star behindMicrosoft und die Open Source Community - Leaving the death star behind
Microsoft und die Open Source Community - Leaving the death star behind
 
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
 
Augmented Reality Workshop
Augmented Reality WorkshopAugmented Reality Workshop
Augmented Reality Workshop
 
Django trifft Flutter
Django trifft FlutterDjango trifft Flutter
Django trifft Flutter
 
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
 
B3 Lotus Expeditor Und Composite Applications
B3 Lotus Expeditor Und Composite ApplicationsB3 Lotus Expeditor Und Composite Applications
B3 Lotus Expeditor Und Composite Applications
 
Android Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickelnAndroid Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickeln
 
CSI: WP - Dem Windows Phone auf der Spur, Internetspecial: SDK & Development-...
CSI: WP - Dem Windows Phone auf der Spur, Internetspecial: SDK & Development-...CSI: WP - Dem Windows Phone auf der Spur, Internetspecial: SDK & Development-...
CSI: WP - Dem Windows Phone auf der Spur, Internetspecial: SDK & Development-...
 
Mobile Anwendungen mit Apache Cordova
Mobile Anwendungen mit Apache CordovaMobile Anwendungen mit Apache Cordova
Mobile Anwendungen mit Apache Cordova
 
Einstieg in Xamarin und Xamarin.Forms, DDC 2018
Einstieg in Xamarin und Xamarin.Forms, DDC 2018Einstieg in Xamarin und Xamarin.Forms, DDC 2018
Einstieg in Xamarin und Xamarin.Forms, DDC 2018
 
20091203 Peters Munich Talk1
20091203 Peters Munich Talk120091203 Peters Munich Talk1
20091203 Peters Munich Talk1
 
DNUG ak-anwendungsentwicklung.18042011
DNUG ak-anwendungsentwicklung.18042011DNUG ak-anwendungsentwicklung.18042011
DNUG ak-anwendungsentwicklung.18042011
 
Open Source und Free Software unter Windows
Open Source und Free Software unter WindowsOpen Source und Free Software unter Windows
Open Source und Free Software unter Windows
 
Agiles Lernen und Software Entwicklung das OSGi Code Camp 2010
Agiles Lernen und Software Entwicklung das OSGi Code Camp 2010Agiles Lernen und Software Entwicklung das OSGi Code Camp 2010
Agiles Lernen und Software Entwicklung das OSGi Code Camp 2010
 

Flutter 101 - eine kleine Einführung - Flutter Rhein-Main Meetup