Flutter With Firebase Build An E Commerce App From Scratch

*MUST READ* Bottom bar lecture Update Preview 00:10

Lecture has been recycled in lecture 15 Create a notched bottom bar Preview 06:44

Deep explanation of the bottom Bar screen (Added after publishing) Preview 21:38

Bottom bar with null safety Preview 06:05

Edit deprecated title in the bottom bar Preview 02:27

Custom Icons update Preview 00:12

Usage of custom icons Preview 06:24

Build the user info and settings screen design Preview 07:33

Code recycling and more tricks ( Added after publishing) Preview 04:55

Create a dynamic widget that can be used everywhere. And simplify our code

Add a switch tile using 2 different ways ( Added after publishing the course ) Preview 06:33

**IMPORTANT** Sliver appbar lecture Update Preview 00:24

Implement a sliver app-bar Preview 05:18

Lecture has been recycled later in the course

Add animated FloatingActionButton Preview 01:45

Lecture has been recycled later in the course

Sliver appBar writing code from the beginning with detailed explanation Preview 05:54

Sliver AppBar lecture recycling (Added after publishing the course MUST WATCH) Preview 31:34

Sliver appbar with null safety Preview 00:11

Theme lecture update Preview 00:09

Add a Dark/Light theme to the app Preview 07:33

Save theme state using shared prefs Preview 06:16

In this tutorial you will learn how to save user setting into his phone. so it will not be lost once he close and open up the app again.

The chosen theme will be displayed once he open the app.

Implement the user empty cart screen design Preview 13:15

In this tutorial I wrote the code of the empty cart screen design.

This page appear once the user cart is empty. That's why I named it like that.

Implement the user Full cart screen design Preview 20:33

In this tutorial I wrote the code of the Full cart screen design.

This page appear once the user add a product to his cart. That's why I named it like that.

So once he add any product to his cart later. this screen will be displayed instead of the empty cart screen.

Build the App Bar and checkout section in the cart screen Preview 11:26

More design improvements in the cart screen Preview 03:50

Start implementing the products feeds screen. (Create the feeds shape design) Preview 10:06

Implement the Feeds screen by splitting its code into widgets. And in this tutorial I implemented the products shape design

Implement a GridView in the Feeds screen Preview 02:17

Implement a staggered Grid View in Feeds screen instead of a normal Grid View Preview 02:31

More design improvements in the User info screen Preview 01:10

More changes in the user info screen Preview 00:56

Add the a badge for the products design in the Feeds screen Preview 02:33

Align the badge using the positioned widget Preview 01:31

Add a backdrop layout in the home screen Preview 06:05

Carousel and Swipper update Preview 00:07

Add a Carousel widget in the Home screen Preview 06:16

Add a Swiper widget in the Home screen Preview 07:32

Create the Category widget design Preview 11:59

The purpose of this widget is to allow the users to browse using products category

Create the popular items widget design in the Home screen Preview 13:52

Introduce the navigation rail widget to Create the brand Inner screen using Preview 10:39

Later on this screen will be used to show products according the its categories.

Create the backdrop back-layer design Preview 10:12

Implement the user empty Wishlist screen design Preview 08:07

Just as the cart screen. this page will be displayed where the Wishlist is empty.

Implement the user Full Wishlist screen design Preview 04:28

Just as the cart screen. this page will be displayed where there is items in the Wishlist screen

Full code until now Preview 00:00

Implement the Product details screen UI Preview 12:31

Create the Product model class Preview 02:41

Use dynamic data to show different products in the Feeds screen Preview 07:23

Why do we need state management? Preview 00:50

Create the products provider class Preview 06:28

Code improvement instead of dependency injection Preview 03:52

In this tutorial, the main thing that I explained is that  to use better way instead of dependency injection

Display products according to their categories in the home screen category widgt Preview 06:14

Finalize the categories state management Preview 07:20

Display products according to their Brand in the home screen Brands widget Preview 12:56

Display only popular products in the Home screen Preview 10:11

Finishing up the products details screen Preview 11:04

Handling view all brands in the Home screen Preview 02:10

Handle view all popular products in the Home screen Preview 03:10

