Next.js Dynamic Routes With Contentful's GraphQL API

Next.js has a popular approach for generating dynamic routes. In this episode, whitep4nth3r will teach us how to use Contentful’s GraphQL API to power them! 00:00:00 Intro 00:01:15 Guest Introduction 00:02:43 What do you like about Next.js? 00:06:44 Using GraphQL 00:14:22 What are we doing to do today? 00:16:23 Captioning Sponsored by 00:20:26 Contentful Introduction 00:31:28 Generating an API key 00:33:06 Installing GraphQL Playground 00:37:41 Using Netlify CLI 00:46:50 Using Async Await 00:51:29 Link from next Link 00:53:18 GetStaticPaths function 00:56:45 Fallback Value function 01:07:11 Pulling data like magic 01:22:28 Deploying the site 01:25:33 How to learn more about Contentful * demo: https://jamstack-memories.netlify.app/ * repo: https://github.com/learnwithjason/jamstack-memories Links: - https://www.contentful.com/ - https://jamstackconf.com/2021-videos - https://nextjs.org/docs/basic-features/data-fetching#getstaticprops-static-generation - https://twitter.com/jamstackconf/status/1446132787480649735 - https://github.com/whitep4nth3r/nextjs-contentful-blog-starter - Watch future episodes live https://twitch.tv/jlengstorf Credits: Local Elevator by Kevin MacLeod is licensed under a Creative Commons Attribution license (https://creativecommons.org/licenses/by/4.0/) Source: http://incompetech.com/music/royalty-free/index.html?isrc=USUAN1300012 Artist: http://incompetech.com/ Busybody by Audionautix is licensed under a Creative Commons Attribution license https://creativecommons.org/licenses/by/4.0/ Artist: http://audionautix.com/ Additional sound effects obtained from https://www.zapsplat.com