In this full stack tutorial, @elliottchong will teach you to build and deploy a fully featured AI powered email client using NextJS 14 and Vercel.
GitHub Repo: https://github.com/elliott-chong/normalhuman
This course covers:
🌐 Leveraging NextJS 14's cutting-edge App Router.
💳 Managing Payments seamlessly through Stripe.
🎨 Harnessing the beauty of Shadcn and the power of Tailwind CSS.
🧠 Unleashing the capabilities of OpenAI's API for Language Model usage.
Looking to start and monetize your SaaS?
Check out: https://www.start-saas.com
🙏 Credits & Inspirations
Normal Human Email Client
ShadCN's Email UI
📚 Referenced Resources
Aurinko Email API: https://docs.aurinko.io/
⭐️ Contents ⭐️
0:00:00 intro and demo
0:13:12 architecture explanation
0:21:02 Aurinko email client explanation
0:40:31 Initialise NextJS & Clerk
1:24:21 Set up Aurinko and sync emails
2:47:27 Begin creating shadcn email UI
3:00:10 tRPC explanation
3:06:26 Creating sidebar
3:30:51 Thread list in the middle
3:57:01 Add dark mode
4:00:36 Thread display on the right
4:24:06 Kbar setup
4:41:51 Reply box
5:22:04 AI compose feature
4:46:11 Compose drawer
5:51:11 Send email API
6:04:56 Syncing new emails
6:14:07 Full text search with Orama
6:51:46 AI RAG chat
7:33:12 Stripe integration
8:20:08 Deploy and outro🎉 Thanks to our Champion and Sponsor supporters:
👾 Drake Milly
👾 Ulises Moralez
👾 Goddard Tan
👾 David MG
👾 Matthew Springman
👾 Claudio
👾 Oscar R.
👾 jedi-or-sith
👾 Nattira Maneerat
👾 Justin Hual
--
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news