Next.js Pages, Layout, Links, Routes & Loading | Next.js 13 tutorial

Dave Gray

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap

Learn about Next.js pages, layout, links, routes, loading, error handling and CSS modules in this Next.js 13 tutorial. Next.js has many built-in features to make building a full stack web app easier!

💖 Support me on Patreon ➜ https://patreon.com/davegray

⭐ Become a full-stack web dev with Zero To Mastery Courses:
– Complete Next.js Developer: https://bit.ly/CompNextJSDev
– Advanced React: https://bit.ly/AdvReactDev
– Junior to Senior Dev Roadmap: https://bit.ly/WebDevRoadmap-JrtoSr

🚩 Subscribe ➜ https://bit.ly/3nGHmNn

📬 Course Updates ➜ https://courses.davegray.codes/

❓ Questions – Please post them to my Discord ➜ https://discord.gg/neKghyefqh

☕ Buy Me A Coffee ➜ https://www.buymeacoffee.com/davegray

👇 Follow Me On Social Media:
Github: https://github.com/gitdagray
Twitter: https://twitter.com/yesdavidgray
LinkedIn: https://www.linkedin.com/in/davidagray/

🔗 Source Code: https://github.com/gitdagray/next-js-course

🔗 Playlist for this Next.js Course: https://bit.ly/dg-nextjs

Next.js Pages, Layout, Links, Routes & Loading

(00:00) Intro
(00:09) Welcome
(00:28) Starter Code
(01:13) Create an about page & route
(03:59) Root Layout component
(05:09) Nested layout component
(07:54) Adding links to pages
(10:26) CSS modules
(15:19) Changes with Metadata
(16:51) head.tsx – soon to be deprecated
(19:19) Loading with React Suspense
(20:48) Error Boundaries

📚 Tutorial References:
🔗 Next.js Official Site: https://nextjs.org/
🔗 Next.js 13 Beta Docs: https://beta.nextjs.org/docs

Was this Next.js tutorial about pages helpful? If so, please share. Let me know your thoughts in the comments.

#next #js #pages