Learn how to build and deploy a Notion clone in this full-stack tutorial. You will use NextJS 13.4, Vercel, and more. Throughout this journey, you will gain expertise in the following areas: 🌐 Leveraging NextJS 13's cutting-edge App Router. 🔥 Utilize DALLE AI Image Generation 🎨 Harnessing the beauty of Shadcn and the power of Tailwind CSS. 🧠 Unleashing the capabilities of OpenAI's API for Language Model usage. 🗃️ Interacting with databases with the efficiency of ORMs. 💻 Code: GitHub Repo: https://github.com/elliott-chong/aideation-yt 📋 Pastebins for Code Timestamps Timestamp 21.06 globals.css grainy https://pastebin.com/1Q1tfyFy Timestamp 1.45.35 TipTapMenuBar.tsx https://pastebin.com/4dMDEW0B Timestamp 2.09.12 /api/completion/route.ts https://pastebin.com/ADU34Ftq 📚 Referenced Resources Vercel AI SDK: https://vercel.com/blog/introducing-the-vercel-ai-sdk Connect With Me 🔥🚀 : Email: elliottchong16@gmail.com GitHub: https://github.com/elliott-chong Website: https://elliottchong.tech ⭐️ Contents ⭐️
⌨️ (0:00:00) Intro & Demo
⌨️ (0:03:48) Outline Knowledge
⌨️ (0:05:36) Set Up Project
⌨️ (0:08:07) Set Up shadcn
⌨️ (0:11:42) Set Up Clerk Auth
⌨️ (0:20:07) Landing Page
⌨️ (0:30:09) Dashboard UI
⌨️ (0:36:06) DrizzleORM
⌨️ (0:48:48) Create Note UI
⌨️ (0:58:12) OpenAI Generate Image Prompt
⌨️ (1:07:46) Create NoteBook API
⌨️ (1:24:25) Notebook Page UI
⌨️ (1:34:42) TipTap Editor & MenuBar
⌨️ (1:49:44) Debounce Save
⌨️ (2:03:58) AI Autocomplete
⌨️ (2:20:42) KBD UI
⌨️ (2:22:40) Firebase
⌨️ (2:45:57) Delete Note
⌨️ (2:50:55) Deploy & Outro 🎉 Thanks to our Champion and Sponsor supporters:
👾 davthecoder
👾 jedi-or-sith
👾 南宮千影
👾 Agustín Kussrow
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Justin Hual
👾 Otis Morgan 👾 Oscar Rahnama — Learn to code for free and get a developer job: https://www.freecodecamp.org Read hundreds of articles on programming: https://freecodecamp.org/news