Book Image

Managing State in Flutter Pragmatically

By : RAHUL AGARWAL, Waleed Arshad
Book Image

Managing State in Flutter Pragmatically

By: RAHUL AGARWAL, Waleed Arshad

Overview of this book

Flutter is a cross-platform user interface (UI) toolkit that enables developers to create beautiful native applications for mobile, desktop, and the web with a single codebase. State management in Flutter is one of the most crucial and complex topics within Flutter, with a wide array of approaches available that can make it easy to get lost due to information overload. Managing State in Flutter Pragmatically is a definitive guide to starting out with Flutter and learning about state management, helping developers with some experience of state management to choose the most appropriate solutions and techniques to use. The book takes a hands-on approach and begins by covering the basics of Flutter state management before exploring how to build and manipulate a shopping cart app using popular approaches such as BLoC/Cubit, Provider, MobX, and Riverpod. Throughout the book, you'll also learn how to adopt approaches from React such as Redux and all its types. By the end of this Flutter book, you'll have gained a holistic view of all the state management approaches in Flutter, and learned which approach is the best solution for managing state in your app development journey.

Related Content you might be interested in

Current Title:

Small book image
Managing State in Flutter Pragmatically
RAHUL AGARWAL | Waleed Arshad
Nov, 2021 | 246 pages
Small book image
Google Flutter Mobile Development Quick Start Guide
Salvatore Giordano | Prajyot Mainkar
Mar, 2019 | 152 pages
Small book image
Taking Flutter to the Web
Damodar Lohani
Oct, 2022 | 206 pages
Small book image
Cross-Platform UIs with Flutter
Ryan Edge | Alberto Miola
Aug, 2022 | 260 pages
Table of Contents (14 chapters)
Preface
Preface
Who this book is for
What this book covers
To get the most out of this book
Download the example code files
Download the color images
Conventions used
Get in touch
Share Your Thoughts
1
Section 1:The Basics of State Management
Section 1:The Basics of State Management
Free Chapter
2
Chapter 1: States and State Management Overview
Chapter 1: States and State Management Overview
Flutter – a brief introduction
What is a state?
Importance of a state in an application
What is state management?
Choosing the best technique for your application
Summary
3
Chapter 2: The Core Building Blocks of State Management
Chapter 2: The Core Building Blocks of State Management
Technical requirements
Managing states within a widget with setState
Inherited widgets – injecting the state at the root
Inherited models – optimizing inherited widgets
Summary
4
Section 2:Types, Techniques, and Approaches
Section 2:Types, Techniques, and Approaches
5
Chapter 3: Diving into Advanced State Management Approaches
Chapter 3: Diving into Advanced State Management Approaches
Technical requirements
Provider – using less boilerplate code than InheritedWidget
Riverpod – enhancing Provider
BLoC – writing business logic separately
Cubit – simplified BLoC
Summary
6
Chapter 4: Adopting State Management Approaches from React
Chapter 4: Adopting State Management Approaches from React
Technical requirements
Redux – using unidirectional data flow
MobX – using observables with the fewest lines of code
Summary
7
Chapter 5: Executing Distinctive Approaches Like GetX, GetIt, and Binder
Chapter 5: Executing Distinctive Approaches Like GetX, GetIt, and Binder
Technical requirements
GetX – simplified reactions
GetIt – no BuildContext required
Binder – using scopes to separate business logic
Summary
8
Section 3:Code-Level Implementation
Section 3:Code-Level Implementation
9
Chapter 6: Creating a Shopping Cart Application Using Basic Approaches
Chapter 6: Creating a Shopping Cart Application Using Basic Approaches
Technical requirements
Creating a shopping cart application with setState
Creating a shopping cart application with InheritedWidget
Creating a shopping cart application with InheritedModel
Summary
10
Chapter 7: Manipulating a Shopping Cart Application through BLoC, Provider, and React-Based Approaches
Chapter 7: Manipulating a Shopping Cart Application through BLoC, Provider, and React-Based Approaches
Technical requirements
Creating a shopping cart application with BLoC
Creating a shopping cart application with Cubit
Creating a shopping cart application with Provider
Creating a shopping cart application with Riverpod
Creating a shopping cart application with Redux
Creating a shopping cart application with MobX
Summary
11
Chapter 8: Using GetX, GetIt, and Binder to Update the Cart Application
Chapter 8: Using GetX, GetIt, and Binder to Update the Cart Application
Technical requirements
Creating a cart app with GetX
Creating a cart app with GetIt
Creating a cart app using Binder
Summary
12
Chapter 9: Comparative State Management Analysis: When to Use What?
Chapter 9: Comparative State Management Analysis: When to Use What?
Technical requirements
Revisiting the techniques
Mapping different techniques to different application ideas
Summary
Why subscribe?
13
Other Books You May Enjoy
Other Books You May Enjoy
Packt is searching for authors like you

MobX – using observables with the fewest lines of code

MobX is just another sort of reactive state management library that allows you to connect your reactive data directly to your UI using observables. The best part about MobX is that it requires the least amount of code you will need to create your apps. It takes away a lot of boilerplate code from you and allows you to generate most of it using the build_runner command.

We will study the following concepts in MobX:

  • Observables
  • Actions
  • The Observer widget
  • The Build runner dependency for the autogeneration of boilerplate code

Let's jump into setting up dependencies to create our counterexample application.

Adding MobX, Build Runner, and Codegen dependencies to the sample app

Just like on every other occasion, create a new Flutter app through the command line:

flutter create any_name_you_wish

You will get the same counterexample application with a default setState widget implemented...

Previous Section
End of Section 4
Next Section