Building a Next.js Multistore Food App: Tutorial with TypeScript, Clerk Authentication, and Firebase

“🛠 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 : https://www.youtube.com/@UCW_4e6sUTMWHxlF06aErH9w

⭐️⭐️ Source Code : https://buymeacoffee.com/vetrivelravi/e/251589 ⭐️⭐️

⭐️ Helper Files & Codes:
📂 Images : https://drive.google.com/drive/folders/1PBhtBAmYw7pHsl3CgfTKhvLPSAnylP_9?usp=sharing
📂 Helper Codes : https://gist.github.com/c7a44b9f696b695148844331a0c6995a.git

Project Live URL:
🌐 Client Live URL : https://food-client-nextjs-2024.vercel.app/
🌐 Admin Live URL : https://e-commerce-admin-dashboard-alpha.vercel.app/

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: https://www.facebook.com/velvetri452
Instagram: @vetrivel_ravi
Linkedin: https://www.linkedin.com/in/velvetri/