SwiftLille Meetup #5 - @mslimanii - Fast and Flutterious, live coding

Le développement d’applications mobiles laisse plusieurs possibilités en termes de technologie, le développement en natif pour de bonnes performances mais avec l’inconvénient de devoir développer deux applications (Android et iOS), ou les frameworks hybrides comme Ionic/ReactNative/Xamarin/… souvent au détriment d’une expérience utilisateur fluide.
Découvrez la puissance de Flutter lors de cette session de live coding.

Transcript

1. Ineat présentent Fast and Flutterious
2. #Flutter Lovers
3. #Flutter Lovers
4. Flutter Flutter vous permet de créer de belles applications natives sur iOS et Android à partir d’un seul code source
5. Flutter Flutter vous permet de créer de belles applications natives sur iOS et Android à partir d’un seul code source
6. Flutter History
7. Flutter History Janvier 2017 Lancement du repo Github Mai 2017 Première présentation
 Google IO 2017 Alpha v0.0.6 Mai 2018 Lancement du repo Github Ready for Production
 Beta 3th Release Septembre 2018 Release Preview 2 Décembre 2018 Flutter Live Event Lancement de la 1.0 Juin 2017 Mehdi se lance
 sur Flutter Juillet 2018 Première application Flutter en PROD
 chez Ineat Janvier 2020 1.14.X
8. Aujourd’hui développer une application mobile
9. Aujourd’hui développer une application mobile 1. SDK Natif ( 2 développements ) 2. Hybride / HTML ( Cordova, Ionic ) 3. Hybride natif ( NativeScript, React Native, … )
10. Aujourd’hui développer une application mobile
11. À quoi ressemble une application Flutter avec Dart ?
12. À quoi ressemble une application Flutter avec Dart ?
13. À quoi ressemble une application Flutter avec Dart ? Widget Widget Widget
14. Pourquoi ? • Langage Moderne • Types optionnels • Closures • Paramètres nommés ( title: « Dart », subtitle: « Flutter » ) • Async / Await • Extension method • Programmation réactive ( API Streams, map, skip, take, timeout … ) • JIT ( Just In Time, compilation à la volée dans une DartVM ) • Utile dans les phases de développement • Gain de temps • Code mis à jour en temps réel ( Hot Reload ) • AOT ( compiler sur plusieurs architectures ) • code optimisé à l’exécution • arm • arm64 • x86
15. Un riche catalogue de Widget
16. Un riche catalogue de Widget AbsorbPointer AlertDialog Align AnimatedBuilder AnimatedOpacity AppBar AspectRatio BackdropFilter BottomNavigationBar BottomSheet ButtonBar Card Center Checkbox Chip ClipOval ClipRect Column Container Divider Draggable Drawer DropdownButton Expanded ExpansionPanel FadeTransition FittedBox FlatButton FloatingActionButton Flow Logo FormField GestureDetector GridView Hero Icon IconButton Image ListTile ListView MaterialApp MediaQuery Navigator Opacity Padding PageView Radio RaisedButton RichText Row Scaffold Scrollbar
17. Live coding Développer un twitter light
18. Live coding Développer un twitter light +
19. Les écrans
21. Scaffold
22. Scaffold AppBar
23. Scaffold AppBar FloatingActionButton
24. Scaffold AppBar FloatingActionButton ListView
25. Scaffold AppBar FloatingActionButton Card, Column Tweet ListView
26. Scaffold AppBar FloatingActionButton Card, Column Tweet Row ( Image, Column, Text ) ListView
27. Scaffold AppBar FloatingActionButton Card, Column Tweet Text Row ( Image, Column, Text ) ListView
28. Scaffold AppBar FloatingActionButton Card, Column Tweet Image Text Row ( Image, Column, Text ) ListView
29. Scaffold AppBar FloatingActionButton Card, Column Tweet Image Like Text Row ( Image, Column, Text ) ListView
30. Scaffold AppBar FloatingActionButton Card, Column Tweet Image Like Text Row ( Image, Column, Text ) ListView ≈ 12 widgets
31. Let’s code !
32. Une application multiplateforme
33. Une application multiplateforme
34. Une application multiplateforme Et le web ?
41. Des références
43. Merci !!!