Skip to content

Redirect workers.new to the playground #4039

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
penalosa merged 1 commit into from
Sep 28, 2023
Merged

Redirect workers.new to the playground #4039

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 4 additions & 2 deletions packages/workers.new/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,10 @@
"private": true,
"scripts": {
"check:lint": "eslint .",
"deploy": "wrangler deploy src/index.ts",
"dev": "wrangler dev src/index.ts --local"
"deploy": "wrangler deploy",
"dev": "wrangler dev",
"test": "vitest run",
"test:ci": "vitest run"
},
"devDependencies": {
"@cloudflare/eslint-config-worker": "*",
Expand Down
28 changes: 0 additions & 28 deletions packages/workers.new/src/index.test.example
View file
Open in desktop

This file was deleted.

28 changes: 16 additions & 12 deletions packages/workers.new/src/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,23 @@
// Redirect https://workers.new/<known> requests to IDE.
// Redirect https://workers.new/*? requests to dashboard.
// Redirect https://workers.new/*? requests to the Workers Playground.
// Similar to the concept of https://docs.new.

type Redirects = Record<string, [string, string, string, string?]>;
type Redirects = Record<
string,
[
/* subdirectory */ string,
/* file */ string,
/* title */ string,
/* terminal */ string?
]
>;

// stackblitz repository source
const source = "github/cloudflare/wrangler2/tree/main/templates";
const source = "github/cloudflare/workers-sdk/tree/main/templates";

// deploy with cloudflare source
const src = "https://github.com/cloudflare/wrangler2/tree/main/templates";
const src = "https://github.com/cloudflare/workers-sdk/tree/main/templates";

const redirects: Redirects = {
export const redirects: Redirects = {
"/pages-image-sharing": [
"pages-image-sharing",
"src/index.tsx",
Expand Down Expand Up @@ -141,10 +148,7 @@ const worker: ExportedHandler = {
return Response.redirect(redirectUrl, 302);
}

return Response.redirect(
"https://dash.cloudflare.com/?to=/:account/workers/services/new",
302
);
return Response.redirect("https://workers.cloudflare.com/playground", 302);
},
};

Expand All @@ -160,7 +164,7 @@ function getRedirectUrlForPathname(pathname: string): string | undefined {
}

function getListHTML(redirectsParam: Redirects) {
return `
return /*html*/ `
<html>
<head>
<link href='https://fonts.googleapis.com/css2?family=Inter:wght@200;300;500;700&display=swap' rel='stylesheet'>
Expand Down Expand Up @@ -281,7 +285,7 @@ function getListHTML(redirectsParam: Redirects) {
})
.join("\n")}
</ul>
<p class="subheading">Want to contribute a template? <a class="url" href="https://github.com/cloudflare/wrangler2/tree/main/templates"> Send a PR to the Wrangler repository.</a></p>
<p class="subheading">Want to contribute a template? <a class="url" href="https://github.com/cloudflare/workers-sdk/tree/main/templates"> Send a PR to the Wrangler repository.</a></p>
</body>
</html>
`;
Expand Down
273 changes: 273 additions & 0 deletions packages/workers.new/tests/__snapshots__/index.test.ts.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,273 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`worker > templates list 1`] = `
"
<html>
<head>
<link href='https://fonts.googleapis.com/css2?family=Inter:wght@200;300;500;700&display=swap' rel='stylesheet'>
</head>
<style>
body {
margin: 2rem 10rem;
font-family: \\"Inter\\", sans-serif;
}
h1{
text-align: center;
margin: 20px 0;
font-size: 5rem;
}

.nav {
display: flex;
justify-content: space-between;
font-size: 18px;
}

a {
text-decoration: none;
}

a {
color: inherit;
}

.heading {
font-size: 25px;
text-align: center;
margin: 0;
font-weight: 700;
}

.subheading {
text-align: center;
font-size: 18px;
font-weight: 300;
}

.title {
font-weight: 400;
margin-bottom: 50px;
}

ul {
list-style: none;
display: flex;
flex-wrap: wrap;
gap: 20px;
justify-content: center;
text-align: center;
padding-top: 30px;
}

li {
padding: 20px 20px;
border: 1px solid #d5d7d8;
border-radius: 10px;
}

li:nth-child(-n+3) {
padding: 20px 20px;
border: 4px solid #f1740a;
border-radius: 10px;
background: #fef1e6;
}

.btn {
margin: 0 10px;
text-decoration: underline;
}

.link {
padding: 10px;
border: 1px dotted #f1740a;
border-radius: 5px;
}

.link:hover {
background: #f1740a;
color: #fff;
}

.card-title {
font-size: 18px;
font-weight: 600;
}

.url {
color: #f1740a;
font-weight: 700;
}

</style>
<body>
<nav class=\\"nav\\">
<a href=\\"https://workers.cloudflare.com\\">
<img src=\\"https://imagedelivery.net/T24Zz2DP7HaLOEAdMToO-g/70363224-4bee-4f48-a775-06ffdfbc6d00/public\\" height=\\"50\\" alt=\\"Cloudflare Workers\\" />
</a>
<a href=\\"https://developers.cloudflare.com/workers\\">Documentation</a>
</nav>
<p class=\\"heading\\">Cloudflare Workers Templates</p>
<p class=\\"subheading\\">Ready to use templates to start building applications on Cloudflare Workers.</p>
<ul>
<li>
<p class=\\"card-title\\"> Image Sharing Website with Pages Functions </p>
<p class=\\"title\\">pages-image-sharing</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/pages-image-sharing\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/pages-image-sharing\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Stream + Stripe Checkout </p>
<p class=\\"title\\">stream/auth/stripe</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/auth/stripe\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/auth/stripe\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Workers Durable Objects counter </p>
<p class=\\"title\\">worker-durable-objects</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/worker-durable-objects\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/worker-durable-objects\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Workers D1 </p>
<p class=\\"title\\">worker-d1</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/d1\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/worker-d1\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Workers Router </p>
<p class=\\"title\\">worker-router</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/router\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/worker-router\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Workers TypeScript </p>
<p class=\\"title\\">worker-typescript</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/typescript\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/worker-typescript\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Workers WebSocket </p>
<p class=\\"title\\">worker-websocket</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/websocket\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/worker-websocket\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Workers Wordle example </p>
<p class=\\"title\\">worker-example-wordle</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/example-wordle\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/worker-example-wordle\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Workers Request Scheduler </p>
<p class=\\"title\\">worker-example-request-scheduler</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/example-request-scheduler\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/worker-example-request-scheduler\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Workers WebSocket Durable Objects </p>
<p class=\\"title\\">worker-websocket-durable-objects</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/websocket-durable-objects\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/worker-websocket-durable-objects\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Workers Worktop </p>
<p class=\\"title\\">worker-worktop</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/worktop\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/worker-worktop\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Pages Functions CORS </p>
<p class=\\"title\\">pages-functions-cors</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/pages-functions-cors\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/pages-functions-cors\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Pages Plugin static forms </p>
<p class=\\"title\\">pages-plugin-static-forms</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/pages-plugin-static-forms\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/pages-plugin-static-forms\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Pages Example Forum app </p>
<p class=\\"title\\">pages-example-forum-app</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/pages-example-forum-app\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/pages-example-forum-app\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Cloudflare Stream Player </p>
<p class=\\"title\\">stream/playback/stream-player</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/stream-player\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/playback/stream-player\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Cloudflare Stream + Video.js </p>
<p class=\\"title\\">stream/playback/video-js</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/video-js\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/playback/video-js\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Cloudflare Stream + Vidstack </p>
<p class=\\"title\\">stream/playback/vidstack</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/vidstack\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/playback/vidstack\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Cloudflare Stream + hls.js </p>
<p class=\\"title\\">stream/playback/hls-js</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/hls-js\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/playback/hls-js\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Cloudflare Stream + dash.js </p>
<p class=\\"title\\">stream/playback/dash-js</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/dash-js\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/playback/dash-js\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Cloudflare Stream + Shaka Player </p>
<p class=\\"title\\">stream/playback/shaka-player</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/shaka-player\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/playback/shaka-player\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Direct Creator Uploads to Cloudflare Stream </p>
<p class=\\"title\\">stream/upload/direct-creator-uploads</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/direct-creator-uploads\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/upload/direct-creator-uploads\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Direct Creator Uploads to Cloudflare Stream, using TUS </p>
<p class=\\"title\\">stream/upload/direct-creator-uploads-tus</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/direct-creator-uploads-tus\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/upload/direct-creator-uploads-tus\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Stream live video (using WHIP) and playback (using WHEP) over WebRTC with Cloudflare Stream </p>
<p class=\\"title\\">stream/webrtc</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/webrtc\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/webrtc\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Stream live video (using WHIP) over WebRTC with Cloudflare Stream </p>
<p class=\\"title\\">stream/webrtc</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/webrtc-whip\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/webrtc\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Play live video (using WHEP) over WebRTC with Cloudflare Stream </p>
<p class=\\"title\\">stream/webrtc</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/webrtc-whep\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/webrtc\\">Deploy with Workers</a></span>
</li>
<li>
<p class=\\"card-title\\"> Example of using Cloudflare Stream Signed URLs with public content </p>
<p class=\\"title\\">stream/auth/signed-urls-public-content</p>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://workers.new/stream/signed-urls-public-content\\">Open with StackBlitz</a></span>
<span class=\\"link\\"><a target=\\"_blank\\" href=\\"https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/workers-sdk/tree/main/templates/stream/auth/signed-urls-public-content\\">Deploy with Workers</a></span>
</li>
</ul>
<p class=\\"subheading\\">Want to contribute a template? <a class=\\"url\\" href=\\"https://github.com/cloudflare/workers-sdk/tree/main/templates\\"> Send a PR to the Wrangler repository.</a></p>
</body>
</html>
"
`;
Loading