Flutter Mobile App + Node.js Back End Tutorial – Code an Amazon Clone [Full Course]

preview_player
Показать описание

In this tutorial, you'll learn to build the UI of Amazon from scratch, create REST APIs, store data in MongoDB using Mongoose, use REST APIs with Flutter & Dart using Models, use the Flutter State Management tool as a provider, and create a cross platform app that works on Android and iOS.

⭐️ Course Contents ⭐️
(0:00:03) Introduction & Demo
(0:01:04) Setting Up The Flutter Project
(0:05:30) Setting Up Themes
(0:09:05) Folder Structure
(0:10:31) Setting Up Routes
(0:16:58) Auth Screen UI
(0:41:51) Initialising Node
(0:46:47) NPM & Dependencies
(0:52:25) Creating Server
(0:58:39) Nodemon
(1:02:37) Create your First API
(1:08:49) Exercise 1: Create GET API
(1:09:19) Solution 1
(1:20:12) Routers
(1:17:45) Middleware
(1:21:33) Sign up Route
(1:26:31) Connecting to MongoDB
(1:33:17) Creating User Model
(1:42:34) Sign up Route cntd
(2:09:19) Connecting Sign Up Route With Client Side
(2:31:04) Adding TextField & Form Validator
(2:34:45) Sign In Route / Exercise 2
(2:37:12) Creating Sign In Route (Solution 2)
(2:47:57) Connecting Sign In Route with Client Side
(3:04:01) Persisting State
(3:25:11) Creating BottomNavBar
(3:36:33) Account Screen UI
(4:04:39) Home Screen UI
(4:41:35) Admin Screen BottomNavBar
(4:49:38) Add Product Screen UI
(5:08:21) Picking Images
(5:17:16) Admin - Selling Product
(5:28:43) Create Admin Middleware / Exercise
(5:29:24) Solution
(5:31:39) Sell Product Contd.
(5:48:36) Admin - Fetching & Displaying All Products
(6:08:39) Admin - Deleting Product
(6:17:09) Self Exercise (Add Product Realtime)
(6:17:43) Getting & Displaying Products Based on Category
(6:41:19) Searching & Displaying Products
(6:47:59) Optional Exercise (Creating Search Product API)
(7:06:14) Product Details Screen UI
(7:25:58) Rating Products
(7:31:09) Rating Product API / Exercise
(7:31:43) Solution
(7:41:00) Display Ratings
(7:50:34) Fetch Deal of The Day (Optional Exercise)
(8:05:05) Adding To Cart
(8:31:46) Displaying Cart Products
(8:52:08) Decreasing Quantity in Cart
(9:00:33) Address Screen
(9:10:53) Adding GPay/ Apple Pay
(9:32:56) Storing User Address & Ordering
(9:55:55) Viewing My Orders
(10:06:07) Viewing Order Details
(10:28:37) Admin - Viewing All Orders
(10:37:42) Admin - Change Order Status
(10:45:53) Total & Category-Wise Earnings
(11:04:34) Display Sales Chart
(11:09:44) Log Out
(11:14:29) Deployment to Heroku
(11:19:55) Testing on Android Device
(11:21:46) (Bonus) Flutter 3 (Everything Works!)
(11:24:35) Material 3

🎉 Thanks to our Champion and Sponsor supporters:
👾 Raymond Odero
👾 Agustín Kussrow
👾 aldo ferretti
👾 Otis Morgan
👾 DeezMaster

--

Рекомендации по теме
Комментарии
Автор

I did that Instagram clone course released 4 months ago here, since then I have kept studying flutter every day, and now I can see a lot of progress.
Don't give up on your studies, keep going even if it is a tiny step each day.

KuroManX
Автор

For anyone watching this wondering where he gets the "Generate JSON serialization" option at 2:13:00, it's a VSCode extension called "Dart Data Class Generator". The original version he has is no longer on the marketplace, but there are forks of it still available.

_DigitalData
Автор

If someone asks to me to make a Amazon Clone like that, I would ask 1 month to get this done, but you made it in 12 hours! That's insane.

yrds
Автор

And guys he is just 18 years old... amazing man! 🙃

dn
Автор

As a Js - React dev, I Know React Native but always curious to see something different ... Behind Flutter there is Google so 🤩

universecode
Автор

I just love when everyone's using VSCode 😃

tolulopesoneye
Автор

Seems like a lot of progress in 11 hours. Cant wait to watch

nonstopper
Автор

My dude has used a meme for every sentence, lol

angmarliche
Автор

Finally completed this tutorial. Learned so many new things. Thanks Rivaan.❤

swapnilpingale
Автор

The channel name should be changed to Nerds Channel!
This is CRAZY!
Love it!

mohammadtarek
Автор

For anyone that is getting the "No Scaffold widget found", what I have found is that if you are calling anything in the initState() of the main.dart file and if it fails, it will try to launch the snackbar ("error_handler.dart") but the context doesn't exist yet. because the app has not been drawn yet. a possible solution is not to use the error handler for that call and just code something that will handle the error. Hope it helps, I spent 2 days trying to find the error.

vmescobars
Автор

Thank you very much, Sir Rivaan. I learned a lot of things during this tutorial.🙏🙏🙏🙏

kevinkone
Автор

He did 11 hours and I did one month :D by the way thanks for tutorial

abdulsametaybaz
Автор

JUST A KIND SUGGESTION:
In the near future, I'd suggest you frament the video into sections.
Instead of a single whole video of 11 hours length.
Great word👍

victorultimate
Автор

learn much things from here. Good start for newbie Futter

cokhongkhiep
Автор

An amazing course. So easy to follow. I got stock connecting the app to the database. I get an XMLHttpRequest error, this happened when i replaced the localhost with my IP address. I am a bigginer and i need more guidance. But i am impressed with what i have been able to accomplish up to this point. Thanks

takorronald
Автор

Thanks Rivaan. Appreciate these tutorials! I have a silly question, I’m completely new to app development, what is the difference between nodejs and Firebase? I understand that both are used for backend development. Could this app be built using Firebase?

mohameddawood
Автор

I request you to please make a clone of UDEMY Mobile app with admin panel using flutter and firebase. There must be an option for live streaming.

🙏🙏🙏Please🙏🙏🙏

balikaba
Автор

actually i download and watch this in my tablet, so thank you FCC and goodluck ATM"Amati Tiru Modifikasi" VS code

techsultanstudio
Автор

Bro I followed all instructions and steps u wrote in readme file still code is not running i clone from github

AkashSingh-zg