Building a Next.js Multistore Food App: Tutorial with TypeScript, Clerk Authentication, and Firebase
15.2 هزار بار بازدید -
2 ماه پیش
-
"🛠 Dive into the world
"🛠 Dive into the world of fullstack development with our comprehensive tutorial on building a multistore web application using Next.js and TypeScript! 💻 Learn how to seamlessly integrate Clerk for user authentication, providing a secure and intuitive login experience. 🔐 Leverage the power of Firebase storage to efficiently manage your application's assets, from images to documents. 📦 Explore the versatility of Firestore collections for robust data management, ensuring scalability and performance. 🌟 Key features include:
🙏 Special Thanks : @codewithantonio
⭐️⭐️ Source Code : https://buymeacoffee.com/vetrivelravi... ⭐️⭐️
⭐️ Helper Files & Codes:
📂 Images : https://drive.google.com/drive/folder...
📂 Helper Codes : https://gist.github.com/c7a44b9f696b6...
Project Live URL:
🌐 Client Live URL : https://food-client-nextjs-2024.verce...
🌐 Admin Live URL : https://e-commerce-admin-dashboard-al...
1️⃣ Seamless User Authentication with Clerk
2️⃣ Efficient Asset Management with Firebase Storage
3️⃣ Scalable Data Management with Firestore Collections
Whether you're a seasoned developer seeking to expand your skillset or a newcomer eager to learn, this tutorial provides step-by-step guidance and insights into building modern web applications with cutting-edge technologies. Get ready to elevate your development game and create innovative solutions for the web! 🚀"
Chapters:
00:00 - Project Overview
11:11 - Environment Setup
26:25 - Clerk Auth
49:13 - Store Modal
1:12:06 - Store Form
1:25:03 - Firebase Configuration
1:36:22 - Store Data to Firebase
1:50:06 - Fetch User Store
2:21:34 - Navigation Bar
2:31:27 - Store Switcher
3:05:29 - Settings Screen
3:59:22 - Billboard
05:43:24 - Billboard Fetch
06:32:04 - Categories
07:06:33 - Sizes
07:42:42 - Kitchens
07:55:30 - Cuisines
08:07:20 - Products
09:22:16 - Orders UI
09:44:37 - Delete All Subcollections
09:58:17 - Product Search Query API
10:11:24 - Client Environment Setup
11:06:38 - Home Screen
11:42:23 - Apply Search Filters
12:10:06 - Menu Page UI
12:24:37 - Product Page
12:54:15 - Cart
13:40:57 - Stripe Integration
14:43:40 - Client Orders Screen
14:56:57 - Dashboard Overview Analysis
15:26:52 - Deployment
🌎 Find Me Here:
https://codewithvetri.web.app/
Facebook: Facebook: velvetri452
Instagram: @vetrivel_ravi
Linkedin: LinkedIn: velvetri
🙏 Special Thanks : @codewithantonio
⭐️⭐️ Source Code : https://buymeacoffee.com/vetrivelravi... ⭐️⭐️
⭐️ Helper Files & Codes:
📂 Images : https://drive.google.com/drive/folder...
📂 Helper Codes : https://gist.github.com/c7a44b9f696b6...
Project Live URL:
🌐 Client Live URL : https://food-client-nextjs-2024.verce...
🌐 Admin Live URL : https://e-commerce-admin-dashboard-al...
1️⃣ Seamless User Authentication with Clerk
2️⃣ Efficient Asset Management with Firebase Storage
3️⃣ Scalable Data Management with Firestore Collections
Whether you're a seasoned developer seeking to expand your skillset or a newcomer eager to learn, this tutorial provides step-by-step guidance and insights into building modern web applications with cutting-edge technologies. Get ready to elevate your development game and create innovative solutions for the web! 🚀"
Chapters:
00:00 - Project Overview
11:11 - Environment Setup
26:25 - Clerk Auth
49:13 - Store Modal
1:12:06 - Store Form
1:25:03 - Firebase Configuration
1:36:22 - Store Data to Firebase
1:50:06 - Fetch User Store
2:21:34 - Navigation Bar
2:31:27 - Store Switcher
3:05:29 - Settings Screen
3:59:22 - Billboard
05:43:24 - Billboard Fetch
06:32:04 - Categories
07:06:33 - Sizes
07:42:42 - Kitchens
07:55:30 - Cuisines
08:07:20 - Products
09:22:16 - Orders UI
09:44:37 - Delete All Subcollections
09:58:17 - Product Search Query API
10:11:24 - Client Environment Setup
11:06:38 - Home Screen
11:42:23 - Apply Search Filters
12:10:06 - Menu Page UI
12:24:37 - Product Page
12:54:15 - Cart
13:40:57 - Stripe Integration
14:43:40 - Client Orders Screen
14:56:57 - Dashboard Overview Analysis
15:26:52 - Deployment
🌎 Find Me Here:
https://codewithvetri.web.app/
Facebook: Facebook: velvetri452
Instagram: @vetrivel_ravi
Linkedin: LinkedIn: velvetri
2 ماه پیش
در تاریخ 1403/02/19 منتشر شده
است.
15,217
بـار بازدید شده