Back to Changelog
Changelog

How to Add Dynamic Content to Your Next.js App

Tony Spiro's avatar

Tony Spiro

October 10, 2017

cover image

Next.js is an awesome framework to help you build universal React apps.  You get the best of both worlds, server-side rendering for SEO and fast client-side interactions.  In this video tutorial I show you how to add dynamic content to your Next.js using Cosmic.



Too long, didn't watch:
In this tutorial we use the Cosmic NPM module to add content from our Bucket to our Next.js app.  Here's what we built in the pages/index.js file of our example app:

To add Cosmic-powered content all we need to do is connect to our Bucket with a config variable then add the addObject method to the getInitialProps method.  To do this, we need to wrap addObject with a Promise.  Then populate your content using the props.

If you have any questions please reach out to us on Twitter and join our Slack community.