Flutter 3.10 & Firebase Mastery: build a fully functional E-commerce app with an Admin app, ready for deployment.
What you will learn
Flutter Mobile
Firebase Firestore, Authentication & Storage
Teaching how to write Clean-code and avoid Boilerplate code
Admin App to upload and edit products
Clear state management with Flutter Provider State Management
Fully functional E-commerce app
Description
This course is made in Arabic and English. but this is the Arabic version of it
Course Description: Flutter & Firebase Mastery
Learn to design, build, and debug fully functional shopping applications with Flutter and Firebase. This course offers in-depth knowledge of Flutter mobile development, Dart programming, and Firebase integration. By the end of the course, not only will you be equipped to manage freelance projects confidently, but you will also be well-prepared to take on a Flutter development position within a company.
Prerequisites
- Basic knowledge of programming
- Basic understanding of Flutter
- Experience with Windows or Mac application development
- Access to a computer with an Internet connection
- Enthusiasm for learning and applying cutting-edge algorithms to practical cases
Recording Equipment:
- Video Editing Software: Camtasia 2022
- Microphone: Blue Yeti X
This top-of-the-line equipment ensures the highest possible audio and video quality for the course content.
What You Will Learn
This course covers an extensive range of topics, including:
General
- Dart Programming Language – Fundamentals to expert topics
- Understanding Flutter Mobile Development by building apps incrementally
- Designing, building, and debugging Flutter apps
- Building robust apps with Flutter
Styles & UI
- Styles for UI
- Dynamic colors and themes
- Complex UI made simple
- Custom widgets
- Flutter Material Design
- ListViews and multiple UI states
- Flutter Row and Column
- Flutter ListView Builder
State Management – Provider
- Clean code and boilerplate code avoidance
- setState, lifting state up via callbacks, global access, scoped access with Provider and ChangeNotifier
- Navigation & Custom navigation
- Forms, input handling, and validation
- Managing and updating packages
Firebase
- Databases and Cloud Firestore
- Firebase Authentication
- Firebase Firestore
- Firebase Storage
- Real-time communication with Firestore using Streams and StreamBuilder, Futures and FutureBuilder
Course Structure
- Duration: approximately 12-13 hours of content
- Regular updates
What to Expect After This Course
After completing this course, you will have:
- The ability to build a fully functional shopping application with Firebase
- Gained advanced knowledge in Flutter
- Developed readiness to explore expert topics in Flutter
- The ability to handle and manage freelance projects
- Acquired the necessary skills and knowledge to confidently take up a Flutter development position within a company
Limitations and Notes
Please note the following limitations and important information for this course:
- This course focuses on Windows configurations. IOS configurations are not covered but feel free to ask questions about it. We will be there to help.
- This course includes 2 apps, one for the Users, and another App for the Admin, both in “Portrait mode“.
- The Android app is designed to be responsive only in portrait mode; it does not support landscape mode.
- Resources are attached to each lecture.
- 24/7 support will be provided depending on the nature of your questions.
English
language
Content
Introduction
Introduction
Sale Coupons – Monthly
Advanced tips and tricks
Main – Reference app demonstration
Whats in the expert course
How our Users App looks like at the end of the course?
How our Admin App looks like at the end of the course?
Social accounts
What do you expect after this course
Build the user app UI
Lock the device Orientation
Create the a new application and open it in vs code
Implement the light and dark theme with provider state management
Create the text custom widget
Create the bottom navigation bar with active state
Create the profile screen
Create the app name animated background widget
Create the empty cart screen
Create the cart screen when added product
Create the Cart bottom sheet widget
Create the Cart quantity dialogue
Implement the Cart badge
Start implementing the search screen
Finish implementing the search screen
Note about the Search Screen
Implement the Swiper in the Home Screen
Create the latest arrival widget in the Home Screen
Create the Categories widget in the Home Screen
Implement the product details screen
Create a custom heart widget
Implement the Wishlist and Viewed recently screens
Implement the Warning or Error dialog
Implement the login screen design
Implement the Sign in with google button widget
Start Implementing the Register Screen
Implement the Profile Image Picker Widget
Implement the Pick Image Dialog
Allow the user to pick up an image using Camera or Gallery
Implement the Orders screen
Implement the Forgot Password Screen and Test the App
State Management Using Provider
Why do we need state management
Create the Product Model
Display the correct products on the Search Screen
Display the correct products using Provider State Management
Display the products on the screen using a dynamic way
Display the correct product details in the Product Details Screen
Display products by Category
Allow the user to search for Products
Allow the user to search for Products in Categories.tscproj
Start with the Cart State Management and allow the user to add to his Cart
11. Display the added product in the Cart and display the correct info
Allow the user to update Cart Item Quantity
Finalize the Cart State Management, allow the user to delete items EN
Displaying the latest arrival products
Implement the Wishlist State management
Finish the viewed recently product State management
Admin Panel App
Create a new App for the Admin Panel
Implement the Dashboard Screen
Start implementing the Upload Screen
Implement the Upload Product Image widget
Make the upload product screen dynamic to allow the admin to edit his product
Firebase + More on State Management
Connect our Apps to the Firebase
Allow the user to Register and initialize the Firebase + Error handling
Allow the users to login and check if they are signed in or not
Sign in With Google
Loading manger – Display loading indicator when loading
Save User information to the Firebase Firestore
Display the user information from the Firestore
Save the user information to Firestore on Google Sign In
Keep the BottomNavigationBar State Alive
Allow the user to upload an image
Admin – Upload Product to the Firebase
Fetch product from the Firebase and Display it in the user application
Fetch product using Stream Builder EN
Admin – Allow the admin to edit a product
Display the correct latest arrival
Allow the user to add to Cart and save it in the Firebase Firestore
Fetch the Cart from the Firestore
Clear Cart & Remove one item from Firebase
Connect the User Wishlist to the Firebase
Allow the user to place an Order
Fetch the Orders and display it on the screen