Flutter 3.0&Firebase Build a Grocery App&WEB Admin Panel

by


Flutter 3.0&Firebase Build a Grocery App with a WEB Admin panel From scratch with payment gateway integration

What you will learn

This Flutter course is a complete guide that helps learn and build a fully functioning Flutter application with Firebase.

Teaching how to write Clean-code and avoid Boilerplate code

A fully functional app that is ready for use and deployment

Fully Functional Flutter Grocery app with WEB Admin panel

Flutter SharedPreferences

Clear state management with Flutter Provider State Management

Flutter StreamBuilder & FutureBuilder

Firebase Firestore, Authentication & Storage

Payment gateway

Write production-ready code following best practices and become a competent Flutter developer

Description

Course prerequisites:

  • Basic knowledge in programming to get started
  • Basic knowledge of Flutter and a good knowledge is recommended
  • Concepts are explained clearly. You will always learn what you’re building and why, and then how to do it.

How this course can be of help:

  • Gaining more knowledge in Flutter and Firebase with Payment integration
  • Learn how to make a shopping application simply with a web admin panel
  • A fully functional app that is ready for use and deployment

What’s in the course:

  • Complex UI has done simply
  • Build a Complete mobile app With WEB admin portal
  • State management
  • Firebase
  • Clean code and avoid Boilerplate code
  • Styles for UI
  • State Management: setState, lifting state up via callbacks, global access, scoped access with Provider and ChangeNotifier
  • Navigation & Custom navigation
  • Dart
  • Forms, input handling, and validation
  • Managing and updating packages
  • Databases and Cloud Firestore
  • ListViews and multiple UI states
  • Firebase Authentication
  • Firebase Firestore
  • Firebase Storage
  • Dart Programming Language – Fundamentals and intermediate&expert topics
  • How to understand Flutter Mobile Development by building apps incrementally.
  • How to design, build, debug Flutter apps
  • How to get Flutter apps to communicate with a real-time database – Firestore
  • How to build robust apps with Flutter
  • Flutter AppBar
  • Flutter Material Design
  • Flutter Row and Column
  • Flutter ListView Builder
  • Payment gateway

Course structure:

approximately 17 hours of content and updated regally

Requirements:

  • Windows application development OR Mac application development
  • Access to a computer with an internet connection.
  • and you are ready for the journey
  • Love learning about applying cutting-edge algorithms to practical cases!

What Should I Expect After this Course?:


Get Instant Notification of New Courses on our Telegram channel.

Noteβž› Make sure your π”ππžπ¦π² cart has only this course you're going to enroll it now, Remove all other courses from the π”ππžπ¦π² cart before Enrolling!


  • The ability to build a fully functional shopping application with Firebase and payment integration
  • New information regarding Flutter

Note that the course builds on windows, so I didn’t have a chance to cover the IOS configurations! But feel free to ask anything about it. I will be there to help.

Note:

This course has 2 apps, One for the user “ANDROID app in Portrait mode”, and one for the admin “WEB”.

Note that the ANDROIDΒ app is responsive only in portrait mode, it doesn’t support landscape mode.

The search logic is done locally, and it is only available in the android application since it is the same logic if you want to implemented in the WEB Admin Panel.

The app is available on Playstore, please consider testing it before buying the course.

English
language

Content

Introduction

Introduction
App overview – explain how it works
Youtube channel

Start coding – Build the Mobile app UI

