Flutter State Management: Movie App with Provider, Riverpod, flutter_bloc
Alternatives To Movie_app_state_management_flutter
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
Bloc10,2232101642 days ago112August 14, 202287mitDart
A predictable state management library that helps implement the BLoC design pattern
Getx8,25619210 days ago310August 08, 2022798mitDart
Open screens/snackbars/dialogs/bottomSheets without context, manage states and inject dependencies easily with Get.
Provider4,6846153127 days ago59May 22, 202218mitDart
InheritedWidgets, but simple
2 days ago109mitDart
A simple way to access state while robust and testable.
Mobx.dart2,25332474 days ago112September 20, 202264mitDart
MobX for the Dart language. Hassle-free, reactive state-management for your Dart and Flutter apps.
Flutter Boilerplate Project1,877
5 months ago29mitDart
A boilerplate project created in flutter using MobX and Provider.
3 months agoMakefile
Design pattern designed to standardize your projects with GetX on Flutter.
Flutter Provide7632923 years ago3February 22, 201910otherDart
A simple framework for state management in Flutter.
States_rebuilder4781123 months ago78June 13, 20229otherDart
a simple yet powerful state management technique for Flutter
Cubit44563 years ago18July 06, 2020mitDart
Cubit is a lightweight state management solution. It is a subset of the bloc package that does not rely on events and instead uses methods to emit new states.
Alternatives To Movie_app_state_management_flutter
Select To Compare

Alternative Project Comparisons

Flutter State Management: Movie App with Provider, Riverpod, flutter_bloc & more

This reference project shows how to implement a (Netflix-inspired) movie app with different state management techniques in Flutter:

Movie app preview

The project uses the TMDB API to fetch a list of movies, and includes features such as pagination and local storage.

Running the project

Before running, see instructions on how to get a TMDB API key.

Also, make sure to run on Flutter beta channel.

App Overview

The application is composed by three primary screens: Now Playing, Favourites and Profiles.

On first launch, the app asks the user to create a profile.

The Now Playing page loads a list of current movies from the TMDB API. Results are paginated and scrolling to the bottom causes the next page to be loaded.

Each movie shows as a poster using the image URL retrieved from the API. You can tap on the icon to add a movie as a favourite (for the selected profile), and this preference is persisted to local disk.

Open the Favourites page to see the list of favourites for the currently selected profile.

Use the Profiles page to create additional profiles and update the currently selected profile (this is inspired by the Netflix UI).


  • "Now Playing" movies (with pagination)
  • Save favourites to watch list
  • Multiple profiles (like Netflix)
  • Local data persistence (movies, favourites, profiles) with Sembast

Combining these features together makes for an interesting case study about state management in Flutter.

App Structure

This app was made to compare and contrast multiple state management approaches. A highly composable architecture has been designed to enable this.

The project folders are structured like this:

  ... and more

Each folder inside apps is a Flutter project that implements the same app with a specific state management package.

All common functionality lives in packages/core. This includes a TMDB API wrapper, along with model classes with supporting serialization code where needed.

The persistence folder contains a DataStore abstract class that is used by all apps, along with a concrete SembastDataStore class to read and write data to local storage (using Sembast as a NoSQL database).

The ui folder contains all the custom widgets that are shared by all apps. These widgets do not hold any business logic and are designed to show the app UI and expose callbacks for the application code to plug into (much like the built-in Flutter widgets).

All the logic lives inside the apps themselves. All apps have exactly the same folders:


The business logic and screen flows are identical for each app, but the semantics change depending on which state management package is used. This makes it easy to compare and constrast different solutions.

Supported state management solutions

The current state management solutions are currently supported:

I plan to add more in the future (PRs welcome!).

Future Roadmap

  • Add more screens
  • Polish the UI

Feel free to open issues if you'd like certain features to be implemented (though keep your expectations low, I'm doing this for free after all ).

Other packages in use

The "core" package of the app uses the following packages:

Getting a TMDB API key

This project uses the TMDB API to get the latest movies data.

Before running the app you need to sign up on the TMDB website, then obtain an API key on the settings API page.

Once you have this, create an .env file inside packages/core/, and add your key:

// .env

Then, run the code generator:

flutter pub run build_runner build --delete-conflicting-outputs

This will generate a env.g.dart file inside packages/core/lib/api, that is used when making requests to the TMDB API.

Congratulations, you're good to go.

Note: Loading images from insecure HTTP endpoints

The data returned by the TMBD API points to image URLs using http rather than https. In order for images to load correctly, the following changes have been made:


Created a file at android/app/src/main/res/xml/network_security_config.xml with these contents:

<?xml version="1.0" encoding="utf-8"?>
    <base-config cleartextTrafficPermitted="true" />

Added this to the application tag in the AndroidManifest.xml:



Add the following to ios/Runner/info.pList:


More information here:


Since macOS applications are sandboxed by default, we get a SocketException if we haven't added the required entitlements. This has been fixes by adding these lines to macos/Runner/DebugProfile.entitlements and macos/Runner/Release.entitlements:


More info here:


This project was inspired by flutter_architecture_samples by the Flutter community.


Popular Flutter Projects
Popular State Management Projects
Popular User Interface Categories
Related Searches

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.
State Management