Build and Deploy a Full Stack SaaS Trello Clone Using Nuxt JS 3, MongoDB, Tailwindcss, Stripe

#nuxtjs #saas #mongodb In this video course, we're diving deep into building a Trello/Google Taskboard clone, a popular project management tool, using some of the most exciting technologies in web development today: Nuxt.js, MongoDB, Tailwind CSS, Stripe, and many more. This course is tailored for those who aspire to create scalable, efficient, and visually appealing SaaS applications. ✨ Need help? Contact Me: https://jahid.dev/contact 🔗 Useful Resources: Discord for Problems or Error: https://jahid.dev/d Twitter: https://jahid.dev/go/tt GitHub Repository: https://github.com/jahidanowar/nuxt-trello Live Website: https://nrello.vercel.app/ ☁️ Other Deployment tutorials - Bare-Metal (With Dokku): https://www.youtube.com/watch?v=AXW-YW1fSlI - Digital Ocean App Platform: https://youtu.be/hANbHC90xug ⏰ Chapters 00:00 Introduction 00:38 Project Demo 08:20 Project Setup 18:00 Authentication 01:46:00 Board Resource 02:46:00 List Resource 02:46:45 Building Dynamic Image Picker 02:57:58 Using Provide/Inject Vue Proeprty 03:45:00 Drag & Drop List feature 04:15:00 Card Resource 04:35:00 Card Drag & Drop to Move between lists 05:44:00 Adding SaaS Feature 05:47:20 Setup Stripe Product 05:50:00 Stripe CLI setup to test Webhooks locally 06:43:00 Creating Stripe Webhooks Listener in Nuxt 07:21:40 Fine-tuning 07:34:00 Deployment 👨‍💻 Who is this for? This course is perfect for: - Developers looking to enhance their full-stack skills. - Anyone interested in building real-world web applications. - Learners curious about modern web technologies and SaaS development. 📄 Project Details Nuxtrello is a full-stack web application inspired by Trello. This project is built using Nuxt 3, MongoDB, and Tailwind CSS, focusing on creating an efficient, user-friendly task management and organization tool. 👉 Topics Introduction Overview Project Demo Project Data model Project Setup Installing Nuxt 3 Adding Required Dependencies Connecting to MongoDB Creating basic layout User Authentication Creating User Model Creating User API Routes Creating User Authentication API Routes Creating User Authentication Pages Boards Resource Creating Board Model Creating Board API Routes Creating Board Pages Creating Image Picker Component Lists Resource Creating List Model Creating List API Routes Creating List Pages Adding List Editor Adding Drag and Drop Functionality Card Resource Creating Card Model Creating Card API Routes Creating Card Pages Adding Rich Editor Adding Drag and Drop Functionality SaaS Features Modify User Model for SaaS Integrate Stripe Create essential SaaS API endpoints Create useSubscription composable Design payment modals Deployment Deploying to Vercel/Netlify/Digital Ocean ⚙️ Technologies and Tools Used: - Nuxt.js 3 - MongoDB - Tailwind CSS - Vue.js - Node.js 🙌 Stay Connected: For more exciting content, tutorials, and updates, make sure to subscribe to our channel and hit the bell icon for notifications. 💬 Join the Conversation: Got questions or feedback? Leave your comments below, and let's discuss! I'm here to help and interact with all of you. 👍 Support the Channel: If you find this tutorial helpful, please like, share, and consider subscribing. Your support means a lot!