In this tutorial, we will build a powerful AI resume builder using Next.js and Hono for a lightweight backend API, Drizzle ORM, Gemini AI, Tailwind CSS, and React Query. Hosted on Vercel Postgres for a reliable, high-performance database. Get ready to build and deploy a production-ready AI resume builder with PDF download capabilities!
#nextjs14 #reactjs #tailwindcss #gemini #coding
📺👉 Part 2 -
https://www.youtube.com/watch?v=faHNSBGKLS0
🙌 Support my work by giving a "Super Thanks!" Your support helps me keep creating amazing content!"
🙏🙏 Like & Subscribe To the Channel - https://tinyurl.com/subcribe-to-techwithEmma
🐦 Follow us on Twitter: https://x.com/techwithemma
🖼️ Follow us on Instagram: https://www.instagram.com/techwithemmaofficial
⭐Build an AI Resume Builder with Next.js, React, Honojs, Kinde, Drizzle Orm, TailwindCSS, Gemini AI, and Vercel Postgres, | PDF Download 1/2
🚀Live Deployed Version
👉https://cvbuild-ai.vercel.app/
💻👉 Access the course files on GitHub (Give a Star ⭐):
Read the READ ME:
Course files:https://github.com/TechWithEmmaYT/AI-Resumes-Builder
💻👉 Build and Deploy: TWITTER Clone with Next, Auth, Prisma, Neon, Tailwind & Stripe (2024!:
on Youtube:
https://www.youtube.com/watch?v=t-BhFbiDxxk&t=102s
💻👉 Tailwind CSS Full Course | Build an AI Saas Website:
on Youtube:
https://www.youtube.com/watch?v=4LaRHJUZ_sc&t=68s
💻👉 Tailwind CSS Full Course | Build an AI Saas Website:
on Youtube:
https://www.youtube.com/watch?v=4LaRHJUZ_sc&t=68s
💻👉 Zustand FULL COURSE in 2024:
on Youtube:
https://www.youtube.com/watch?v=H6K4TjKI_AU
💻👉 Shadcn ui Crash Course: Reactjs/Next.js 14 UI Components Everyone's Using!:
on Youtube:
https://www.youtube.com/watch?v=Q3hZybuD_xQ
💻👉 VSCode Productivity Tips and Keyboard Shortcuts:
on Youtube:
https://www.youtube.com/watch?v=pfPvzhdpCbA
🗝️Key Features: 👇
🔐 Authentication with kinde - Google Signin
➕ Creating Resume
✏️ Editing Resume
🎨 Resume Theme colors
📸 Resume Thumbnail
🗨️ Shareable Resume Link
🔎 Search Trash Resume
📡 Real-time Editing
🔗 Preview mode
👨💻 Download Resume to PDF FORMAT
🤖 Resume Generation with AI
⚛️ Built with Next.js 14
🎨 Styled with TailwindCSS and Shadcn UI
🪝 Hono Api & Tanstack React Query
💾 Vercel PostgreSQL & Drizzle ORM
🚀 Deployed on Vercel
📚 Chapters 👇
00:00 Intro
00:38 Demo
01:49 Project Setup
11:53 Project Structure
23:58 Kinde Authentication
40:03 Dashboard Header
01:05:59 HonoJS
01:32:46 Protected API Route - HonoJS
01:48:46 Vercel Postgres Setup
01:59:14 Drizzle Orm Setup
02:26:27 Relationship In Drizzle Orm
02:53:43 Create Resume
03:41:19 Fetch All Resumes
04:25:15 Top Section
05:11:51 Preview Section
06:07:21 Personal Info Form
🗃️Resources 👇
🔗👉NextJS - https://nextjs.org/
🔗👉Kinde -https://kinde.com/
🔗👉Vercel Postgres -https://vercel.com/docs/storage/vercel-postgres/using-an-orm#drizzledollar
🔗👉Drizzle - https://orm.drizzle.team/docs/overview
🔗👉ReactQuery - https://tanstack.com/query/latest
🔗👉TailwindCSS - https://tailwindcss.com/
🔗👉Shadcn UI - https://ui.shadcn.com/docs/installation/next
🙌 Support my work: https://buymeacoffee.com/techwithemmaofficial ☕️
💻👉Like & Subscribe To the Channel
Channel: https://tinyurl.com/subcribe-to-techwithEmma
☀️Next.js AI Resume Builder Tutorial: React, Vercel Postgres, Open AI & PDF Download
Skip this:
open ai
chatgpt
gemini ai