Pre-Rendering with Static Generation – Learn Next.js Tutorial Series
Javier Alaves Javier Alaves
6.74K subscribers
520 views
0

 Published On Mar 24, 2021

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. This is part three of the series, and it's all about Next.js' pre-rendering feature through Static Generation.

By the end of this video, you will have successfully learned how to pre-render blog data that lives inside your app's file system, and display it on-demand in your website; all while achieving optimal site performance. Also, we'll be more than half way through the series!

For the code snippets, keep a tab open: http://nextjs.org/learn

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:    • Getting Started with Next.js – Learn ...  

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:   / javalaves  
Figma: https://www.figma.com/@javi
LinkedIn:   / javieralaves  

Chapters:
0:00 - Welcome
1:02 - Intro to Static Generation
1:46 - Adding Blog Data
3:32 - Parsing
6:34 - getStaticProps()
8:01 - Displaying data
9:37 - Conclusion

show more

Share/Embed