Next.js + Contentful Dynamic Routes
Swashbuckling with Code Swashbuckling with Code
8.78K subscribers
4,877 views
0

 Published On Mar 21, 2022

Dynamic Routing in Next.js is amazingly simple to setup, but how it behaves and when to use each type can take more exploration. SSG, SSR, getServerSideProps, getStaticProps, getStaticPaths, etc... it can be a lot to take in. In this video I'll walk through a common scenario and explain the previous functions and methodologies to generate routes based on your Contentful content with the getEntries SDK method.

Playlist for this series:
   • Next.js + Contentful  

🐱 Repository for code in the video:
https://github.com/Jimmydalecleveland...

🗎 Next.js Docs:
https://nextjs.org/docs
https://nextjs.org/docs/api-reference...

🗎 Contentful Javascript SDK docs:
https://www.contentful.com/developers...
https://www.contentful.com/developers...

~~~~~~

00:00 - What we'll cover
01:13 - State of the project and expectations
02:51 - Creating more Contentful entries
04:50 - Using getServerSideProps with dynamic route file
07:12 - The `context` object and `params`
09:23 - Nesting a route for categories
11:04 - Get all entries of a type from Contentful
13:14 - How to limit `getEntries` by a field
16:11 - Passing Contentful data to the page component
16:51 - Dynamic rendering and handling errors
21:17 - `getStaticPaths` explanation and setup
27:28 - Tradeoffs between SSR and SSG
28:10 - `fallback` property quick explanation
30:25 - dynamically fetching entries for `getStaticPaths`
33:53 - Wrap-up and homework idea

~~~~~~

Follow Jimmy Cleveland's doings:
twitter:   / jimmydcleveland  
blog: https://blog.jimmydc.com/

#javascript #nextjs #contentful #cms

show more

Share/Embed