Intro to Google Flutter, its difference with other mobile cross programming languages, with some samples, conducted for the Flutter Study Jam, as a GDG Helwan activity, by Shady Selim

1. Intro to Flutter
/Helwan.GDG @ HelwanGDG
meetup.com/GDG-Helwan/
GDG Helwan

2. Speaker Bio
● Official Google Speaker
● GDG Helwan Founder & Leader
● Kotlin Cairo User Group Founder
● Mentor in Udacity Nanodegree
● Mobile & Web Evangelist
● Technology savvy
● Think tank
● UI/UX freak
www.linkedin.com/in/shadyselim/
@dr_Shady_Selim

3. Mobile OS

4. Linux Kernel and Device Drivers
Core OS
Core Services & Media
Cupertino Widget

5. IOS

6. Linux Kernel and Device Drivers
Libraries & Run Time
Applications & Framework
Material Design Widgets

7. Android

9. Native Approach (Single Platform)
Swift Kotlin

10. OEM SDKs
OEM Widgets
Cupertino
Material Design
Canvas
Events
Location Bluetooth
Camera Sensors
Java
Kotlin
Swift
Objective-c
Application
Services

11. Popular Cross Tools
Class A Class B

12. Class A
Web View
Canvas
Events
Location Bluetooth
Camera Sensors
JavaScript
HTML
CSS
Application
Services
Bridge

13. Canvas
Events
Location Bluetooth
Camera Sensors
Transferred
Native Code
Application
Services
FrameworklibrariesSDK
OEM Widgets
Cupertino
Material Design
Class B

14. What makes Flutter unique?
- Compiles to Native Code (ARM Binary code)
- No reliance on OEM widgets
- No bridge needed

15. Flutter Approach
Canvas
Events
Location Bluetooth
Camera Sensors
Native ARM
Binary
Code
Application
Services
Platform
Channels
Flutter Widgets
Cupertino
Material Design

16. So what is Flutter ?
Flutter is the next step in
App development
Speed and performance
Fast , smooth performance
Flexibility
Customize anything - Brand
first design
Native look and feel
Familiarity , ease of use
Rapid Development
Easy to learn , predictable

17. Flutter Architecture

18. What is Dart?
- Open-source web programming language developed by Google.
- Class-based, single-inheritance, object oriented language with C-
style syntax.
- Supports interfaces, abstract classes, reified generics, strong
typing (Dart 2).
- Next generation systems language (Fuchsia ‘Magenta’ – AdWords)
https://www.dartlang.org/community/who-uses-dart

19. Everything is a Widget with Flutter

20. Everything is a WidgetApp Widget
Material Widget
Scaffold Widget
Column
Container
Text
Button
Render Tree

21. https://flutter.io/widgets/

22. Great looking and fast animation

23. HTML/CSS Analogs in Flutter

24. Hot Reload

25. IDE Support ?

26. How To install ?
https://flutter.io/setup/

27. Easy Check !
$ flutter doctor

28. Questions!?