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
Alberto Miola | Ryan Edge
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

Creating a shopping cart application with Redux

Create a new Flutter application named cart_redux and copy item.dart into your lib folder, as we have been doing in the previous sections. Add dependencies for equatable and flutter_redux from pub.dev. Let's get started, as follows:

  1. Create a new file named actions.dart and add the following code to it:
    import 'item.dart';
class Actions {}
class AddItemToCartAction extends Actions {
  final Item item;
  AddItemToCartAction({required this.item});
}
class RemoveItemFromCartAction extends Actions {
  final Item item;
  RemoveItemFromCartAction({required this.item});
}

    Both of these actions are self-explanatory; we will be using these to trigger the addition/removal of items to and from the cart.

  2. Create a file named cart_state.dart and add the following code to it:
    import 'package:equatable/equatable.dart';
import 'package:redux/redux.dart';
import 'actions...
Previous Section
End of Section 7
Next Section