Build & Deploy a Notes App | Next.js 15, React, Shadcn, Better Auth | Full Course 2025
In this full-stack crash course, you'll build and deploy a complete Notes App using the latest tools: Next.js 15, React, Shadcn UI, and Better Auth authentication with email, password, and Google sign-in. You'll also implement a rich text editor, server actions, dark mode, custom themes, and more — all step-by-step.
Whether you're a beginner looking to level up or a developer wanting to explore the latest in Next.js and React, this project-based course is for you!
🚀 What You'll Learn:
Next.js 15 app setup & routing
Shadcn UI integration & theming
Better Auth (email/password + Google OAuth)
Email sending
Email Verification of Users
Forgot / Reset Password
Server Actions & database logic
Rich text editor with Tiptap
Responsive UI with sidebar navigation
Project deployment to Vercel with a custom domain
Here is the link to the NoteForge app:
https://www.noteforge.dev/
Source code:
https://github.com/TheOrcDev/noteforge
Make sure to check 8bitcn!
https://www.8bitcn.com/
If you're looking for custom web solutions to elevate your business, we've got you covered!
👉 Visit us at: https://www.hordewebsolutions.com/
Next video to watch:
• Simplest way to build Dashboard (Next.js 1...
⚔️ Join The Horde
Discord: / discord
Github: https://github.com/TheOrcDev
X: https://x.com/theorcdev
Some of the projects to check:
Dashboard: https://github.com/TheOrcDev/orcish-d...
AI Framework: https://github.com/TheOrcDev/orcish-a...
My first SaaS project, register and get 5 free tokens!
https://www.textualgames.com/
00:00:00 Intro
00:01:32 Creating the GitHub Repository
00:02:01 Initializing the Next.js 15 App
00:03:04 Setting Up Shadcn UI
00:03:38 Building the Landing Page
00:09:42 Implementing Dark Mode
00:13:53 Authentication Setup
00:46:29 Email Verification Flow
00:53:28 Forgot & Reset Password Feature
01:04:12 Adding Google Authentication
01:08:22 Creating the Sidebar Layout
01:11:43 Building the Page Wrapper
01:17:52 Planning the Database Architecture
01:20:32 Notebooks – Server Actions
01:27:35 Creating a New Notebook
01:35:35 Notes – Server Actions
01:37:01 Setting Up Notebook–Note Relationships
01:41:51 Building the Note Page
01:44:22 Integrating Rich Text Editor
01:53:26 Creating the Notebook Page
02:05:06 Displaying Notes & Notebooks in Sidebar
02:07:20 Implementing Search Functionality
02:15:12 Editor – Heading Support
02:18:02 Creating a Global Theme
02:19:20 Final UI Polish
02:27:04 Fixing All TypeScript Errors
02:30:34 Project Deployment
02:32:39 Buying a Custom Domain
02:34:10 Connecting Domain to Google Cloud
02:35:15 Outro
#webdevelopment #orcdev #react #nextjs #typescript