cloudflare-nextjs

Deploy Next.js applications to Cloudflare Workers using the OpenNext adapter.

Updated Sep 6, 2024
One-click install
npx skills add https://github.com/Jaylaelike/pm25-interactive-thaipbs-app --skill cloudflare-nextjs-jaylaelike
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: cloudflare-nextjs
Source: https://github.com/Jaylaelike/pm25-interactive-thaipbs-app/tree/main/.claude/skills/cloudflare-nextjs
Command: npx skills add https://github.com/Jaylaelike/pm25-interactive-thaipbs-app --skill cloudflare-nextjs-jaylaelike

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Deploying Next.js apps to Cloudflare Workers is challenging due to edge-runtime constraints, complex bindings, and integration setup. This Skill standardizes the deployment path using the OpenNext adapter to deliver production-ready edge-hosted Next.js apps.

Core Features & Use Cases

  • App Router & Pages Router support: Deploy Next.js with edge rendering, ISR/SSG, and Cloudflare caching.
  • SSR/ISR at the edge: Run server-side rendering and incremental static regeneration across global edge locations.
  • Migration & Setup Guidance: Starter config creation (wrangler.jsonc, open-next.config.ts) and deployment scripts to accelerate migration from traditional hosting.
  • Use Case: Move a Next.js app from a traditional host to Cloudflare Workers to reduce latency for global audiences.

Quick Start

Use the cloudflare-nextjs skill to scaffold and deploy a Next.js app to Cloudflare Workers with OpenNext.

Frequently Asked Questions about cloudflare-nextjs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I deploy a Next.js app to Cloudflare Workers?

To deploy Next.js to Cloudflare Workers, use the OpenNext adapter to handle edge constraints and configure bindings. This standardizes the deployment path for production-ready edge-hosted apps.

Does Cloudflare Workers support Next.js SSR and ISR at the edge?

Cloudflare Workers supports Next.js SSR and ISR at the edge using the OpenNext adapter. This enables server-side rendering and incremental static regeneration across global edge locations.

Can I deploy both App Router and Pages Router Next.js apps to Cloudflare?

You can deploy both App Router and Pages Router Next.js apps to Cloudflare. The OpenNext adapter supports edge rendering, ISR, SSG, and Cloudflare caching for both router architectures.

What configurations do I need to set up Next.js on Cloudflare Workers?

Setting up Next.js on Cloudflare Workers requires creating a wrangler.jsonc and open-next.config.ts file. You also need Wrangler, Next.js 14/15/16, and a Node.js runtime with nodejs_compat enabled.

How do I migrate my Next.js app from a traditional host to Cloudflare Workers?

Migrating Next.js to Cloudflare Workers involves using starter configurations and deployment scripts provided by OpenNext. This accelerates migration to reduce latency for global audiences.

Why is deploying Next.js to Cloudflare Workers challenging without an adapter?

Deploying Next.js to Cloudflare Workers is challenging due to edge-runtime constraints and complex bindings. The OpenNext adapter solves this by standardizing integration setup for production-ready deployments.