Getting Started with Flutter for Mobile Development

In this session, we are going to have a look into flutter and how to get started.

Event : https://gdsc.community.dev/events/details/developer-student-clubs-kibabii-university-presents-getting-started-with-flutter-for-mobile-development/

Slides inspired by Danvick Miller

Transcript

1. Eric Muli UP & RUNNING WITH FLUTTER GDSC Lead : University Of Nairobi Organizer: Flutter Developers Kenya Android Developer @ Kweza Technologies
2. • Web/Mobile Consultant • Flutter Fanboy • Passionate about cross-platform development. • Native Java Android ~ 2011 • Intel XDK - 2013 • Ionic - 2016-2017 • NativeScript - 2017-18 • FLUTTER FOR LIFE Who am I
3. About Flutter Open-source, Maintained by Google Native Performance - 60 FPS Android, iOS, Web, Desktop(Mac, Windows, Linux), Fuschia* Dart Programming Language Expressive beautiful UIs - different screen sizes Cross-platform UI Toolkit for Developing Native Apps Productive - Hot Reload, Pre-built Widgets
4. What's Dart UI centric and Reactive Both JIT and AOT compilation Modern - Similar to both JS and Java / Kotlin Dart 1.0 was released on November 14th, 2013 by Google and was founded by Lars Bak and Kasper Lund. Compiles to Machine Code - Server, Mobile & Desktop Compiles to JavaScript (Similar to TS) - Using dart2js util
5. Why Dart Optimized for UI JIT-compiled code is slower at startup, but it can have better peak performance after it runs long enough for runtime optimizations to be applied. Modern Language with Familiar Concepts - fixes mistakes by other languages Fast on all platforms - Compiles to Machine Code AOT-compiled code is guaranteed to have fast startup and consistent runtime performance, with no latency during early runs.
7. Dart Ecosystem
8. Flutter / Dart Stats and Fun facts Github - Dart is the fastest growing language in 2019 - growing by up to 532% StackOverflow Survey 2019 - Flutter is the third most loved framework LinkedIn - Flutter is now the fastest growing skill among software engineers. . StackOverflow Survey 2019 - Dart entered the list of Most Loved Languages - 66%
9. How Ionic/Cordova Works
10. How ReactNative/NativeScript Works
11. How Native Apps Work
12. How Flutter Works
13. Flutter Benefits Same language shared between UI and Business Logic Native UI performance No depency on OEM Widgets Hot Reload with persistent state Single code base for multiple platforms
14. Flutter Architecture
15. Widgets Flutter's building blocks Contain a view's current configuration and state Describe what a view looks like Two types of Widgets: Stateful and Stateless Everything is a Widget
16. Stateless Widgets Does not involve mutable state. Only requires the view's configuration information and context Can be nested indefinitely
17. Stateful Widgets A widget that has mutable state. Mutable State: • Can be read synchronously when the widget is built • Might change during the lifetime of the widget Enscure state is promptly notified when such state changes - using setState method Useful when the part of the UI being described can change dynamically via user input or other events
18. Who's Using Flutter
19. Tooling & Community • Easy integration with IntelliJ, AndroidStudio & VS Code • Plugins for different editors including Sublime Text, Vim, Eclipse, Atom, Emacs, etc. • DevTools - Flutter Inspector, Timeline view, Memory view, Performance view • CLI Tools • New tools - Widgets Studio, • Vibrant community accross the Globe on almost all platforms: Including Github, Twitter, StackOverflow, Gitter, Discord, Medium, Slack, YouTube
20. Resources • Website: https://flutter.dev • Documentation: https://flutter.dev/docs, • Plugins: https://pub.dev • Dart https://dart.dev/docs • Youtube: Flutter Channel (Widget of the Week & Flutter in Focus Playlists), WhatsupCoders, MTECH Viral, Reso Corder, Paul Halliday.
21. DEMO TIME!
22. @muli_eriq /EricRootLee Get in Touch