Flutter & Firebase Masterclass (COMPLETE PACKAGE)
Learn about Firebase Auth, Cloud Firestore, Cloud Functions, Stripe payments, and much more by building a full-stack eCommerce app with Flutter & Firebase.
More
If you need a backend for your Flutter app, Firebase is the most obvious choice.
Firebase makes it easy to authenticate users, write data to a remote database, and run server-side code securely. And you get scalability and great performance out of the box, without breaking the bank.
But once you start building large-scale apps, things get complicated and you may ask yourself:
- Do I have the right architecture in place?
- Am I structuring my data correctly?
- How can I run complex queries efficiently?
- Are my security rules correct?
- How should I handle errors?
- Will I get a massive Firebase bill and go bankrupt?
In other words - how do you know if you’re doing it right?
Sure, you could read all the docs and watch a ton of tutorials on YouTube - but those often take shortcuts or use examples that are too basic and don't give you the full picture.
As a result, you’re left to learn the hard stuff by trial and error, and that takes ages!
But there's a faster way.
And I can speed up the process for you, by packaging up all my Firebase knowledge and experience into this course.
This in-depth course will teach you how to create real-world apps with Flutter & Firebase.
Start with the Basics, Then Dive Deep
We'll kick off by building a simple full-stack app that covers Firebase Auth, Cloud Firestore, basic security rules, and the latest Firebase UI packages.
Then, we’ll go deep and build a complex eCommerce application, complete with backend integration using Cloud Functions and 3rd party integrations like Stripe and Algolia.
Along the way, we’ll cover key topics such as:
- Firebase setup with the FlutterFire CLI
- Authentication flows and role-based authorization
- Data modeling, security rules, and CRUD operations with Cloud Firestore
- Queries, indexes, pagination, caching, and offline support
- Image uploads with Firebase Storage
- Firebase Local Emulator and Cloud Functions with TypeScript
- Firebase cost analysis and optimization
- Firebase Extensions and 3rd party integrations (Stripe and Algolia)
- How to securely store client-side and server-side API keys
- Deployment via Firebase Hosting
Course Format
The course contains a variety of code-along videos, along with diagrams and illustrations to help you understand the concepts, as well as full source code, written notes, and additional resources that you can reference later.
Watch Online Flutter & Firebase Masterclass (COMPLETE PACKAGE)
# | Title | Duration |
---|---|---|
1 | Welcome | 02:47 |
2 | Firebase Pros and Cons | 10:23 |
3 | Firebase Basics: Introduction | 02:11 |
4 | Starter project overview | 04:32 |
5 | Creating the Firebase project and installing the CLI tools | 04:23 |
6 | Configuring the Flutter app with the Flutterfire CLI | 05:10 |
7 | Introduction to Firebase Auth & Firebase UI Auth | 08:39 |
8 | Completing the email & password sign in flow | 05:49 |
9 | Showing the correct page when the app starts with GoRouter.redirect | 04:18 |
10 | Using authStateChanges() and the refreshListenable argument | 03:44 |
11 | Refactor: replacing singletons with Riverpod providers | 03:46 |
12 | Other Firebase Authentication Features: Overview | 01:37 |
13 | Introduction to Cloud Firestore | 05:53 |
14 | Installing Cloud Firestore and running on iOS and Android | 03:06 |
15 | Overview of the jobs page and planned CRUD operations | 02:10 |
16 | Adding one more route to GoRouter and updating the redirect logic | 03:34 |
17 | How to add a document with the FirebaseFirestore API | 06:28 |
18 | Using the FirebaseRepository to add jobs from the UI | 04:39 |
19 | Showing list items with the FirestoreListView widget | 06:08 |
20 | Using type-safe model classes | 05:48 |
21 | Adding update and delete operations | 07:01 |
22 | Filtering collections with `where` | 03:07 |
23 | Intro to Firestore security rules | 10:03 |
24 | Working with timestamps and sorting data | 05:31 |
25 | Offline mode | 03:04 |
26 | Pagination and the FirestoreQueryBuilder widget | 02:32 |
27 | Wrap Up | 02:57 |
28 | Section Intro | 03:10 |
29 | VSCode Shortcuts, Extensions & Settings for Flutter Development | 01:53 |
30 | Course Project on GitHub | 01:57 |
31 | Cloning the starter project & pubspec.yaml file overview | 05:05 |
32 | eCommerce app overview | 04:31 |
33 | Project overview: app initialization and routing | 03:16 |
34 | Project overview: helper classes and widgets | 04:45 |
35 | Project structure: features and layers | 06:49 |
36 | Unidirectional data flow from the data layer to the presentation layer | 04:58 |
37 | How to add Firebase repositories to the data layer | 06:50 |
38 | Updated Starter project | 04:42 |
39 | Section Intro | 03:42 |
40 | Adding Firebase to the eCommerce app | 10:09 |
41 | Creating an AuthRepository using the FirebaseAuth APIs | 06:09 |
42 | The authStateChanges() method and the User class | 07:16 |
43 | Testing the authentication flows with Firebase | 03:08 |
44 | Dealing with Firebase auth exceptions | 06:38 |
45 | Adding the email verification logic | 09:06 |
46 | Automated testing with FirebaseAuth and wrap up | 03:10 |
47 | Section Intro | 03:19 |
48 | Cloud Firestore and Firebase Storage setup | 04:34 |
49 | Updated starter project | 10:09 |
50 | Image uploads: plan of attack | 03:55 |
51 | Creating an ImageUploadRepository | 04:46 |
52 | Creating an AsyncNotifier to upload images | 07:12 |
53 | Creating new products as Cloud Firestore documents | 04:23 |
54 | Completing the image upload logic | 06:00 |
55 | Adding an ImageUploadService class | 02:55 |
56 | Adding a watchProduct method to the ProductsRepository | 06:12 |
57 | Cloud Firestore: realtime listeners vs one-time-reads | 09:05 |
58 | How to edit existing products: overview | 04:33 |
59 | Implementing the AdminProductEditController | 10:44 |
60 | Deleting products | 09:49 |
61 | Combining streams inside a provider with Rx.combineLatest | 03:13 |
62 | Image uploads: final tweaks and completed code | 04:39 |
63 | Basic security rules for the image upload flows | 03:52 |
64 | Flutter web: adding a CORS policy to a Firebase storage bucket | 05:19 |
65 | Wrap up & exercises | 02:04 |
66 | Section Intro | 02:27 |
67 | Initializing the Firebase Local Emulator Suite with firebase init | 07:36 |
68 | How to use the Firebase Emulators | 06:24 |
69 | Exporting and Importing data with the Firebase Emulator | 05:22 |
70 | Introduction to Cloud Functions and Project Setup with TypeScript | 04:13 |
71 | TypeScript modules basics + Running our first Cloud Function using npm | 06:01 |
72 | Writing a Cloud Function Trigger | 09:52 |
73 | Fixing the infinite loop in the Cloud Function | 04:44 |
74 | Introduction to HTTP callable functions | 02:50 |
75 | Writing an HTTP callable function to delete all documents inside a collection | 08:40 |
76 | Invoking an HTTP callable function from the Flutter client | 07:34 |
77 | Deploying Cloud Functions with the Firebase CLI | 04:46 |
78 | Setting a project budget in Google Cloud as a safety net | 03:27 |
79 | Testing the deployed functions and inspecting the Google Cloud logs | 03:53 |
80 | Wrap Up | 01:25 |
81 | Section Intro | 02:10 |
82 | Introduction to Custom Claims | 06:59 |
83 | Starter project and Firebase configuration | 04:35 |
84 | Running the Flutter eCommerce app with the Firebase Local Emulator | 03:44 |
85 | Writing a Firebase auth trigger to set the custom claims on the server | 09:30 |
86 | Updating the Security Rules to enable Role-Based Authorization via Custom Claims | 06:04 |
87 | How to show the admin UI only if the user is an admin | 09:42 |
88 | How to force-refresh the ID token with a Cloud Firestore Listener | 11:59 |
89 | Updating the GoRouter redirect code to account for the admin state | 03:14 |
90 | Deploying and testing the Cloud Function Trigger | 06:56 |
91 | Wrap Up | 01:57 |
92 | Section Intro | 02:26 |
93 | Updated Starter Project with Firebase seed data | 03:34 |
94 | Implementing a Shopping Cart with Firebase: Overview | 03:42 |
95 | Cloud Firestore Data Modeling for the Shopping Cart Items | 06:44 |
96 | Implementing the RemoteCartRepository with Cloud Firestore | 08:04 |
97 | Testing the Shopping Cart feature with Cloud Firestore | 04:42 |
98 | Optimizing the Cart Total Calculation with Multiple StreamProviders | 09:08 |
99 | How to estimate the cost of your Firebase app and minimize your Firebase bill | 09:23 |
100 | Wrap Up | 01:07 |
101 | Section Intro | 05:40 |
102 | How to collect payments on mobile: Stripe or IAP? | 02:24 |
103 | Introduction to Stripe | 02:39 |
104 | Overview of the Flutter Stripe package and example app | 03:55 |
105 | Payment flows with Stripe: conceptual overview | 03:47 |
106 | Updated starter project & Flutter Stripe SDK setup | 05:12 |
107 | Installing the Stripe Extension for Firebase | 04:34 |
108 | Configuring the webhook for the Stripe Extension | 04:38 |
109 | Creating products in the Stripe dashboard | 07:36 |
110 | Adding new Cloud Function triggers to synchronize the Stripe data with Firestore | 08:53 |
111 | Deploying and testing the new Cloud Functions | 06:19 |
112 | Explaining the relationship between Stripe Customers and Firebase Users | 03:35 |
113 | Demo: making payments on the client (mobile and web) | 05:53 |
114 | Overview of the client payment flows on mobile | 11:13 |
115 | Overview of the client payment flows on Flutter web | 06:30 |
116 | How to fulfil orders on the backend | 06:59 |
117 | Showing the updated orders page in the Flutter app | 05:44 |
118 | How to set and use the Stripe Secret Key with Cloud Functions | 03:43 |
119 | Updating the available quantity on the Stripe product metadata | 03:27 |
120 | Wrap Up | 01:54 |
121 | Section Intro | 01:32 |
122 | Overview of the Firebase Extensions for Full-Text Search | 02:47 |
123 | Installing the Algolia Extension for Firebase | 09:18 |
124 | Updated starter project and code walkthrough | 05:59 |
125 | Adding the Algolia API keys to the Flutter project | 02:29 |
126 | Implementing Products Search with Algolia | 04:53 |
127 | Removing the loading indicator for a better search UX | 03:55 |
128 | Using realtime updates when the query is empty | 03:24 |
129 | Using caching and debouncing to make fewer API calls | 05:32 |
130 | Wrap Up | 01:48 |
131 | Section Intro | 01:30 |
132 | Starter project and code walkthrough | 03:12 |
133 | Implementing the ReviewsRepository | 05:21 |
134 | Calculating the average rating score with Cloud Functions | 05:46 |
135 | Deploying the Flutter web app with Firebase Hosting | 03:11 |
136 | Updating the CORS policy for the deployed Flutter web app | 02:37 |
137 | Conclusion | 02:25 |