Next.js is a powerful Static Site Generator powered by React that gives you exceptional flexibility in how you fetch, pre-render and update the content that powers your web applications. In combination with Contentful — the headless content management platform — you can build, iterate, scale and deploy your content with ease.
In this workshop, Salma and Stefan will guide you through a fresh blog setup with Contentful and Next.js. You'll learn how to use Contentful's GraphQL API to generate dynamic pre-rendered static pages based on your blog entries, you'll explore the power of Contentful's Rich Text Field (it's so much nicer than a traditional WYSIWYG editor!) and understand how you can rebuild your website on content changes with either webhooks or Incremental Static Regeneration from Next.js.
Let's have a look at the agenda today and make an action plan so that you have your new Next.js/Contentful blog set up at the end of the day!
Learn how to set up a content model with different fields and references.
Learn how to fetch data with GraphQL.
Let's implement some data fetching and put it into your Next.js application.
Let's understand and implement custom Richtext rendering.
Let's implement next/image and a custom loader.
Learn how to rebuild your static site each time you publish a change in Contentful.
Let's take a look at the powerful open-source tooling, extensibility and learning resources available at Contentful.