
Explore the essential role of provider in Flutter state management, why it remains the recommended baseline, and how it compares with other approaches like bloc, riverpod, and redux.
Explore flutter provider essentials through hands-on apps, including todo, weather, and firebase authentication, using change notifier, proxy, multi provider, stream, and state notifier patterns with real-world access and error handling.
Explore vscode tools and extensions for Flutter and Dart development, including Dart and Flutter extensions, Awesome Flutter Snippet, and pubspec assist, with a provider overview.
Explore provider overview, covering why provider, types, usage for state management, action processing with addListener of ChangeNotifier, while creating 17 apps and using Equatable and Dart data class generator extension.
Understand why Flutter provider supports state management and how it provides tools without enforcing method, illustrating counter and increment flow through widgets A, B, and C and inversion of control.
Explore managing app state without provider by lifting the counter to MyHomePage, passing it through middle widgets to CounterA and CounterB, and rebuilding the UI with setState on increment.
Learn how provider transforms Flutter state management by enabling easy access to non-widget data and methods through the widget tree, avoiding excessive rebuilds and inversion of control.
Use the provider package to inject a Dog model and access it with Provider.of(context), while learning to prevent rebuilds with listen: false and trigger updates via setState.
Learn how ChangeNotifier provides a change notification API, register listeners with addListener, and call notifyListeners to update listeners, including an app example without provider and the lead toward ChangeNotifierProvider.
ChangeNotifierProvider creates a ChangeNotifier and provides it to widgets, rebuilding the UI when it changes. Access it via Provider.of with listen options for efficient state management and dependency injection.
discover how extension methods simplify using provider in flutter by replacing provider.of with context.read, context.watch, and context.select, enabling selective listening and improved performance.
Use MultiProvider to simplify nesting of multiple change notifier providers, replacing deep widget trees. Explore other provider options like FutureProvider and StreamProvider in the provider package.
Learn how future provider handles asynchronous values with initial data and future resolution, including error handling, via a getBabies example returning int after a delay.
Explore using StreamProvider in Flutter to stream continuous values, compare it with FutureProvider, and implement a bark string stream from Dog and Babies with context.read and context.watch, plus Consumer.
Learn how the Consumer widget accesses a provider from an ancestor and passes its value to a builder, avoiding explicit Provider.of calls and enabling optimization with child.
Explore how to use provider with ChangeNotifier, implement Consumer and Builder patterns, handle ProviderNotFoundException, and compare Builder and Consumer approaches in a Flutter app.
Master the selector widget for fine-grained updates by filtering values, replacing consumer, and comparing to the select extension in provider usage.
Explore how to fix provider not found exceptions by using the Builder widget and extracting child widgets to access the Counter via ChangeNotifierProvider.
Explore provider access via anonymous routes and the value constructor in Flutter. Build a practical example with ChangeNotifierProvider, context, and navigator interactions.
Learn how to implement provider access with named routes in Flutter by wiring a Counter ChangeNotifier through ChangeNotifierProvider.value to MyHomePage and ShowMeCounter, with proper disposal.
Explore provider access in generated routes by configuring onGenerateRoute in MaterialApp, wiring the root and counter routes with ChangeNotifierProvider, and noting global access and ProxyProvider concepts.
Explore how ProxyProvider builds values from other providers and when to use it. Learn that create is optional, update is required, and how ActiveTodoCount demonstrates dependent value updates.
Understand the update callbacks for ProxyProvider and ProxyProvider2, including how previous values and multiple dependencies feed updates, and how ChangeNotifierProxyProvider synchronizes with external notifiers with best-practice guidance.
Explore how ProxyProvider and its variants work in flutter by building a counter app with a translations class, testing change notifier integrations, and observing UI updates.
Explore ProxyProvider usage by creating a Translations instance with a changing counter and displaying its title in ShowTranslations, then update with proxy updates so the UI rebuilds on counter changes.
Explore using create and update in ProxyProvider to modify Translations with a nullable update function, then implement a MultiProvider pattern to share a counter and create dependent Translations.
Explore proxy provider usage in Flutter by building a Counter ChangeNotifier, wiring updates with ChangeNotifierProvider and ChangeNotifierProxyProvider, and updating a Translations instance when the Counter changes.
Diagnose provider errors such as ProviderNotFoundException and wrong BuildContext with a Counter ChangeNotifier app using addPostFrameCallback, and three pages demonstrating navigation, dialogs, and state updates.
Explore managing counter state with provider, using initState and addPostFrameCallback to avoid setState during build, and compare Future.delayed and microtask approaches for safe UI updates.
Explore how to display a dialog in Flutter using addPostFrameCallback, avoid showing dialogs in initState, handle overlay and inherited widget changes, and compare context.watch versus context.read.
Shows using addPostFrameCallback to trigger navigation to OtherPage when a ChangeNotifier counter reaches 3, avoiding build-time errors and dialogs, with a nod to BlocListener and ref.listen for similar patterns.
Learn how to handle actions with ChangeNotifier's addListener, register in initState and dispose, and manage an AppState (initial, loading, success, error) via a provider-based text form flow.
Explore provider-based app state with AppProvider, simulate a remote API, and drive loading, success, and error states via notifyListeners, while implementing an async submit with validation, navigation, and dialogs.
Learn to handle errors in a Flutter provider app by avoiding rethrow and try-catch, using appState with addPostFrameCallback to navigate or show dialogs, and prevent actions in build.
Examine three methods to trigger UI actions from ChangeNotifier in Flutter: embedding navigation or dialogs, imperative triggering, and declarative addListener, with focus on UI separation and disposal concerns.
Explore provider-based state management in a todo app, covering ChangeNotifierProvider, ChangeNotifierProxyProvider, ProxyProvider, StateNotifierProvider, and Riverpod, plus independent versus computed states and best practices like atomic state, copyWith, and equatable.
Explore the final flutter provider todo app structure, where the header shows item counts and text fields create and search tasks, while tabs filter all, active, and completed lists.
Learn to scaffold a flutter todo app using ChangeNotifierProvider and ChangeNotifierProxyProvider, set up packages like uuid and equatable, and structure folders for models, pages, providers.
Create a dart todo model with id, desc, and completed, use uuid for ids, support new and edit flows, extend equatable, and define a Filter enum with all, active, completed.
Explore how to manage todo filter state with a ChangeNotifier in Flutter provider by building TodoFilterState and TodoFilter, using initial factory, copyWith, and notifyListeners for All, Active, and Completed tabs.
In the Flutter Provider Essential Course, this lecture introduces TodoSearchState and TodoSearch to manage the searchTerm in a todo app, using equatable, copyWith, initial(), and ChangeNotifier with notifyListeners.
Create and manage a todo list state with TodoListState and TodoList using ChangeNotifier, including initial items, addTodo, editTodo, toggleTodo, and removeTodo operations.
Implement ActiveTodoCountState and ActiveTodoCount ChangeNotifier to track active todos via TodoList changes. Use ProxyProvider to update on changes, initial state 0, and apply copyWith.
Create a FilteredTodosState and a FilteredTodos change notifier to manage the visible todo list. Implement filtering by active, completed, and search term, using copyWith and notifyListeners.
Wrap the materialapp with a multiplatform provider to inject change notifier providers for todofilter, todosearch, and todolist, then use change notifier proxy provider and change notifier proxy provider3 to supply active todocount and filtered todos, start making ui and testing it.
Build a TodoHeader widget in Flutter that shows 'TODO' and the active todo count on the right, rebuilt via ActiveTodoCount with context.watch for real-time updates.
Build a stateful CreateTodo widget with a text field controlled by a TextEditingController, validate non-empty input via onSubmitted, then submit via TodoList's addTodo using context.read and clear the field.
Create the SearchAndFilterTodo widget with a search field and three filter buttons to show all, active, or completed todos, updating in real time via TodoSearch and TodoFilter.
Display the filtered todo list in ShowTodos using FilteredTodosState and ListView.separated, and enable swipe-to-delete with Dismissible and a showBackground for left and right swipes.
Create a stateful TodoItem widget as a ListTile with a leading checkbox showing todo.completed, displaying the todo desc, and support editing, deleting via Dismissible with confirm dialog, enabling full CRUD.
Implement a debounce to reduce search volume by introducing a debounce class with a 500 ms default and applying it in the search todo widget, delaying searches until typing pauses.
Set the initial ActiveTodoCount and initialFilteredTodos by passing initialActiveTodoCount and initialFilteredTodos through constructors and reading the TodoList, then use ChangeNotifierProvider and ChangeNotifierProxyProvider to manage independent and computed state.
Learn when ChangeNotifierProxyProvider can be replaced by ProxyProvider to build computed state from dependencies, using create and update, and refactor to immutable objects in Flutter provider.
Refactor the active todo count and filtered todos from change notifier to plain classes. Wire them through constructors with todo list, TodoFilter, TodoSearch, and switch to a proxy provider.
Compare change notifier patterns to state notifier and state notifier provider. See how riverpod-inspired typed state access and proxy providers improve a multi-state app with bar color, counter, and level.
Create a Flutter state_notifier app using BgColorState and BgColor StateNotifier, set up providers with equatable and state_notifier, and toggle color with a changeColor function.
Create a counter state with CounterState and CounterStateNotifier, and use LocatorMixin to read BgColor state and update the counter via StateNotifierProvider based on color using the update function.
Define a Level enum with bronze, silver, gold and use it as the state in a Level StateNotifier with LocatorMixin. Compute level from CounterState, updating to gold, silver, or bronze.
Explore building a flutter app with statenotifier and statenotifierprovider in a multiprovider setup, watching color, counter, and level states to drive app bar color, background, and UI behavior.
Refactor the todo app using StateNotifier, replacing change notifiers. Implement StateNotifier across TodoFilter, TodoSearch, TodoList, and filtered todos with LocatorMixin and watch locator.
Refactor a Flutter todo app by migrating to StateNotifier providers within a MultiProvider setup, replacing ChangeNotifierProvider and ProxyProvider, and updating the UI components.
Enable data persistence for the todo app with local SQL via SQFlite or remote Firebase, handle async operations with CircularProgressIndicator and dialogs, and implement pagination or infinite scroll.
The course updates the weather API provider to openweathermap after metaweather outages. Metaweather remains available for now and will be moved to the back of the curriculum.
Explore building a weather app with openweathermap in flutter provider, fetching city weather via geocoding and current weather APIs, displaying icons, theming by temperature, and three provider architectures.
Showcases flutter provider architecture with equatable, flutter_dotenv, http, and recase; structures the app with models, pages, providers, services, repositories, and widgets, and builds home, search, and settings skeletons.
Create and wire up Dart models for a Flutter weather app: DirectGeocoding and Weather with fromJson constructors, equatable, toString, copyWith, and a CustomError model to handle openweathermap data.
Build a weather_api_services.dart client that fetches data from openweathermap using a configured http client and constants.dart. Load environment variables with flutter_dotenv, implement getDirectGeocoding and error handling with WeatherException and httpErrorHandler.
Implement a getWeather async function that fetches weather via two http calls using directGeocoding, builds a https uri with lat and lon, and uses Weather.fromJson to return a Weather object.
Create a weather_repository.dart with WeatherRepository depending on WeatherApiServices, implement fetchWeather to call two APIs via directGeocoding and getWeather, and handle WeatherException with CustomError.
Learn how to structure flutter provider files by separating state and ChangeNotifier into a counter folder with counter_provider.dart and counter_state.dart, using part and part of directives and import rules.
Create a weather provider with weather_state.dart and weather_provider.dart, using WeatherStatus, WeatherState, and WeatherRepository to fetch and manage remote weather data via ChangeNotifier.
Explore building a search-driven weather flow: create a form with validation, navigate from home to search, pass city via navigator, and fetch weather with a weather provider.
Explore how HomePage uses _showWeather with WeatherProvider to display the initial 'Select a city' state, a loading indicator, and an error dialog, then show the city name on success.
Implement an errorDialog function that uses platform checks to display a platform aware dialog on iOS and Android, with barrierDismissible false and the weatherState error message.
Show the weather on the home page by replacing the center with a list view, displaying city name, updated time, country, and temperatures using dedicated formatting functions and network icons.
Implement a TempSettingsProvider with ChangeNotifier to toggle between Celsius and Fahrenheit using a switch, display converted temperatures in SettingsPage and HomePage, and adjust the app theme by temperature.
Develop a theme management system with ThemeState and ThemeProvider using ChangeNotifier, switching between light and dark themes based on a 20-degree threshold from WeatherProvider, with provider wiring via ChangeNotifierProxyProvider.
Refactor the weather app with ChangeNotifierProvider and ProxyProvider, wiring ThemeProvider to WeatherProvider and switching themes by temperature; test Helsinki dark and Bangkok light with Celsius and Fahrenheit.
Refactor the weather app from ChangeNotifier to StateNotifier using StateNotifierProvider and LocatorMixin, updating weather, temperature settings, and theme providers with initial states and copyWith.
Refactor the weather app from ChangeNotifier to StateNotifier, update providers, and implement addListener with TempSettingsState and WeatherState to validate dark and light themes and Celsius/Fahrenheit toggles.
Enhance the weather app with pull-to-refresh using RefreshIndicator and AlwaysScrollableScrollPhysics, fetch weather by latitude and longitude via location packages, and retrieve data from metaweather.com on startup.
Discover firebase authentication with provider in Flutter, using email and password for sign up, sign in, and sign out, with status via stream and integration with firebase_core, cloud_firestore, and validators.
Set up an android firebase project, configure analytics, register the android app with package name, add google-services.json, enable multidex, and integrate firebase auth and cloud firestore via gradle.
Set up firebase for iOS by configuring the iOS bundle identifier in Xcode, adding GoogleService-Info.plist, and registering the app in the Firebase console, while updating Podfile to platform iOS, '10.0'.
Test firebase setup on android and ios by converting the main function to async, initializing firebase with the flutter binding, and enabling email/password authentication with Firestore.
Define a User model and a CustomError model in flutter, with fromDoc parsing, an initialUser factory for pre-login state, and set up db_constants.dart to reference the users collection.
Create a splash page as the app's initial route with a circular progress indicator, routing to home or login after authentication and establishing routes for signin, signup, home, and profile.
Implement an AuthRepository to sign in, sign up, and sign out with firebase_auth, store user profiles in Firestore, and handle errors with CustomError while reacting to auth state changes.
Learn to create auth state management with firebase_auth streams, a dedicated AuthState and AuthProvider, and a ChangeNotifierProxyProvider that updates listeners on user authentication status.
Organize main.dart with MultiProvider to inject AuthRepository, StreamProvider, and AuthProvider into the widget tree. Alias firebase_auth to fbAuth and route SplashPage to HomePage or SigninPage based on auth state.
Define SigninState with SigninStatus (initial, submitting, success, error) and error handling; implement SigninProvider (ChangeNotifier) to manage signin via AuthRepository and notify UI, then inject ChangeNotifierProvider in main.dart.
Explore building a flutter sign-in page with provider, email and password fields, form validation, autovalidate mode, focus management, and navigation to signup and firebase sign-in.
SigninPage handles user input and signin requests, showing loading and error dialogs, while SplashPage and AuthProvider navigate to HomePage on success.
create a Flutter signup flow using SignupState and SignupProvider with name, email, and password confirmation, wired in main.dart and validated against Firebase user data.
Implement signout on the HomePage AppBar using the AuthProvider read extension, test signout, and navigate to the ProfilePage via an account_circle icon button.
Build a ProfileRepository, ProfileState, and ProfileProvider using ChangeNotifier to fetch user profiles from Firestore via getProfile, handle errors with CustomError, and reflect updates on ProfilePage.
Build a Flutter profile page with the Provider package to fetch Firestore user data on load, handle errors with addListener, display loading and user info (id, name, email, points, rank).
Refactor the firebase authentication app to use StateNotifier, replacing ChangeNotifier, and streamline providers with LocatorMixin and StateNotifierProvider, updating main.dart and introducing a providers barrel for cleaner imports.
Refactor the firebase auth app with StateNotifier by using SigninState, SignupState, and ProfileState, remove direct getters, and set addListener fireImmediately to false to avoid early errors.
Discover how provider and StateNotifierProvider power a firebase auth app, managing signin, signup, and signout, while enabling email and password authentication and social logins with google, facebook, and twitter.
Explore the equatable package and the dart data class generator extension to simplify class equality, toString, and boilerplate in dart applications.
Discover that Flutter has no official state management, explore multiple approaches like provider, flutter_bloc, get, riverpod, and redux, and prepare to adapt to future upgrades.
Build a weather app that fetches data from metaweather.com, displaying city weather and theme changes by temperature, using provider patterns like ChangeNotifierProvider, ProxyProvider, and StateNotifierProvider.
Explore essential flutter provider setup with packages like equatable, http, and provider; organize folders—models, pages, providers, services, repositories, widgets—and build skeletons for home, search, and settings pages.
Create a weather model in Flutter by parsing json from metaweather, mapping snake_case to camelCase, and implementing Weather.fromJson, Weather.initial, and a CustomError model for robust state management with equatable.
Build a Flutter weather api service using a shared http client and constants host to fetch woeid by city, with weather exception handling and Uri-based http calls.
Learn to fetch weather by woeid with an async getWeather function that returns a Weather object; implement http get calls, json decoding, and a repository abstraction.
Create weather_repository.dart with WeatherRepository using WeatherApiServices, implement fetchWeather(city) calling two APIs, handle WeatherException and other errors with CustomError, and test by wiring into main.dart and http.
Build a Flutter weather state management flow using WeatherState and WeatherProvider with ChangeNotifier, handling WeatherStatus (initial, loading, loaded, error) and integrating a WeatherRepository and WeatherApiServices.
Tap the search icon in the home page app bar to open search page, enter a city, validate for at least 2 characters, then fetch weather via WeatherProvider when returning.
Create a flutter home page with provider that renders weather states via _showWeather, handling initial, loading, and error cases with dialogs and a city title.
Create a cross-platform error dialog for a Flutter provider app by implementing an errorDialog function, handling iOS and Android dialogs, and testing with hot restarts and various error messages.
Display weather details with a ListView, including a centered city name and formatted update time, and show current and maxTemp/minTemp temperatures with a showTemperature function, and load icons via showIcon.
Learn to manage temp settings with a TempSettingsProvider and TempSettingsState, using a change notifier in Flutter to toggle between Celsius and Fahrenheit and update the SettingsPage UI.
Define ThemeState with AppTheme light and dark and a kWarmOrNot threshold of 20. Create ThemeProvider that listens to WeatherProvider via ChangeNotifierProxyProvider to switch themes based on the current temperature.
Refactor the weather app to use ProxyProvider by converting ThemeProvider and injecting WeatherProvider. Switch from ChangeNotifierProxyProvider to ProxyProvider and test with a hot restart.
Refactor the weather app to use state notifier with state notifier provider, replacing change notifier across weather, temp settings, and theme providers, using locator mixin and read/write extensions.
Refactor the weather app from change notifier to state notifier, update main.dart and providers to weather state and temp settings state, and adjust home_page.dart addListener with removeListener and fireImmediately.
Enhance the weather app by adding pull-to-refresh with RefreshIndicator and AlwaysScrollableScrollPhysics to re-fetch data, read latitude and longitude with location or geolocator, and fetch weather from metaweather.com.
In the Flutter Provider Essential course, you can learn in depth about Provider, the most basic and widely used among Flutter state management solutions.
If you want to deepen your understanding of the Flutter Provider and put all the concepts into practice, then this course is for you.
The lecture was carefully composed to ensure a balance between theory and practice.
And under the belief that repetition is the most important learning method, whenever there is a new concept, we will test the concept by making a small app, and through real-world apps such as TODO, Weather, and Firebase Authentication app, the concepts will come together comprehensively.
In particular, we will repeatedly practice combinations of different Providers when creating TODO, Weather, and Firebase Authentication apps.
- TODO App (3 Implementations): 1. Combination of ChangeNotifierProvider, ChangeNotifierProxyProvider, 2. Combination of ChangeNotifierProvider and ProxyProvider, 3. StateNotifierProvider
- Weather App (3 Implementations): 1. Combination of ChangeNotifierProvider, ChangeNotifierProxyProvider, 2. Combination of ChangeNotifierProvider and ProxyProvider, 3. StateNotifierProvider
- Firebase Authentication App (2 Implementations): 1. Combination of StreamProvider , ChangeNotifierProvider, and ChangeNotifierProxyProvider, 2. Combination of StreamProvider and StateNotifierProvider
In addition, I will talk about StateNotifier and StateNotifierProvider, which allow you to use the Provider as a more advanced State Management Solution, and there will be opportunities to practice through apps, so you will have even more options.
I can proudly say that this course is the most in-depth course on Flutter Provider.
This is a quick look at everything covered in the course.
- Why Provider is needed
- How to access data in the widget tree using Provider
- How to listen for data changes in the widget tree using ChangeNotifier’s AddListener
- How to use ChangeNotifierProvider, the most used in Provider
- How to use the read, watch, and select extension methods to easily access and listen to data
- MultiProvider, which allows the easy and neat injection of multiple providers into the widget tree
- FutureProvider and StreamProvider, a provider used when you want to listen to continuously changing values and rebuild the widget
- Consumer widget, a kind of convenience widget that makes it easy to access a specific type of Provider
- Selector widget, a type of Consumer widget that enables more detailed control
- Provider Access and value named constructor: anonymous route access, named route access, generated route access, global access
- Provider-to-provider communication: ProxyProvider
- Various errors encountered when using the Provider and how to deal with them
- The addPostFrameCallback method, which is useful when used together with Provider
- How to handle actions such as showDialog or Navigator dot push using ChangeNotifier’s AddListener
- TODO App: 3 implementations through a combination of various providers
- Weather App: 3 implementations through a combination of various providers
- Firebase Authentication App: 2 implementations through a combination of various providers