Skip to content

Commit 87321fd

Browse files
emily-shenemily-shen
committed
update beta tags
1 parent ae8c2ce commit 87321fd

File tree

12 files changed

+116
-93
lines changed

12 files changed

+116
-93
lines changed

‎src/content/docs/workers/frameworks/framework-guides/angular.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,13 @@ import {
1313
PackageManagers,
1414
} from "~/components";
1515

16-
In this guide, you will create a new [Angular](https://angular.dev/) application and deploy to Cloudflare Workers (with the new [<InlineBadge preset="beta" /> Workers Assets](/workers/static-assets/)).
16+
In this guide, you will create a new [Angular](https://angular.dev/) application and deploy to Cloudflare Workers (with the new [Workers Assets](/workers/static-assets/)).
1717

1818
## 1. Set up a new project
1919

2020
Use the [`create-cloudflare`](https://www.npmjs.com/package/create-cloudflare) CLI (C3) to set up a new project. C3 will create a new project directory, initiate Angular's official setup tool, and provide the option to deploy instantly.
2121

22-
To use `create-cloudflare` to create a new Angular project with <InlineBadge preset="beta" /> Workers Assets, run the following command:
22+
To use `create-cloudflare` to create a new Angular project with Workers Assets, run the following command:
2323

2424
<PackageManagers
2525
type="create"

‎src/content/docs/workers/frameworks/framework-guides/astro.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,13 @@ import {
1313
PackageManagers,
1414
} from "~/components";
1515

16-
In this guide, you will create a new [Astro](https://astro.build/) application and deploy to Cloudflare Workers (with the new [<InlineBadge preset="beta" /> Workers Assets](/workers/static-assets/)).
16+
In this guide, you will create a new [Astro](https://astro.build/) application and deploy to Cloudflare Workers (with the new [Workers Assets](/workers/static-assets/)).
1717

1818
## 1. Set up a new project
1919

2020
Use the [`create-cloudflare`](https://www.npmjs.com/package/create-cloudflare) CLI (C3) to set up a new project. C3 will create a new project directory, initiate Astro's official setup tool, and provide the option to deploy instantly.
2121

22-
To use `create-cloudflare` to create a new Astro project with <InlineBadge preset="beta" /> Workers Assets, run the following command:
22+
To use `create-cloudflare` to create a new Astro project with Workers Assets, run the following command:
2323

2424
<PackageManagers
2525
type="create"

‎src/content/docs/workers/frameworks/framework-guides/docusaurus.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,13 @@ import {
1313
PackageManagers,
1414
} from "~/components";
1515

16-
In this guide, you will create a new [Docusaurus](https://docusaurus.io/) application and deploy to Cloudflare Workers (with the new [<InlineBadge preset="beta" /> Workers Assets](/workers/static-assets/)).
16+
In this guide, you will create a new [Docusaurus](https://docusaurus.io/) application and deploy to Cloudflare Workers (with the new [Workers Assets](/workers/static-assets/)).
1717

1818
## 1. Set up a new project
1919

2020
Use the [`create-cloudflare`](https://www.npmjs.com/package/create-cloudflare) CLI (C3) to set up a new project. C3 will create a new project directory, initiate Docusaurus' official setup tool, and provide the option to deploy instantly.
2121

22-
To use `create-cloudflare` to create a new Docusaurus project with <InlineBadge preset="beta" /> Workers Assets, run the following command:
22+
To use `create-cloudflare` to create a new Docusaurus project with Workers Assets, run the following command:
2323

2424
<PackageManagers
2525
type="create"

‎src/content/docs/workers/frameworks/framework-guides/gatsby.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,13 @@ import {
1313
PackageManagers,
1414
} from "~/components";
1515

16-
In this guide, you will create a new [Gatsby](https://www.gatsbyjs.com/) application and deploy to Cloudflare Workers (with the new [<InlineBadge preset="beta" /> Workers Assets](/workers/static-assets/)).
16+
In this guide, you will create a new [Gatsby](https://www.gatsbyjs.com/) application and deploy to Cloudflare Workers (with the new [Workers Assets](/workers/static-assets/)).
1717

1818
## 1. Set up a new project
1919

2020
Use the [`create-cloudflare`](https://www.npmjs.com/package/create-cloudflare) CLI (C3) to set up a new project. C3 will create a new project directory, initiate Gatsby's official setup tool, and provide the option to deploy instantly.
2121

22-
To use `create-cloudflare` to create a new Gatsby project with <InlineBadge preset="beta" /> Workers Assets, run the following command:
22+
To use `create-cloudflare` to create a new Gatsby project with Workers Assets, run the following command:
2323

2424
<PackageManagers
2525
type="create"

‎src/content/docs/workers/frameworks/framework-guides/nextjs.mdx‎

Lines changed: 85 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ pcx_content_type: how-to
33
title: Next.js
44
head: []
55
description: Create an Next.js application and deploy it to Cloudflare Workers with Workers Assets.
6+
sidebar:
7+
badge: Beta
68
---
79

810
import {
@@ -11,9 +13,13 @@ import {
1113
Render,
1214
PackageManagers,
1315
Steps,
14-
WranglerConfig
16+
WranglerConfig,
1517
} from "~/components";
1618

19+
:::note
20+
The OpenNext adapter is in currently in beta.
21+
:::
22+
1723
**Start from CLI** - scaffold a Next.js project on Workers.
1824

1925
<PackageManagers
@@ -22,9 +28,7 @@ import {
2228
args={"--framework=next --platform=workers"}
2329
/>
2430

25-
:::note
2631
This is a simple getting started guide. For detailed documentation on how the to use the Cloudflare OpenNext adapter, visit the [OpenNext website](https://opennext.js.org/cloudflare).
27-
:::
2832

2933
## What is Next.js?
3034

@@ -40,38 +44,45 @@ You can deploy your Next.js app to Cloudflare Workers using the OpenNext adaptor
4044

4145
1. **Create a new project with the create-cloudflare CLI (C3).**
4246

43-
<PackageManagers
44-
type="create"
45-
pkg="cloudflare@latest my-next-app"
46-
args={"--framework=next --platform=workers"}
47-
/>
48-
49-
<Details header="What's happening behind the scenes?">
50-
When you run this command, C3 creates a new project directory, initiates [Next.js's official setup tool](https://nextjs.org/docs/app/api-reference/cli/create-next-app), and configures the project for Cloudflare. It then offers the option to instantly deploy your application to Cloudflare.
51-
</Details>
47+
<PackageManagers
48+
type="create"
49+
pkg="cloudflare@latest my-next-app"
50+
args={"--framework=next --platform=workers"}
51+
/>
5252

53-
2. **Develop locally.**
53+
<Details header="What's happening behind the scenes?">
54+
When you run this command, C3 creates a new project directory, initiates
55+
[Next.js's official setup
56+
tool](https://nextjs.org/docs/app/api-reference/cli/create-next-app), and
57+
configures the project for Cloudflare. It then offers the option to
58+
instantly deploy your application to Cloudflare.
59+
</Details>
5460

55-
After creating your project, run the following command in your project directory to start a local development server.
56-
The command uses the Next.js development server. It offers the best developer experience by quickly reloading your app every time the source code is updated.
61+
2. **Develop locally.**
5762

58-
<PackageManagers type="run" args="dev" />
63+
After creating your project, run the following command in your project directory to start a local development server.
64+
The command uses the Next.js development server. It offers the best developer experience by quickly reloading your app every time the source code is updated.
5965

60-
3. **Test and preview your site with the Cloudflare adapter.**
66+
<PackageManagers type="run" args="dev" />
6167

62-
<PackageManagers type="run" args="preview" />
68+
3. **Test and preview your site with the Cloudflare adapter.**
6369

64-
<Details header="What's the difference between dev and preview?">
65-
The command used in the previous step uses the Next.js development server, which runs in Node.js.
66-
However, your deployed application will run on Cloudflare Workers, which uses the `workerd` runtime. Therefore when running integration tests and previewing your application, you should use the preview command, which is more accurate to production, as it executes your application in the `workerd` runtime using `wrangler dev`.
67-
</Details>
70+
<PackageManagers type="run" args="preview" />
6871

72+
<Details header="What's the difference between dev and preview?">
73+
The command used in the previous step uses the Next.js development server,
74+
which runs in Node.js. However, your deployed application will run on
75+
Cloudflare Workers, which uses the `workerd` runtime. Therefore when
76+
running integration tests and previewing your application, you should use
77+
the preview command, which is more accurate to production, as it executes
78+
your application in the `workerd` runtime using `wrangler dev`.
79+
</Details>
6980

70-
4. **Deploy your project.**
81+
4. **Deploy your project.**
7182

72-
You can deploy your project to a [`*.workers.dev` subdomain](/workers/configuration/routing/workers-dev/) or a [custom domain](/workers/configuration/routing/custom-domains/) from your local machine or any CI/CD system (including [Workers Builds](/workers/ci-cd/#workers-builds)). Use the following command to build and deploy. If you're using a CI service, be sure to update your "deploy command" accordingly.
83+
You can deploy your project to a [`*.workers.dev` subdomain](/workers/configuration/routing/workers-dev/) or a [custom domain](/workers/configuration/routing/custom-domains/) from your local machine or any CI/CD system (including [Workers Builds](/workers/ci-cd/#workers-builds)). Use the following command to build and deploy. If you're using a CI service, be sure to update your "deploy command" accordingly.
7384

74-
<PackageManagers type="run" args="deploy" />
85+
<PackageManagers type="run" args="deploy" />
7586

7687
</Steps>
7788

@@ -81,76 +92,80 @@ You can convert an existing Next.js application to run on Cloudflare
8192

8293
<Steps>
8394

84-
1. **Install [`@opennextjs/cloudflare`](https://www.npmjs.com/package/@opennextjs/cloudflare)**
95+
1. **Install [`@opennextjs/cloudflare`](https://www.npmjs.com/package/@opennextjs/cloudflare)**
8596

86-
<PackageManagers type="install" pkg="@opennextjs/cloudflare@latest" />
97+
<PackageManagers type="install" pkg="@opennextjs/cloudflare@latest" />
8798

88-
2. **Add a Wrangler configuration file**
99+
2. **Add a Wrangler configuration file**
89100

90-
In your project root, create a [Wrangler configuration file](/workers/wrangler/configuration/) with the following content:
101+
In your project root, create a [Wrangler configuration file](/workers/wrangler/configuration/) with the following content:
91102

92-
<WranglerConfig>
93-
```toml
94-
main = ".open-next/worker.js"
95-
name = "my-app"
96-
compatibility_date = "2025-03-25"
97-
compatibility_flags = ["nodejs_compat"]
98-
assets = { directory = ".open-next/assets", binding = "ASSETS" }
99-
```
100-
</WranglerConfig>
103+
<WranglerConfig>
104+
```toml
105+
main = ".open-next/worker.js"
106+
name = "my-app"
107+
compatibility_date = "2025-03-25"
108+
compatibility_flags = ["nodejs_compat"]
109+
[assets]
110+
directory = "./dist"
111+
binding = "ASSETS"
112+
```
113+
</WranglerConfig>
101114

102-
:::note
103-
As shown above, you must enable the [`nodejs_compat` compatibility flag](/workers/runtime-apis/nodejs/) _and_ set your [compatibility date](/workers/configuration/compatibility-dates/) to `2024-09-23` or later for your Next.js app to work with @opennextjs/cloudflare.
104-
:::
115+
:::note
116+
As shown above, you must enable the [`nodejs_compat` compatibility flag](/workers/runtime-apis/nodejs/) _and_ set your [compatibility date](/workers/configuration/compatibility-dates/) to `2024-09-23` or later for your Next.js app to work with @opennextjs/cloudflare.
117+
:::
105118

106-
3. **Add a configuration file for OpenNext**
119+
3. **Add a configuration file for OpenNext**
107120

108-
In your project root, create an OpenNext configuration file named `open-next.config.ts` with the following content:
121+
In your project root, create an OpenNext configuration file named `open-next.config.ts` with the following content:
109122

110-
```ts
111-
import { defineCloudflareConfig } from "@opennextjs/cloudflare";
123+
```ts
124+
import { defineCloudflareConfig } from "@opennextjs/cloudflare";
112125

113-
export default defineCloudflareConfig();
114-
```
126+
export default defineCloudflareConfig();
127+
```
115128

116-
:::note
117-
`open-next.config.ts` is where you can configure the caching, see the [adapter documentation](https://opennext.js.org/cloudflare/caching) for more information
118-
:::
129+
:::note
130+
`open-next.config.ts` is where you can configure the caching, see the [adapter documentation](https://opennext.js.org/cloudflare/caching) for more information
131+
:::
119132

120-
4. **Update `package.json`**
133+
4. **Update `package.json`**
121134

122-
You can add the following scripts to your `package.json`:
135+
You can add the following scripts to your `package.json`:
123136

124-
```json
125-
"preview": "opennextjs-cloudflare build && opennextjs-cloudflare preview",
126-
"deploy": "opennextjs-cloudflare build && opennextjs-cloudflare deploy",
127-
"cf-typegen": "wrangler types --env-interface CloudflareEnv cloudflare-env.d.ts"
128-
```
137+
```json
138+
"preview": "opennextjs-cloudflare build && opennextjs-cloudflare preview",
139+
"deploy": "opennextjs-cloudflare build && opennextjs-cloudflare deploy",
140+
"cf-typegen": "wrangler types --env-interface CloudflareEnv cloudflare-env.d.ts"
141+
```
129142

130-
<Details header="Usage">
131-
- `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.
132-
- `deploy`: Builds your app, and then deploys it to Cloudflare
133-
- `cf-typegen`: Generates a `cloudflare-env.d.ts` file at the root of your project containing the types for the env.
134-
</Details>
143+
<Details header="Usage">
144+
- `preview`: Builds your app and serves it locally, allowing you to
145+
quickly preview your app running locally in the Workers runtime, via a
146+
single command. - `deploy`: Builds your app, and then deploys it to
147+
Cloudflare - `cf-typegen`: Generates a `cloudflare-env.d.ts` file at the
148+
root of your project containing the types for the env.
149+
</Details>
135150

136151
5. **Develop locally.**
137152

138-
After creating your project, run the following command in your project directory to start a local development server.
139-
The command uses the Next.js development server. It offers the best developer experience by quickly reloading your app after your source code is updated.
153+
After creating your project, run the following command in your project directory to start a local development server.
154+
The command uses the Next.js development server. It offers the best developer experience by quickly reloading your app after your source code is updated.
140155

141-
<PackageManagers type="run" args="dev" />
156+
<PackageManagers type="run" args="dev" />
142157

143158
6. **Test your site with the Cloudflare adapter.**
144159

145-
The command used in the previous step uses the Next.js development server to offer a great developer experience.
146-
However your application will run on Cloudflare Workers so you want to run your integration tests and verify that your application workers correctly in this environment.
160+
The command used in the previous step uses the Next.js development server to offer a great developer experience.
161+
However your application will run on Cloudflare Workers so you want to run your integration tests and verify that your application workers correctly in this environment.
147162

148-
<PackageManagers type="run" args="preview" />
163+
<PackageManagers type="run" args="preview" />
149164

150165
7. **Deploy your project.**
151166

152-
You can deploy your project to a [`*.workers.dev` subdomain](/workers/configuration/routing/workers-dev/) or a [custom domain](/workers/configuration/routing/custom-domains/) from your local machine or any CI/CD system (including [Workers Builds](/workers/ci-cd/#workers-builds)). Use the following command to build and deploy. If you're using a CI service, be sure to update your "deploy command" accordingly.
167+
You can deploy your project to a [`*.workers.dev` subdomain](/workers/configuration/routing/workers-dev/) or a [custom domain](/workers/configuration/routing/custom-domains/) from your local machine or any CI/CD system (including [Workers Builds](/workers/ci-cd/#workers-builds)). Use the following command to build and deploy. If you're using a CI service, be sure to update your "deploy command" accordingly.
153168

154-
<PackageManagers type="run" args="deploy" />
169+
<PackageManagers type="run" args="deploy" />
155170

156171
</Steps>

‎src/content/docs/workers/frameworks/framework-guides/nuxt.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,13 @@ import {
1313
PackageManagers,
1414
} from "~/components";
1515

16-
In this guide, you will create a new [Nuxt](https://nuxt.com/) application and deploy to Cloudflare Workers (with the new [<InlineBadge preset="beta" /> Workers Assets](/workers/static-assets/)).
16+
In this guide, you will create a new [Nuxt](https://nuxt.com/) application and deploy to Cloudflare Workers (with the new [Workers Assets](/workers/static-assets/)).
1717

1818
## 1. Set up a new project
1919

2020
Use the [`create-cloudflare`](https://www.npmjs.com/package/create-cloudflare) CLI (C3) to set up a new project. C3 will create a new project directory, initiate Nuxt's official setup tool, and provide the option to deploy instantly.
2121

22-
To use `create-cloudflare` to create a new Nuxt project with <InlineBadge preset="beta" /> Workers Assets, run the following command:
22+
To use `create-cloudflare` to create a new Nuxt project with Workers Assets, run the following command:
2323

2424
<PackageManagers
2525
type="create"

‎src/content/docs/workers/frameworks/framework-guides/qwik.mdx‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ pcx_content_type: how-to
33
title: Qwik
44
head: []
55
description: Create a Qwik application and deploy it to Cloudflare Workers with Workers Assets.
6+
sidebar:
7+
badge: Beta
68
---
79

810
import {
@@ -13,13 +15,17 @@ import {
1315
PackageManagers,
1416
} from "~/components";
1517

16-
In this guide, you will create a new [Qwik](https://qwik.dev/) application and deploy to Cloudflare Workers (with the new [<InlineBadge preset="beta" /> Workers Assets](/workers/static-assets/)).
18+
:::note
19+
Support for Qwik projects on Cloudflare Workers is currently in beta.
20+
:::
21+
22+
In this guide, you will create a new [Qwik](https://qwik.dev/) application and deploy to Cloudflare Workers (with the new [Workers Assets](/workers/static-assets/)).
1723

1824
## 1. Set up a new project
1925

2026
Use the [`create-cloudflare`](https://www.npmjs.com/package/create-cloudflare) CLI (C3) to set up a new project. C3 will create a new project directory, initiate Qwik's official setup tool, and provide the option to deploy instantly.
2127

22-
To use `create-cloudflare` to create a new Qwik project with <InlineBadge preset="beta" /> Workers Assets, run the following command:
28+
To use `create-cloudflare` to create a new Qwik project with Workers Assets, run the following command:
2329

2430
<PackageManagers
2531
type="create"

‎src/content/docs/workers/frameworks/framework-guides/solid.mdx‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ pcx_content_type: how-to
33
title: Solid
44
head: []
55
description: Create a Solid application and deploy it to Cloudflare Workers with Workers Assets.
6+
sidebar:
7+
badge: Beta
68
---
79

810
import {
@@ -13,13 +15,17 @@ import {
1315
PackageManagers,
1416
} from "~/components";
1517

16-
In this guide, you will create a new [Solid](https://www.solidjs.com/) application and deploy to Cloudflare Workers (with the new [<InlineBadge preset="beta" /> Workers Assets](/workers/static-assets/)).
18+
:::note
19+
Support for SolidStart projects on Cloudflare Workers is currently in beta.
20+
:::
21+
22+
In this guide, you will create a new [Solid](https://www.solidjs.com/) application and deploy to Cloudflare Workers (with the new [Workers Assets](/workers/static-assets/)).
1723

1824
## 1. Set up a new project
1925

2026
Use the [`create-cloudflare`](https://www.npmjs.com/package/create-cloudflare) CLI (C3) to set up a new project. C3 will create a new project directory, initiate Solid's official setup tool, and provide the option to deploy instantly.
2127

22-
To use `create-cloudflare` to create a new Solid project with <InlineBadge preset="beta" /> Workers Assets, run the following command:
28+
To use `create-cloudflare` to create a new Solid project with Workers Assets, run the following command:
2329

2430
<PackageManagers
2531
type="create"

‎src/content/docs/workers/frameworks/framework-guides/svelte.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,13 @@ import {
1313
PackageManagers,
1414
} from "~/components";
1515

16-
In this guide, you will create a new [Svelte](https://svelte.dev/) application and deploy to Cloudflare Workers (with the new [<InlineBadge preset="beta" /> Workers Assets](/workers/static-assets/)).
16+
In this guide, you will create a new [Svelte](https://svelte.dev/) application and deploy to Cloudflare Workers (with the new [Workers Assets](/workers/static-assets/)).
1717

1818
## 1. Set up a new project
1919

2020
Use the [`create-cloudflare`](https://www.npmjs.com/package/create-cloudflare) CLI (C3) to set up a new project. C3 will create a new project directory, initiate Svelte's official setup tool, and provide the option to deploy instantly.
2121

22-
To use `create-cloudflare` to create a new Svelte project with <InlineBadge preset="beta" /> Workers Assets, run the following command:
22+
To use `create-cloudflare` to create a new Svelte project with Workers Assets, run the following command:
2323

2424
<PackageManagers
2525
type="create"

0 commit comments

Comments
 (0)