Blog
Next
How to Deploy Next.js on Cloudflare Workers

How to Deploy Next.js on Cloudflare Workers

A simple beginner guide to connect Cloudflare to a Next.js project and deploy it to Cloudflare Workers using Wrangler and OpenNext.

5 min read

Overview

If you want to deploy a Next.js app on Cloudflare Workers, this is one of the simplest ways to do it.

You will use:

  • Next.js
  • Cloudflare Workers
  • Wrangler CLI
  • OpenNext for Cloudflare

This setup is beginner-friendly and works well for modern Next.js projects that use the standard Node.js runtime.

What You Need

Before you start, make sure you have:

  • a Next.js project
  • a Cloudflare account
  • Node.js installed
  • Wrangler CLI installed and logged in

Login command:

npx wrangler login

Step 1: Install Wrangler

If Wrangler is not installed yet, run:

npm install -D wrangler@latest

Check it:

npx wrangler --version

For modern OpenNext deployments, keep Wrangler updated. Current OpenNext docs require a recent Wrangler version for Next.js on Workers.

Step 2: Install the Cloudflare Adapter

For an existing Next.js project, the easiest method is:

npx @opennextjs/cloudflare migrate

This command prepares the project for Cloudflare and typically sets up:

  • wrangler.jsonc
  • open-next.config.ts
  • deploy scripts
  • Cloudflare build support for your Next.js app

If your project is older, review the generated files before deploying so you understand what changed.

Step 3: Make Sure Your App Builds

Run:

npm run build

If your build fails, fix those errors first. Do not deploy before the Next.js production build works cleanly.

Step 4: Preview Locally

Test the Cloudflare version locally:

npm run preview

This is useful because it runs your app closer to the real Cloudflare Workers runtime, which helps you catch deployment-specific issues earlier.

Step 5: Deploy to Cloudflare Workers

Now deploy your Next.js app:

npm run deploy

If your project uses Wrangler directly, this can also work:

npx wrangler deploy

After deployment, Cloudflare gives you a workers.dev URL.

Example:

https://your-app-name.your-account.workers.dev

Important Tips

Use the Node.js Runtime

OpenNext for Cloudflare is designed around the Node.js runtime for Next.js. If you have routes that explicitly use the Edge runtime, review them before deploying.

Check Generated Cloudflare Bindings

If your project uses caching, images, or extra bindings, Cloudflare may also create or expect:

  • an R2 bucket
  • an Images binding
  • a Worker self-reference binding

Much of this can be handled automatically by the OpenNext migration, but it is still worth checking your generated wrangler.jsonc.

Keep the Wrangler Config Intact

When OpenNext generates a wrangler.jsonc, avoid changing core output fields unless you know why. That config is what lets your built Next.js app run correctly on Workers.

Why Use Cloudflare Workers for Next.js?

  • fast global deployment
  • simple CLI-based workflow
  • good performance at the edge
  • works well for modern Next.js apps

Final Commands

npx wrangler login
npx @opennextjs/cloudflare migrate
npm run build
npm run preview
npm run deploy

Conclusion

To connect Cloudflare to a Next.js project and deploy Next.js to Cloudflare Workers, you mainly need Wrangler, the OpenNext Cloudflare adapter, and a clean production build.

If you are a beginner, follow this order:

  1. log in to Cloudflare
  2. run the migration
  3. test the build
  4. preview locally
  5. deploy

That is the simplest way to deploy Next.js to Cloudflare Workers without getting lost in setup.

Website heavily inspired by Chánh Đại.

Learning as I build. Here's the code