App intialization and dark theme implementation
Implement the bottomBar
Assignment 1
Add different appbars for the different screen in the bottombar
Assignment 2
Implement the user screen
Create the update address dialog
Assignment 3
Implement the logout dialog
Implement the category design
Finish building the category screen
Implement the card swiper in the home screen
Implement the sale widget
Create the items on sale listview
Impelment the rotated on sale text widget
Fancy image implementation
Implement the feeds widget and add it to the Home screen
Make the price widget dynamic
Implement the sale screen
Handle UI if there is no products on sale. (Create new UI to it)
Implement the feeds screen
Implement the cart widget
Implement the cart screen
Assignment 4
Implement the products details screen
Implement the quantity text controller function
Implement the wishlist screen
Impelement the warning dialog
Implement the orders screen
Implement the viewed recently products screen
Handle the empty screen for the Orders, Cart, Wishlist and Viewed recently
Implement the badge widget for the cart
Implement the login screen
Implement the sign up screen
Implement the forget password screen

Build the admin panel UI

Start implementing the admin panel
About next lecture
Implement the products widget and explain how to run the web app
Implement the products gridview
Implement the all products screen
Implement the order widget in the Dashboard screen
Fix the ScrollController error
Implement the Orders screen
Implement the upper widgets in the dashboard screen
Start building the add product screen
Edit the header widget
Implement the drop menu for selecting a category
Impelement the Radio buttons to choose the Measure unit
Implement the image picker widget (WEB)

WEB Image picker

Allow the admin to pick up the product image
Allow the admin to clear the picked image
Implement the clear form function

State management

Create a model class for the products
Show different products
Implement the products provider
Get the products details in the feeds screen without passing it
Read the other attributes in the feads widget
Finish the state management for the on sale products
Show the product details
Show different products depending on their category
Implement the cart model
Implement the cart provider
Allow the user to add to his cart
Manage the cart screen
Show the correct information of the items in the cart
Allow the user to clear his cart, update quantity and remove one item from cart
Add to cart from the product details
Check if product is in cart
Implement the wishlist provider
Allow the user to add to his wishlist
Finish the wishlist state management
Finish the viewed recently state management
Show the correct number for the cart badge

Firebase – Android app (Part 1)

What is Firebase?
Connect the app to the Firebase
Firebase initialization
Allow the user to register using an email and password
Create a loading manager widget
Show a different loading widget
Check if the user is allowed to add to his cart (If the user is logged in)
Allow the user to sign out, and test the app
Allow the user to loggin
Implement the google sign method (Allow the user to login using his gmail acc
Forget password
Impelement a toast in Flutter
Save the user information in the Firebase Firestore
Fetch the user information from the Firebase Firestore
Allow the user to edit his address

Firebase – WEB Admin panel (Part 1)

Connect the web admin panel to the Firebase
Allow the admin to upload a product
Flutter web – Upload an image to the Firebase
Display the products in the admin panel after fetching it from the Firebase
Implement the Edit product screen
Display the correct data in Edit product screen
Allow the admin to update the product details
Allow the admin to delete a Product

Firebase – Android app (Part 2)

Fetch the products from the Firebase
Show different background while fetching the products.mp4
Allow the user to search for a product
Fix products duplication error

Firebase & User Cart

Save user cart to the Firebase Firestore
Fetch the user cart from the Firebase (Show the itemsthat are in the user cart)
Fetch the user cart while the app is loading
Fix some errors related to the user cart
Show the correct prices in the cart screen
Allow the user to delete one item from his cart (Perform deletion from an array)
Allow the user to clear his cart and fix a bug
Added after the user wishlist section-Fix one bug related to the cart-Null user

Firebase & User Wishlist

Write the method to save the wishlist on the Firestore
Finish the wishlist provider (Fetch, add, remove From the Firebase)
Finalize the wishlist with the Firebase
Show a progress indicator while adding product to the wishlist
Fix a bug while fetching the wishlist

Firebase & User orders

41- Create the orders model and provider class
Implement the place order method to save the orders on the Firebase
Implement the Fetch orders method
Finalize the orders and display it for the user

Firebase & Fixes

Save extra user info on google sign in

Firebase – Admin panel (Part 2)

Improve the edit product screen UI
Start fetching the orders and display it in the admin panel
Refactor the fetching orders widget
Display the correct orders information
Stripe implementation with Firebase

Enroll for Free