Create a cart model class Preview 01:38

Implement the cart provider class Preview 05:14

Create add to cart method where users will be able to add products to their cart Preview 04:23

Using the dependency injection for the cart (passing data through constructor) Preview 10:26

Show if the product is found in cart and disable add to cart button if found. Preview 02:01

Use the cart model provider instead of dependency injection Preview 05:21

Using Change Notifier Provider we become able to use the cart model class as a provider class and reduce and simplify the code

Allow the user to add to their cart from the popular products widget Preview 03:21

Allow user to change the products quantity in the cart Preview 06:18

Allow the user to delete one product from his cart and clear it Preview 10:58

Show total price in the cart screen Preview 02:53

Create a dynamic alert dialog method Preview 04:09

Wishlist state management Preview 16:48

Edit the icon color in the popular products widget Preview 01:20

Once the user add a product to his Wishlist. The favorite icon color will turn red in this case. To flag it as a Wishlist product.

Add a badge for the Wishlist and the Cart Preview 05:31

Add an appBar for the Feeds screen Preview 01:44

Make the products dialogs in the feeds screen Preview 05:01

Show the product details in the Feeds dialog instead of dummy data Preview 06:15

Implement the search screen UI and Logic Preview 15:26

Create a Landing page part 1 Preview 17:49

Create the Landing page part 2 Preview 13:54

Implement the Login screen Preview 14:43

Add the submit form method to save the form Preview 05:30

Submit method to save the current form and check for validation. and allow users to jump from TextField to another.

Implement the Signup screen Preview 08:02

Implement the top widget in the sign up screen (Profile preview widget) Preview 12:34

Allow the user to pick up an image Preview 05:56

Allow the user to navigate From the landing page to the main screen in the app Preview 03:41

Implement the Upload a new product screen Preview 06:50

Allow the user to swipe to the left to navigate Into the upload a product screen Preview 01:39

Connect our app to Firebase Preview 06:14

If the Sha- 1 command didn't work, apply this command "keytool -list -v -keystore c:\users\yourname\.android\debug.keystore -alias androiddebugkey -storepass android -keypass android"

Allow the users to register using Email and Password part (1) Preview 03:36

Allow the users to register using Email and Password part (2) Preview 07:02

Error Handling Preview 06:17

Allow the users to login Preview 02:35

Show different screens depending on the users if logged in or not Preview 06:34

Implement the sign out method Preview 05:11

Google Sign In Preview 07:35

Google Sign In error handling Preview 02:31

What is Firebase Firestore and how does it works? Preview 04:08

Upload extra user data to the Firebase Firestore Preview 13:51

Read more about 64k Multidex error, https://developer.android.com/studio/build/multidex

Upload image to Firebase Storage, And add its link to the Firestore Preview 14:28

Fetch user info from the Firestore Preview 06:40

Display the information on the screen and handle errors Preview 04:16

Get the display name and the photo URL from the user instead of the Firestore Preview 04:02

Allow the users to sign in anonymously Preview 06:03

Save user info to the Firestore on google sign in Preview 02:14

Upload products to the Firestore Preview 15:53

Fetch products from the Firestore and display it. Preview 15:40

Implement Forget password screen to allow the user to reset his password Preview 18:58

Fix an error that is being made by the suggested products (Range index Error) Preview 02:09

Get start with stripe payment gateway Preview 07:29

Stripe integration Preview 46:19

Implement the orders design Preview 10:18

Create orders model class Preview 03:55

Upload the user orders to the Firestore Preview 11:58

Fix an error while placing an order Preview 03:58

Create the orders provider Preview 05:58

Fetching the orders and display it on the screen using FutureBuilder Preview 06:27

Fetch only correspondent orders for each user Preview 05:35

Show different screen depending if there is any order in the Firestore Preview 03:59

Allow the users to delete from their orders Preview 07:32

Place an order only if the transaction is successful Preview 04:57

Handle empty products in the brands and the category Preview 04:45

Fix the dark theme state Preview 03:01

The theme wasn't changing once we try to switch it, in this tutorial we will fix it

Add a refresh indicator in the feeds screen Preview 05:50

Bonus contents Preview 00:23