Need help with multiple-counters-flutter?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

bizz84
131 Stars 39 Forks MIT License 35 Commits 4 Opened issues

Description

Flutter State Management [ setState ❖ StreamBuilder ❖ scoped_model ❖ redux ]

Services available

!
?

Need anything else?

Contributors list

# 4,397
Dart
Flutter
iOS
in-app-...
35 commits

Flutter State Management

This is a sample app showing four different approaches to managing state in Flutter:

setState
vs
StreamBuilder
vs
scoped_model
vs
redux

Use case: manage multiple counters, synced with Firebase Database.

Watch my video for a full overview of the differences and tradeoffs between these techniques:

Supported tasks:

  • Show a list of counters
  • Add new counters
  • Increment or decrement existing counters
  • Remove counters (swipe left to dismiss)

Database

The app uses Firebase as a source of truth for the state of the counters. This allows the data to be easily synced across multiple clients. Realtime Database and Cloud Firestore are both supported (see

database.dart
class).

NOTE: For simplicity, the whole database has public read/write access, and counters can't be set per-user. For a production app it would be more appropriate to set user access rules.

State management

The same functionality is replicated in four different pages accessible via the bottom navigation bar, using different state management techniques:

Running the project

You need to register the project with your own Firebase account.

  • Use

    com.musevisions.multipleCountersFlutter
    as your bundle / application ID when generating the Firebase project.
  • Download the

    ios/Runner/GoogleService-Info.plist
    and
    android/app/google-services.json
    files as needed.

For more articles and video tutorials, check out Coding With Flutter.

License: MIT

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.