These days there are so many providers for JAMstack hosting, it's hard to choose. Netlify, GitHub Pages, Vercel, Heroku, ... the New Dynamic has

Running a Next.js Site on Cloudflare Pages

submited by
Style Pass
2021-07-14 19:30:04

These days there are so many providers for JAMstack hosting, it's hard to choose. Netlify, GitHub Pages, Vercel, Heroku, ... the New Dynamic has a list of over 30 different hosting/deployment tools, with new ones being added regularly. However, the new kid in town caught our attention: Cloudflare Pages. They have only been around for a few months now, but since we already use Cloudflare for DNS and CDN, consolidating tools could be a nice win.

Cloudflare Pages radically simplifies the process of developing and deploying sites by taking care of all the tedious parts of web development. Now, developers can focus on the fun and creative parts instead. – https://blog.cloudflare.com/cloudflare-pages-ga/

Given they're just starting up, the features are still a bit limited. One of the biggest drawbacks as of this moment is the lack of a server to generate dynamic content. Currently, Cloudflare uses the Next.js static HTML export to prerender all pages to plain html. Given we don't use any server-side rendering capabilities at the moment, this was good enough to move forward now, but we are also excited to see the further development of Cloudflare Pages.

Assuming you have a Next.js website and both next build and next export run through without any errors (you'll probably see an error when using next/image, we'll get to that in a moment), make sure everything is committed and pushed to a repository. In addition, make sure you create alias scripts in package.json for build and export:

Leave a Comment