Dynamic Routes – Learn Next.js Tutorial Series

Learn how to build a website with Next.js in this new tutorial series, where we'll go from zero to publishing a very simple blog app following Next.js' official learn docs. In the second to last video of the series, we'll talking about dynamic routes!

By the end of this video, you'll have successfully set up dynamic routes for all of your blog posts, and have those connected to your blog's homepage with the Next.js Link component to optimal performance. Having done this, plus a couple of final polishing touches, and we'll be ready to deploy in our next video!

For the code snippets, keep a tab open: https://nextjs.org/learn/basics/dynamic-routes

If you are new to Next.js, I recommend that you have a look at my first video of this series, where we set up the dev environment and get the app started: https://youtu.be/ULJyNCU5Qh4

If you are not familiar with JS and React, I strongly recommend Codecademy (https://www.codecademy.com/) and Kyle's courses from Web Dev Simplified (https://courses.webdevsimplified.com/).

Let me know if you enjoyed watching this video and were able to follow along. If you have any questions or doubts related to anything that I covered (or haven't covered), drop everything in the comments section below! ?

If you are new to my channel, welcome! Don't forget to hit subscribe if you'd like to keep up with my weekly dose of product design videos and tutorials to help you build great products and bring your ideas to life.

Don't be a stranger and connect with me here ?
Twitter: https://twitter.com/javalaves
Figma: https://www.figma.com/@javi
LinkedIn: https://www.linkedin.com/in/javieralaves/

Chapters:
0:00 - Welcome
1:03 - Dynamic route file
2:42 - Getting a list of posts
4:50 - Fetching post by ID
6:34 - Post data as props
8:30 - Rendering markdown
13:10 - Final touches
14:36 - Conclusion