Diving into the Next.js 14 App Router

Continuing the series on Next.js, Aurooba and Brian take a look at a Next.js version of https://wpaudit.site complete with a login set up and ability to save your own checklist.

A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!
- Next.js 14 App Router - https://nextjs.org/docs/app
- Brian's website – https://www.briancoords.com
- Aurooba's website – https://aurooba.com

• (00:00) - Introduction
• (00:18) - Next.js' relationship with React
• (04:25) - Really exploring Next.js
• (07:34) - The Next.js clone of WPAudit.site
• (09:08) - Styling the login page to match
• (12:30) - Creating Pages in Next.js
• (13:14) - Generating opengraph images in Next.js
• (14:47) - Folder based page routes
• (16:51) - Next.js 14 Server components
• (18:41) - Caching in Next.js
• (19:29) - Loading Experiences in React
• (21:20) - Using Middleware in Next.js
• (23:15) - Fetching data in Next.js 14
• (24:51) - Server Actions in Next.js 14
• (27:55) - Using Vanilla-Extract for styling
• (35:01) - Why use CSS-in-JS?
• (36:18) - How CoPilot helps you do grunt dev work
• (39:37) - Saving the Checklist for each user
• (41:16) - Looking at the Audit table in Supabase
• (42:14) - Balancing current project needs with future needs
• (43:53) - Conclusion