State management in Flutter

Slide 1

Slide 1 text

State Management In Flutter Jacqueline Kendi @kendyjaky FLUTTER INREACH CAMPUS EDITION BY :FLUTTER DEVELOPERS KENYA

Slide 2

Slide 2 text

What is Flutter? - Google’s mobile SDK - Creates native Android and iOS apps - Builds cross platform apps in record time - Uses Dart language

Slide 3

Slide 3 text

Why is Flutter cool? - Fast cross platform development - Perform native experience - Lots of built in widgets - Application performance using Dart (AOT and JIT) - Hot reload - Device compatibility. Its native widgets allow applications to remain compatible from iOS 8 and Android Jelly Bean, API 16

Slide 4

Slide 4 text

What you need to get started - IDE ❖ Android Studio ❖ Visual studio code ❖ IntelliJ ❖ Command line - Dart and Flutter plugins - Flutter SDK (ﬂutter.dev)

Slide 5

Slide 5 text

Widgets - Basic building blocks of a Flutter app’s UI, hence everything is a widget - Immutable - All the ﬁelds are ﬁnal unless you want to make changes.

Slide 6

Slide 6 text

Stateless and stateful widgets Stateless Widget - It is immutable meaning that all values are ﬁnal and cannot be changed Stateful Widget - Require a mutable state - Maintain state that may change during the app’s lifecycle

Slide 7

Slide 7 text

State management State - Data that changes over a life cycle of an app. Why should it be managed? - To avoid soul crushing bugs that only happen at runtime. - To optimize performance.

Slide 8

Slide 8 text

Widget packaged in Flutter used to manage sate. - Stateful Widget- has setState method that you can call to repaint the widget - Stateful builder - Easier way to handle local state as it doesn’t require two classes and a decent amount of boilerplate - Stream builder - used to manage global state for its ﬂexibility, provides separation of concerns and it feels intuitive. - Inherited Widget - provide context to every widget below it in

Slide 9

Slide 9 text

Block Pattern - Similar to inherited widget but more intuitive and scalable for state management. Scoped Model - Set of utilities that allow you to pass data from parent widget down to its children. -the model class -ScopedModel class -ScopedModel descendant

Slide 10

Slide 10 text

ReduX - De facto state management in ReactJS. Its widgets include: - StoreProvider - StoreBuilder - StoreConnector

Slide 11

Slide 11 text

Provider - It’s a mixture between DI and Sate management. - It guarantees: - Maintainability - Testability/ compatibility - Robustness

Slide 12

Slide 12 text

Firebase - Sate with backend - Provides a very powerful stream based state management library by persisting your data to the cloud. - Solves most complex requirements like - User auth - Database persistence - Remote conﬁg

Slide 13

Slide 13 text

No content

Slide 14

Slide 14 text

THANK YOU! For more info check: Flutter.dev Flutter Developers KE Flutter university