1️⃣ Get Started with MongoDB 👉 https://fandf.co/48QTwh2
2️⃣ Get Started with Clerk 👉 https://go.clerk.com/sonny
❗️Get the Full Source Code for FREE here 👉 https://www.papareact.com/ai-newslett...
🚨 Join the world’s BEST developer community & course Zero to Full Stack Hero: https://www.papareact.com/course
🛠️ Looking for the Code for my other builds? (Plus over 55+ others!)
https://links.papareact.com/github
Join me as I show you how to build an AI Powered Newsletter SaaS App from scratch with the latest Next.js 16 - This comprehensive tutorial covers everything you need to create an AI Newsletter SaaS App with Subscriptions & Payments!
🎯 What You'll Learn:
Next.js 16 with React 19
MongoDB + Prisma
Clerk authentication & billing
OpenAI GPT-4o integration
RSS feed aggregation
Vercel AI SDK streaming
AI newsletter generation with customizable models
Smart 3-hour caching system
Article deduplication
Plan-based feature gating
Newsletter history
Real-time streaming UI
SO MUCH MORE!
🎵 WANT TO LISTEN TO THE EXCLUSIVE PAPAFAM PLAYLIST?
Sign up for the PAPAFAM Newsletter here 👉 https://links.papareact.com/newsletter
🕐 TIMESTAMPS:
0:00 Introduction
1:00 Build Demo
11:03 MongoDB Atlas & Clerk
14:07 Build Tech Stack Breakdown
18:25 MongoDB Myths Debunked
22:40 Build Plan
25:50 Initialising the Build
32:30 Setting Up MongoDB Atlas
38:02 Setting Up Clerk for Authentication
42:41 Setting Up Clerk Billing
43:58 Setting Up Shadcn
46:04 Setting Up & Explaining Prisma
51:57 Connecting MongoDB Atlas
53:27 Building the Database Schema with Prisma
1:05:49 Implementing Prisma
1:09:22 Building the Landing Page (1/2)
1:17:14 Implementing Clerk Billing in the Landing Page
1:19:57 Building the Landing Page (2/2)
1:22:31 Building the Pricing Cards in the Landing Page
1:24:13 Creating the Starter & Pro Pricing Plans with Clerk Billing
1:32:36 Creating the Dashboard Page
1:36:46 Building the Dashboard Header Section
1:51:18 Building the Rest of the Dashboard Page
1:55:24 Implementing the RSS Feed(s) Feature (1/2)
2:02:49 Creating Server Actions
2:11:45 Implementing the RSS Feed(s) Feature (2/2)
2:16:43 Implementing Delete Functionality for RSS Feed(s)
2:18:23 Explaining the Smart 3-Hour Caching System for RSS Feed(s)
2:22:35 Explaining the RSS Parser Library
2:26:03 Testing the RSS Feed(s) Feature
2:31:07 Building the Newsletter Form Component
2:38:37 Implementing the Newsletter Generation Functionality (1/2)
2:40:54 Setting Up & Implementing Vercel AI SDK
2:43:22 Explaining Zod
2:44:09 Implementing the Newsletter Generation Functionality (2/2)
2:58:43 Explaining the Complete Newsletter Generation Prompt
3:08:22 Building the Newsletter Display Component
3:14:07 Creating API Endpoints in Next.js 16
3:18:42 Testing the Newsletter Generation Functionality
3:23:20 Building the Newsletter History Functionality
3:30:38 Building the Settings & Account Pages
3:37:32 Final Build Demo
3:41:34 Build Summary & Outro
Let’s get it PAPAFAM 🔥.
DISCLAIMER: This video is sponsored by MongoDB. This video is made for informational and educational purposes only. Copyright Disclaimer under section 107 of the Copyright Act 1976, allowance is made for “fair use” of this video for education purposes.
#nextjs #ai #mongodb #openai #react #react19 #webdevelopment #webapp #clerk #newsletter #saas #learning #coding #tutorial #beginner #programming
