{"id":49081129,"url":"https://github.com/codesign-cloud/nextjs-on-cloudflare","last_synced_at":"2026-04-20T13:14:18.873Z","repository":{"id":312136671,"uuid":"1044433219","full_name":"codesign-cloud/nextjs-on-cloudflare","owner":"codesign-cloud","description":"Nextjs 15+ on Cloudflare Workers via OpenNext. CI/CD via GitHub Actions.","archived":false,"fork":false,"pushed_at":"2025-11-05T11:11:53.000Z","size":362,"stargazers_count":2,"open_issues_count":1,"forks_count":1,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-11-05T13:13:04.564Z","etag":null,"topics":["cloudflare","cloudflare-nodejs","cloudflare-workers","nextjs","nextjs-cloudflare","nextjs-on-cloudflare-workers","nextjs15"],"latest_commit_sha":null,"homepage":"https://nextjs-on-cloudflare.apiary.workers.dev/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/codesign-cloud.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-08-25T17:15:16.000Z","updated_at":"2025-11-05T11:11:56.000Z","dependencies_parsed_at":"2025-08-29T00:51:41.552Z","dependency_job_id":"4c242375-6727-460f-aa37-b6475f080cf0","html_url":"https://github.com/codesign-cloud/nextjs-on-cloudflare","commit_stats":null,"previous_names":["codesign-cloud/nextjs-on-cloudflare"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/codesign-cloud/nextjs-on-cloudflare","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codesign-cloud%2Fnextjs-on-cloudflare","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codesign-cloud%2Fnextjs-on-cloudflare/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codesign-cloud%2Fnextjs-on-cloudflare/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codesign-cloud%2Fnextjs-on-cloudflare/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/codesign-cloud","download_url":"https://codeload.github.com/codesign-cloud/nextjs-on-cloudflare/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codesign-cloud%2Fnextjs-on-cloudflare/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32048566,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-20T11:35:06.609Z","status":"ssl_error","status_checked_at":"2026-04-20T11:34:48.899Z","response_time":94,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cloudflare","cloudflare-nodejs","cloudflare-workers","nextjs","nextjs-cloudflare","nextjs-on-cloudflare-workers","nextjs15"],"created_at":"2026-04-20T13:14:18.249Z","updated_at":"2026-04-20T13:14:18.864Z","avatar_url":"https://github.com/codesign-cloud.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Next.js 15+ SSR on Cloudflare Workers\n\nCloudflare is too cool to ignore. \n\nA Next.js 15+ application demonstrating Server-Side Rendering (SSR) and API routes deployed on Cloudflare Workers using [OpenNext](https://opennext.js.org/cloudflare).\n\n## Features\n\n- **Next.js 15+** with App Router\n- **Server-Side Rendering (SSR)** with real-time data\n- **API Routes** with full Node.js runtime support\n- **TypeScript** for type safety\n- **Tailwind CSS** for styling\n- **Cloudflare Workers** deployment via OpenNext\n- **Full Node.js API** compatibility (not Edge Runtime)\n\n## Project Structure\n\n```\nsrc/\n├── app/\n│   ├── api/\n│   │   └── server-info/         # API route returning server metadata\n│   │       └── route.ts\n│   ├── ssr-demo/               # SSR demonstration page\n│   │   ├── components/\n│   │   │   └── ApiDataFetcher.tsx\n│   │   └── page.tsx\n│   ├── globals.css\n│   ├── layout.tsx              # Root layout component\n│   └── page.tsx                # Home page\n└── types/\n    └── api.ts                  # TypeScript type definitions\n```\n\n## Getting Started\n\n### Prerequisites\n\n- **Node.js 20 or higher** (required for @opennextjs/cloudflare)\n- **npm** or **yarn** package manager\n\n### Development\n\n1. **Install dependencies:**\n   ```bash\n   pnpm install\n   ```\n\n2. **Start development server:**\n   ```bash\n   pnpm run dev\n   ```\n\n3. **Open in browser:**\n   ```\n   http://localhost:3000\n   ```\n\n\n------------------------\n\n# Integrating Cloudflare Workers\n\n\n1. ```pnpm install --save-dev wrangler@latest```\n\n\n2. ```pnpm install @opennextjs/cloudflare@latest```\n\n\n3. Create a `wrangler.jsonc` file [Doc Link](https://opennext.js.org/cloudflare/get-started#3-create-a-wrangler-configuration-file)\n\n\n4. Add an `open-next.config.ts` file\n\n\n5. Add a `.dev.vars` file with content `NEXTJS_ENV=development`\n\nYou can also add the following lines to `.gitignore`\n````\n# Cloudflare\ncloudflare-env.d.ts\n/wrangler.toml.backup\n/wrangler.jsonc.backup\n````\n\n6. Update the package.json file\n\n```````jsonc\n// The build script must invoke the Next.js build command, it will be invoke by opennextjs-cloudflare build.\n\"build\": \"next build\",\n\n//pnpm run preview: Builds your app and serves it locally, allowing you to quickly preview your app running locally in the Workers runtime, via a single command.\n\"preview\": \"opennextjs-cloudflare build \u0026\u0026 opennextjs-cloudflare preview\",\n\n//pnpm run deploy: Builds your app, and then immediately deploys it to Cloudflare.\n\"deploy\": \"opennextjs-cloudflare build \u0026\u0026 opennextjs-cloudflare deploy\",\n\n//pnpm run upload: Builds your app, and then uploads a new version of it to Cloudflare.\n\"upload\": \"opennextjs-cloudflare build \u0026\u0026 opennextjs-cloudflare upload\",\n\n//cf-typegen: Generates a cloudflare-env.d.ts file at the root of your project containing the types for the env.\n\"cf-typegen\": \"wrangler types --env-interface CloudflareEnv cloudflare-env.d.ts\",\n```````\n\n\n7. Add Static Asset Caching\n\nAdd a `public/_headers` file, with the following headers at the least:\n`````\n/_next/static/*\nCache-Control: public,max-age=31536000,immutable\n`````\n\n\n8. Add caching with Cloudflare R2\n\n\n9. Remove any export const runtime = \"edge\"; if present (just verify)\n10. Add .open-next to .gitignore\n11. Remove static `@cloudflare/next-on-pages` (if necessary/just verify)\n12. Develop locally (add `initOpenNextCloudflareForDev()` block in `next.config.js`)\n13. Deploy to Cloudflare Workers (via `pnpm run deploy`; manual deploy via `npx wrangler deploy --config wrangler.jsonc`)\n\n------------------------\n\n👉🏼 `CLOUDFLARE_API_TOKEN` and `CLOUDFLARE_ACCOUNT_ID` are required at GH Actions for deployment\n\nGoto https://dash.cloudflare.com/profile/api-tokens to generate a token for CLOUDFLARE_API_TOKEN\n\nCLOUDFLARE_ACCOUNT_ID can be found in the URL of the dashboard (dashboard.cloudflare.com/[id]) or in CF Account Home \u003e Overflow menu \u003e Copy Account ID \n\nGoto GH \u003e Your Repo \u003e Settings \u003e Secrets \u003e New repository secret \u003e CLOUDFLARE_API_TOKEN / CLOUDFLARE_ACCOUNT_ID\n\n- Put non-sensitive CF variables in `wrangler.jsonc`\n- CF Secrets are set via `wrangler secret put`\n- Ensure public variables start with NEXT_PUBLIC_\n\n---------------------------\n\n### Pages\n\n- **Home** (`/`) - Landing page with navigation\n- **SSR Demo** (`/ssr-demo`) - Server-side rendering demonstration\n- **API Endpoint** (`/api/server-info`) - Server information API\n\n## API Reference\n\n### Server Info Endpoint\n\n**Endpoint:** `GET /api/server-info`\n\n**Response:**\n```json\n{\n  \"success\": true,\n  \"data\": {\n    \"serverId\": \"uuid-string\",\n    \"serverTime\": \"2024-01-01T00:00:00.000Z\",\n    \"requestId\": \"uuid-string\",\n    \"environment\": \"development\",\n    \"timestamp\": 1704067200000\n  },\n  \"metadata\": {\n    \"requestTime\": \"2024-01-01T00:00:00.000Z\",\n    \"responseTime\": \"2024-01-01T00:00:00.000Z\"\n  }\n}\n```\n\n## Deployment to Cloudflare Workers\n\n### Using OpenNext\n\n1. **Build and deploy:**\n   ```bash\n   pnpm run deploy\n   ```\n\n   This command uses `@opennextjs/cloudflare` to:\n   - Build the Next.js application\n   - Transform it for Cloudflare Workers\n   - Deploy using Wrangler\n\n2. **Manual deployment:**\n   ```bash\n   # Build the project\n   pnpm run build\n   \n   # Deploy with OpenNext\n   npx @opennextjs/cloudflare@latest\n   \n   # Or deploy with Wrangler\n   npx wrangler deploy\n   ```\n\n### Configuration\n\nThe project is configured for OpenNext deployment:\n\n- **`wrangler.jsonc`** - Cloudflare Workers configuration\n- **`next.config.js`** - Next.js configuration optimized for OpenNext\n- **Node.js Runtime** - Full Node.js API support (not Edge Runtime)\n\n## OpenNext Advantages\n\nCompared to `@cloudflare/next-on-pages`, using OpenNext has a host of advantages: \n\n- **Full Node.js Runtime** - Complete Node.js API compatibility\n- **No API Restrictions** - Use any Node.js modules\n- **Better Feature Support** - All Next.js 15 features supported\n- **Simplified Configuration** - Less setup complexity\n\n## Development Scripts\n\n```bash\npnpm run dev      # Start development server\npnpm run build    # Build for production\npnpm run start    # Start production server\npnpm run lint     # Run ESLint\npnpm run deploy   # Deploy to Cloudflare Workers\n```\n\n## Environment Variables\n\nSet in `wrangler.toml` or Cloudflare dashboard:\n\n```toml\n[vars]\nENVIRONMENT = \"production\"\nSERVER_ID = \"your-server-id\"\n```\n\n## Learn More\n\n- [OpenNext Documentation](https://opennext.js.org/)\n- [Next.js Documentation](https://nextjs.org/docs)\n- [Cloudflare Workers](https://workers.cloudflare.com/)\n- [TypeScript](https://www.typescriptlang.org/)\n\nCo-created with Claude :) \n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodesign-cloud%2Fnextjs-on-cloudflare","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodesign-cloud%2Fnextjs-on-cloudflare","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodesign-cloud%2Fnextjs-on-cloudflare/lists"}