Chapters (21)
- 0:00intro and demo
- 13:12architecture explanation
- 21:02Aurinko email client explanation
- 40:31Initialise NextJS & Clerk
- 1:24:21Set up Aurinko and sync emails
- 2:47:27Begin creating shadcn email UI
- 3:00:10tRPC explanation
- 3:06:26Creating sidebar
- 3:30:51Thread list in the middle
- 3:57:01Add dark mode
- 4:00:36Thread display on the right
- 4:24:06Kbar setup
- 4:41:51Reply box
- 5:22:04AI compose feature
- 4:46:11Compose drawer
- 5:51:11Send email API
- 6:04:56Syncing new emails
- 6:14:07Full text search with Orama
- 6:51:46AI RAG chat
- 7:33:12Stripe integration
- 8:20:08Deploy and outro🎉 Thanks to our Champion and Sponsor supporters
Show the creator's full description
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/
❤️ Try interactive AI courses we love, right in your browser: https://scrimba.com/freeCodeCamp-AI (Made possible by a grant from our friends at Scrimba)
⭐️ 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
Description and video by freeCodeCamp.org. This page is an independent companion view; the video is embedded from YouTube.