Build AI Google Doc Clone with Next.js, Typescript, Clerk, Prisma, Neon (Postgres), OpenAI, ShadCN
Вставка
- Опубліковано 4 лип 2024
- Hi all 👋! In this tutorial, you will learn how to create full stack Google Doc clone, with AI features to help you suggest storylines, plot twist and even resume ideas while covering all CRUD operations such as adding, editing, deleting docs, authentication, data manipulation using Next.js, TypeScript, React, Clerk, Google Sign in, Prisma, Neon, ShadCN UI, React Hook forms, Zod, OpenAI, TailwindCSS and more.
📑FREE Modern Next.js 15+ Guide: oliverthedev.com/next15guide
🚀The Ultimate Modern Next.js Complete Course 2024: www.udemy.com/course/ultimate...
⭐ Github Repo for this project: github.com/oliver-gomes/quill...
💡 OLIVER THE DEV COMMUNITY:
nas.io/oliver-the-dev (Support me for the price of a coffee & get exclusive content and resources for career advancement)
✅ SUBSCRIBE SO YOU DON’T MISS ANY TUTORIALS
/ @oliverthedev
⏰ T I M E S T A M P S
00:00 App Demo
07:02 Installation
08:43 Neon Database
10:00 Data Model Prisma
14:50 Clerk Auth
18:00 Components
38:48 New Document
54:30 Recent Document
1:04:58 Single Document
1:08:22 Editor Block
1:46:35 Drawer AI
1:51:56 Open AI Implementation
2:14:00 Doc Templates
2:19:55 Fixing Common Errors and adding Suspense
2:25:52 Recap Demo & Outro
📍CONNECT WITH OLIVER THE DEV:
Twitter/X: / oliver_thedev
Instagram: / oliverthedev
Github: github.com/oliver-gomes
#nextjs #vercel #reactjs #nextjstutorial #openai
Great job bro, keep it up
Thank you! Glad you enjoyed it 😄🙌
can i use gemini api rather than open Ai
thanks for sharing but why we can't add images using this editor?
Hey, you should be able to add images, I mean i can add images to the editor when i click on the picture icon and upload image from my computer. This feature was added in the editor.tsx modules.
@@oliverthedev Thanks, I will recheck it because it's not working in my code
Great, which VS theme you’re using.
Thanks! I am using Material Theme High Contrast