Our meet-up will be focused on the basics of Flutter and introducing Flutter to existing mobile/web developers and curious developers on this exciting technology that is shaping the way mobile development will happen in the future.
Talks:
* Speaker: Arif Amirani (CTO MetroGuild Inc, Ex Directi/Veritas)
* Duration: 45 mins
* Agenda:
** Introduction to Flutter
** Comparison to Flutter/React Native/Native
** (Intro) Life Cycle of Widgets
** (Intro) State management
** Build a simple app using Flutter App in 15 mins
4. “Flutter is Google’s UI toolkit
for building beautiful,
natively compiled
applications for mobile,
web, and desktop from a
single codebase
4
5. Why Flutter?
◦ Beautiful UI
◦ Control every pixel on the screen
◦ Never say "no" to your designer
◦ Stand out in the marketplace
◦ Beautiful animations
◦ Standard (Tween, etc) and Physics-based
5
6. Why Flutter for Developers?
◦ Fast
◦ 60fps
◦ Compiled to native code
◦ Productive
◦ Sub-second reload times (JIT vs AOT)
◦ Iterate rapidly on features
◦ Single-codebase for faster collaboration
◦ Vibrant community & growing
6
7. Flutter is Unique
◦ Compiles to Native Code (ARM Binary code)
◦ No reliance on OEM widgets
◦ No bridge needed
◦ No mark-up language (only Dart)
7
12. Flutter Embedders
12
Google Fuchsia
Fuchsia is a capability-based, real-
time operating system (RTOS)
currently being developed by
Google.
No more Java/Dalvik/Oracle
◦ Android
◦ iOS
◦ Desktop
◦ Web
◦ Raspberry Pi
◦ Android Things
13. Daaaaa…Dart?
◦ Open-source web programming
language developed by Google. (By the
guy who wrote v8 – Lars Bak)
◦ Class-based, single-inheritance with
mixins, object oriented language with C-
style syntax.
◦ Supports interfaces, abstract classes,
reified generics, and strong typing
13
16. Widgets everywhere
◦ Widgets are immutable
◦ Declarations of parts of
the UI
◦ Like a <div>
◦ A structural element like
a button, menu
◦ A stylistic element like a
font, theme
◦ Part of layout like
padding, center
16
24. Most common widgets
◦ Text, Image, Icon – Basic widgets
◦ Container - The div of Flutter UI. It's a convenience widget
that allows you to add padding, alignment, backgrounds,
force sizes on widgets, and boatloads of other things. It also
takes up 0px space when empty, which comes in handy.
◦ Row, Column – Flex rule based
◦ Stack - A stack displays a list of children on top of one and
other.
◦ Scaffold - This is the root of every page in your app, which
gives your app a basic layout structure. It makes it easy to
implement bottom navigations, appBars, back buttons, etc.
24
25. Stateful vs Stateless Widgets
25
BuildContext Class is nothing else but
a reference to the location of a Widget
within the tree structure of all the
Widgets which are built.
36. 36
Thanks!
MetroGuild Pune is hiring!
Flutter/Python/ReactJS Developers
You can find me at:
◦ https://www.linkedin.com/in/arifamirani/
◦ @kontinuity