Flutter BLoC State Management & Firebase [2026] From Scratch

Name: Flutter BLoC State Management & Firebase [2026] From Scratch
Rating: 4.6 (529 reviews)

Flutter BLoC Pattern and Firebase. Build Real App - Step By Step | Flutter

Created byMaftuna Zokirova

Last updated 6/2026

English

English [Auto],

What you'll learn

Flutter BLoC from scratch by step-by-step explanations
Make Amazing Tasks App [To Do App] Using Flutter BLoC State Management
Also you learn: Add task, Delete Task, Mark as Done/Undone, Mark as Favourite/Unfavourite, Restore Task, Clear Bin Folder, Change Theme ( Dark and Light )
Flutter Widgets such as: Drawer, PopupMenu, ExpansionPanel, BottomNavigationBar and so on...
Flutter Firebase works with Flutter Bloc

Course content

4 sections • 30 lectures • 3h 40m total length

The full Introduction of 'Tasks App with Flutter Bloc and Firebase' course3:15
We have updated the course adding new lectures about Flutter Bloc works with Flutter Firebase. You can watch the video to get a full demonstration of our 'Tasks App with Flutter Bloc and Firebase' course
Introduction of the Course (old)5:22
Introduction of the Tasks App made with Flutter BLoC

Introduction of Tasks App0:13
Download Initial Tasks App Project5:22
Part 1. Implementing Flutter BLoC and Hydrated BLoC36:15
Hi there, the version of the Hydrated Bloc is depricated. And we updated the course adding new Migration tutorial. It's in the 15th lecture.
Part 2. Implementing Drawer & Recycle Bin24:15
Build a drawer-driven interface with a recycle bin using Flutter BLoC to manage removal tasks, update a test counter, and navigate between test and bin screens via a router.
Part 3. Theme Changing: Dark & Light Modes11:22
Learn to implement dark and light theme switching in Flutter using bloc patterns, including a switch bloc, drawer integration, multi bloc provider, push replacement navigation, and hydration of theme state.
Part 4. Implementing Bottom Navigation Bar15:34
Implement a bottom navigation bar with tabs for pending, completed, and favorite tasks; move tasks between tabs on check, and show the floating action button only on the pending tab.
Part 5. Implementing Expansion Panel8:36
Part 6. Mark as Favorite, Edit Text and Restore Task25:50
Download Completed Course0:13
Hydrated Bloc ( v9.0.0 ) MIGRATION and fixed some bugs2:36
Wrap up0:08

Flutter BLoC & Flutter Firebase0:08
Flutter BLoC State Management with Firebase (All data will be saved on Firestore)
1) All the function above still works with Bloc, but saves data on Firestore
2) Besides above, User authentication is added in this section.

!!! IMPORTANT !!!
You must finish the previous sections before you start this one.
Because this section is advanced section.
If you skip the sections above, you might not understand the implementations of Flutter BLoC Pattern in this section.
So, I hight recommend to start from beginning.

All the best,
Your instructor, Maftuna.
Download Source code0:03
Download the initial lib folder and you will use it in the next lecture.
Install Firebase CLI for MacOS7:51
Install Firebase CLI for Windows OS8:07
Install firebase cli for windows and configure flutter project with firebase, including node.js setup, environment paths, and platform selection, then initialize firebase and add core package for android and ios.
Firebase User Authentication (Register and Sign In)5:03
Hi there!
In this part we will learn user Authentication to Firebase. Create a user on Firebase and Login to an account.
Reset User Password4:22
Hi there.
In this part, we will learn how to reset user password by the user email.
Error Handling Deep Dive2:05
Hi there!
In this part, we'll learn how to prevent app crashes due to incorrect email or password on the login and registration screen.
Splash Screen5:31
A splash screen is a launch screen, it is the first screen of the app that displays whenever the application is loading.
It checks user token, if it's available, then, it moves to Tabs Screen. Otherwise, it asks the user to log in.
Add & Get the Task on Firestore and the App12:43
Learn to add and fetch tasks in Firestore from a Flutter app using BLoC, building a Firestore repository with create and get functions and updating the UI.
Update Task (Making the Task as Done/Undone)2:55
Remove and Restore Task4:21
Remove tasks by marking them as deleted in Firestore and moving them to the bin, then restore by unmarking isDeleted, renewing created time, and ensuring the task is pending.
Delete one or All Tasks Permanently3:52
Marking a Task as Favorite1:49
Editing a Task2:13
Edit a task in Flutter using BLoC and Firebase by calling the update function and refreshing tasks with the get all task event.

Requirements

Beginning knowledge on Flutter and how it works
Knowledge of the Dart programming language

Description

Hi there!
Welcome to Flutter BLoC State Management & Firebase [2026] From Scratch!
This Full Course about Real Tasks App [To Do App] Using Flutter BLoC Pattern State Management And here you learn:

I. Flutter BLoC State Management with Hydrated Bloc (Hydrated Bloc saves data on local storage)
1) Add tasks - You can add a new task with its description and the task remains there even if you do hot-reload or hot-restart because of Hydrated BLoC.
2) Delete Task - You can Delete a Task and that task moves to Recycle Bin folder of the App.
3) Mark as Done/Undone - when you've done a task, it moved to Completed Tasks Tab or vice versa.
4) Mark as Favourite/Unfavourite - you can mark a task as a favorite and you can find that task in the Favorites Tab.
5) Restore Task - you can restore a task and that task re-appears in the Pending Tasks Tab.
6) Clear Bin Folder - There is a ''Clear All Tasks'' button in the Recycle Bin folder, it deletes all tasks and clears the Recycle Bin folder.
7) Change Theme (Dark and Light) - In the Drawer, there is a switch, by which you can change the App Theme into Dark and Light mode.
Flutter Widgets such as:
- Drawer
- Popup Menu
- Expansion Panel
- Bottom Navigation Bar
and many other Flutter widgets.

II. Flutter BLoC State Management with Firebase (All data will be saved on Firestore)
1) All the function above still works with Bloc, but saves data on Firestore
2) Besides above, User authentication is added in the last section.

I hope you enjoy the course.

Who this course is for:

Flutter Developer who wants to learn Flutter BLoC Pattern from scratch, step by step
Developers who want to build apps with Flutter using BLoC State Management

Flutter BLoC State Management & Firebase [2026] From Scratch

What you'll learn

Explore related topics

Course content

Introduction2 lectures • 9min

Beginning part of Flutter BLoC3 lectures • 21min

Tasks App Using Flutter BLoC11 lectures • 2hr 10min

Flutter BLoC with Firebase14 lectures • 1hr 1min

Requirements

Description

Who this course is for: