Hi, have you met Flutter? - Fémo 09-02-19

Flutter e' il nuovo framework di Google per creare applicazioni native per Android ed iOs usando una singola codebase. Flutter si distingue per performance native, Interfaccia utente flessibile ed uno sviluppo veloce grazie all'hot reload.

In questo evento impareremo le basi di Flutter attraverso un codelab. Per affrontare il codelab non sono necessarie conoscenze preliminari di Flutter e Dart ma bastera' avere familiarita' con i concetti base della programmazione ad oggetti come variabili, cicli, condizioni, eccetera.

Transcript

1. Hi, have you met ?
2. AGENDA ▸ A brief introduction to Flutter ▸ Codelab Part 1 ▸ Codelab Part 2 ▸ Q&A / Discussion
3. WHO I AM MARCO GOMIERO - Computer Engineer - Software Engineer @ Uniwhere - Co-Leader @ GDG Venezia FOLLOW ME:
 " twitter.com/marcoGomier " github.com/prof18 " marco.gomiero.93@gmail.com " marcogomiero.com
5. https://www.meetup.com/it-IT/pro/gdg/
7. WHAT IS FLUTTER?
8. “FLUTTER ALLOWS YOU TO BUILD BEAUTIFUL NATIVE APPS ON IOS AND ANDROID FROM A SINGLE CODEBASE.” https://flutter.io/
9. WHAT IS FLUTTER? ▸ A framework to build apps for iOS and Android, from a single codebase ▸ Made by Google
10. https://gcemetery.co/
11. WHAT IS FLUTTER? ▸ A framework to build apps for iOS and Android, from a single codebase ▸ Made by Google ▸ Open Source ▸ Dart
12. FLUTTER FEATURES Fast Development Expressive and Flexible UI Native Performance
13. Fast Development ▸ Hot Reload ▸ State is maintained during builds ▸ Thanks to a mix of Ahead-of-time (AOT) and Just-In-Time (JIT) compilation
14. FLUTTER FEATURES Fast Development Expressive and Flexible UI Native Performance
15. Expressive and Flexible UI ▸ Material Design and Cupertino widgets ▸ Smooth scrolling ▸ Platform awareness
16. FLUTTER FEATURES Fast Development Expressive and Flexible UI Native Performance
17. Native Performance ▸ Native Scrolling ▸ Native Navigation ▸ Native Icons ▸ Native Fonts
 -> Full Native Performance
18. FLUTTER FRAMEWORK AND ENGINE Framework (Dart) Engine (C++) Skia Dart Text Material Cupertino Widgets Rendering Animation Painting Gestures Foundation
19. EVERYTHING IS A WIDGET! ▸ Structural Element (Button, Menu …)
20. ▸ Structural Element (Button, Menu …)
21. EVERYTHING IS A WIDGET! ▸ Structural Element (Button, Menu …) ▸ Stylistic Element (Font, Color Scheme ..)
22. ▸ Stylistic Element (Font, Color Scheme ..)
23. EVERYTHING IS A WIDGET! ▸ Structural Element (Button, Menu …) ▸ Stylistic Element (Font, Color Scheme ..) ▸ Aspect of Layout (Padding, Align ..)
24. ▸ Aspect of Layout (Padding, Align ..)
25. EVERYTHING IS A WIDGET! ▸ Structural Element (Button, Menu …) ▸ Stylistic Element (Font, Color Scheme ..) ▸ Aspect of Layout (Padding, Align ..) …
26. https://flutter.io/docs/development/ui/widgets
27. HELLO WORLD
28. STATELESS WIDGET ▸ Immutable State: all the properties can’t change
29. STATEFUL WIDGET ▸ Mutable State
31. CODELAB PART 1 ▸ How to write a Flutter app that looks natural on both iOS and Android. ▸ Basic structure of a Flutter app. ▸ Finding and using packages to extend functionality. ▸ Using hot reload for a quicker development cycle. ▸ How to implement a stateful widget. ▸ How to create an infinite, lazily loaded list. https://codelabs.developers.google.com/codelabs/first-flutter-app-pt1/
32. CODELAB PART 2 ▸ How to add interactivity to a stateful widget. ▸ How to create and navigate to a second screen. ▸ How to change the look of an app using themes. https://codelabs.developers.google.com/codelabs/first-flutter-app-pt2/
33. USEFUL LINKS ▸ https://flutter.io/docs ▸ https://eu.udacity.com/course/build-native-mobile-apps-with-flutter--ud905 ▸ https://itsallwidgets.com/ ▸ https://pub.dartlang.org/packages/ ▸ https://www.youtube.com/watch?v=PLHln7wHgPE ▸ https://www.youtube.com/watch?v=RS36gBEp8OI ▸ http://fluttersamples.com/
36. USEFUL LINKS (2) ▸ https://medium.com/flutter-io/hummingbird-building-flutter-for-the-web- e687c2a023a8 ▸ https://github.com/google/flutter-desktop-embedding
37. HAPPY CODING http://bit.ly/flutter-femo