Agent skill

Cloudflare Workers Dev Experience

by secondsky in secondsky/claude-skills

Cloudflare Workers local development with Wrangler, Miniflare, hot reload, debugging.

MITAuto-check passedDevelopment

Install Cloudflare Workers Dev Experience

skills CLI
$ npx skills add secondsky/claude-skills --skill cloudflare-workers-dev-experience -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install secondsky/claude-skills cloudflare-workers-dev-experience --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/secondsky/claude-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/cloudflare-workers/skills/cloudflare-workers-dev-experience .claude/skills/cloudflare-workers-dev-experience && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
cloudflare-workers-dev-experience
GitHub stars
227
Token cost
~1.6k tokens
SKILL.md length
314 words
Files
7 (incl. scripts, references)
Skills in repo
169
Repo updated
First seen
Licence
MIT

At a glance

Cloudflare Workers local development with Wrangler, Miniflare, hot reload, debugging.

  • Works in 5 steps: Always use wrangler dev for local… → Set compatibility_date - Controls… → Use preview IDs for local dev - Separate… → …
  • Wrangler.jsonc configuration
  • SKILL.md covers Quick Start, Secure Installation, Essential wrangler.jsonc and Critical Rules, plus 9 more sections
  • Runs Shell and TypeScript scripts from its folder; calls bunx, wrangler and bun

What it does

Cloudflare Workers Dev Experience is an agent skill from secondsky/claude-skills. Cloudflare Workers local development with Wrangler, Miniflare, hot reload, debugging. Use for project setup, wrangler.jsonc configuration, or encountering local dev, HMR, binding simulation errors.

Its SKILL.md is about 1.6k tokens, which your agent loads only when the skill is triggered. The skill folder holds 9 other files, including scripts and reference files (for example `references/debugging-tools.md`, `references/local-development.md` and `references/wrangler-config.md`).

It sits in Development, covering Debugging. It works with Cloudflare Workers, TypeScript and npm. The repository describes itself as: Production-ready skills for Claude Code CLI - Cloudflare, React, Tailwind v4, and AI integrations. The licence is MIT.

When your agent uses it

  • Wrangler.jsonc configuration
  • Encountering local dev
  • Binding simulation errors

Example prompts

  • “/cloudflare-workers-dev-experience”

Requirements

  • Node.js
  • A Bash shell

Workflow steps

5 steps, taken from the first numbered list in SKILL.md.

  1. Always use wrangler dev for local testing - Simulates Cloudflare runtime accurately
  2. Set compatibility_date - Controls runtime behavior, update quarterly
  3. Use preview IDs for local dev - Separate from production bindings
  4. Configure TypeScript properly - Use @cloudflare/workers-types
  5. Enable source maps - Better error stacks in development

What it can do on your machine

Read from SKILL.md and the folder at commit 8837836. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 1 file in scripts/ (Shell and TypeScript), which the agent can run.

    Shell commands in SKILL.md call:

    • bunx
    • wrangler
    • bun
    • npm

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Links to these hosts (documentation or services it may open):

    • developers.cloudflare.com

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Cloudflare Workers Dev Experience loads about 1.6k tokens when it runs, and up to ~6.9k if it reads all its reference files. Until then it costs about 58 tokens; SKILL.md has 314 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~58
When it runs · the whole SKILL.md, loaded when a task matches
~1.6k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~6.9k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

The full file from secondsky/claude-skills at commit 8837836, republished under its MIT licence (© secondsky). 314 words, ~1,562 tokens.

Download SKILL.mdSave it as .claude/skills/cloudflare-workers-dev-experience/SKILL.md (or your agent's skills folder). This skill also uses 6 other files; get the full folder from GitHub.
name
cloudflare-workers-dev-experience
description
Cloudflare Workers local development with Wrangler, Miniflare, hot reload, debugging. Use for project setup, wrangler.jsonc configuration, or encountering local dev, HMR, binding simulation errors.
license
MIT

Cloudflare Workers Developer Experience

Local development setup with Wrangler, Miniflare, and modern tooling.

Quick Start

bash
# Create new project
bunx create-cloudflare@latest my-worker

# Or from scratch
mkdir my-worker && cd my-worker
bun init -y
bun add -d wrangler @cloudflare/workers-types

# Start local development
bunx wrangler dev

Secure Installation

Scaffolding tools like bunx create-cloudflare download and execute remote code. Before running, follow supply chain security best practices:

  • Block post-install scripts — npm config set ignore-scripts true (or Bun: disabled by default)
  • Cooldown period — Wait 7 days for new package versions to be vetted by the community
  • Audit before installing — Run socket package score npm <pkg> or use socket npm install <pkg> to check packages

Load the dependency-upgrade skill for full security configuration including Socket CLI integration, cooldown setup, lockfile validation, and CI enforcement.

Essential wrangler.jsonc

jsonc
{
  "$schema": "node_modules/wrangler/config-schema.json",
  "name": "my-worker",
  "main": "src/index.ts",
  "compatibility_date": "2024-12-01",

  // Development settings
  "dev": {
    "port": 8787,
    "local_protocol": "http"
  },

  // Environment variables (non-secret)
  "vars": {
    "ENVIRONMENT": "development"
  },

  // Bindings
  "kv_namespaces": [
    { "binding": "KV", "id": "abc123", "preview_id": "def456" }
  ],

  "d1_databases": [
    { "binding": "DB", "database_id": "xyz789", "database_name": "my-db" }
  ],

  "r2_buckets": [
    { "binding": "BUCKET", "bucket_name": "my-bucket" }
  ]
}

Critical Rules

  1. Always use wrangler dev for local testing - Simulates Cloudflare runtime accurately
  2. Set compatibility_date - Controls runtime behavior, update quarterly
  3. Use preview IDs for local dev - Separate from production bindings
  4. Configure TypeScript properly - Use @cloudflare/workers-types
  5. Enable source maps - Better error stacks in development

Top 6 Errors Prevented

ErrorSymptomPrevention
Module not foundImport errors on deploySet "moduleResolution": "bundler" in tsconfig
Binding undefinedenv.KV is undefined locallyAdd preview_id to KV namespace config
HMR not workingChanges not reflectingCheck port conflicts, use --local flag
D1 schema mismatchQueries fail locallyRun migrations on local DB
Type errorsMissing binding typesGenerate types with wrangler types
CORS issuesBrowser blocking requestsAdd CORS headers in dev handler

Local Development Workflow

bash
# Start dev server (recommended)
bunx wrangler dev

# With live reload
bunx wrangler dev --live-reload

# Remote mode (use actual Cloudflare services)
bunx wrangler dev --remote

# Specify environment
bunx wrangler dev --env staging

# Custom port
bunx wrangler dev --port 3000

TypeScript Configuration

tsconfig.json:

json
{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ES2022",
    "moduleResolution": "bundler",
    "lib": ["ES2022"],
    "types": ["@cloudflare/workers-types"],
    "strict": true,
    "noEmit": true,
    "skipLibCheck": true,
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

Package.json Scripts

json
{
  "scripts": {
    "dev": "wrangler dev",
    "deploy": "wrangler deploy",
    "deploy:staging": "wrangler deploy --env staging",
    "deploy:production": "wrangler deploy --env production",
    "test": "vitest",
    "test:watch": "vitest --watch",
    "type-check": "tsc --noEmit",
    "lint": "eslint src/",
    "types": "wrangler types",
    "tail": "wrangler tail",
    "db:migrate": "wrangler d1 migrations apply DB",
    "db:studio": "wrangler d1 execute DB --local --command 'SELECT 1'"
  }
}

Debugging

Console Logging
typescript
// Development-only logging
export default {
  async fetch(request: Request, env: Env): Promise<Response> {
    if (env.ENVIRONMENT === 'development') {
      console.log('Request:', request.method, request.url);
      console.log('Headers:', Object.fromEntries(request.headers));
    }

    // Handler logic...
  }
};
Using wrangler tail
bash
# Real-time logs from deployed worker
wrangler tail

# Filter by status
wrangler tail --status error

# Filter by method
wrangler tail --method POST

# JSON format for parsing
wrangler tail --format json
VS Code Debugging

.vscode/launch.json:

json
{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Wrangler Dev",
      "type": "node",
      "request": "launch",
      "runtimeExecutable": "bunx",
      "runtimeArgs": ["wrangler", "dev", "--inspector-port", "9229"],
      "skipFiles": ["<node_internals>/**"],
      "sourceMaps": true
    }
  ]
}

When to Load References

Load specific references based on the task:

  • Setting up project? → Load references/local-development.md for complete setup guide
  • Configuring wrangler? → Load references/wrangler-config.md for all configuration options
  • Debugging issues? → Load references/debugging-tools.md for debugging techniques

Templates

TemplatePurposeUse When
templates/wrangler-config.jsoncComplete wrangler configStarting new project
templates/dev-script.tsDevelopment utilitiesAdding dev helpers

Scripts

ScriptPurposeCommand
scripts/dev-setup.shInitialize dev environment./dev-setup.sh

Resources

© secondsky, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 6 other files (scripts, references) in plugins/cloudflare-workers/skills/cloudflare-workers-dev-experience of secondsky/claude-skills.

  • SKILL.md
  • references/debugging-tools.md
  • references/local-development.md
  • references/wrangler-config.md
  • scripts/dev-setup.sh
  • templates/dev-script.ts
  • templates/wrangler-config.jsonc

Open the folder on GitHubat commit 8837836

Compare with similar skills

Cloudflare Workers Dev Experience next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Cloudflare Workers Dev Experience compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Cloudflare Workers Dev Experience this skillsecondsky/claude-skills227—~1.6kAutomated safety check: PassMIT
Update Depsviclafouch/meme-studio110—~2.6kAutomated safety check: PassNone
Swpm Dev Guidedeinsoftware/swpm125—~1kAutomated safety check: PassMIT
Deploycyanfish-x/tellux207—~1.1kAutomated safety check: NotesMIT
Ts2moonbit Migrationmizchi/skills356—~4.2kAutomated safety check: PassNone
Install Anti-Slop Oxlint Rulesdmmulroy/anti-slop5.2k—~2.2kAutomated safety check: PassMIT

Similar skills

  • Update Deps

    viclafouch/meme-studio

    Audit all outdated dependencies with detailed research on changelogs, breaking changes, bug fixes, and deprecations.

    110 GitHub stars~2.6k tokensUpdated 6 mo ago
    DevelopmentAuto-check passed
  • Swpm Dev Guide

    deinsoftware/swpm

    Development guide for setting up, debugging, and testing SWPM locally.

    125 GitHub stars~1k tokensUpdated 4 mo ago
    DevelopmentAuto-check passed
  • Deploy

    cyanfish-x/tellux

    Deploy tellux examples/docs sites via project scripts — one local command (pnpm run deploy) rclone-syncs to the self-hosted site then Wrangler Direct Uploads to Cloudflare Pages.

    207 GitHub stars~1.1k tokensUpdated 16 days ago
    Game DevelopmentAuto-check: notes
  • Migrate a TypeScript codebase to MoonBit on the js target while keeping the same JavaScript API contract, using mizchi/js (JS/Web/Node bindings), mizchi/x (cross-target async backend…

    356 GitHub stars~4.2k tokensUpdated 5 days ago
    Backend & APIsAuto-check passed
  • Installs, updates or migrates the vendored anti-slop Oxlint plugin in a repository, keeping local rule changes and the plugin's license and provenance files.

    5.2k GitHub stars~2.2k tokensUpdated 27 days ago
    DevelopmentAuto-check passed
  • Link Workspace Packages

    nomcopter/react-mosaic

    Link workspace packages in monorepos (npm, yarn, pnpm, bun).

    4.8k GitHub starsUsed in 5 repos~760 tokens
    DevelopmentAuto-check passed

More from secondsky/claude-skills

All 169 skills in this repo
  • Tanstack AI

    secondsky/claude-skills

    TanStack AI (alpha) provider-agnostic type-safe chat with streaming for OpenAI, Anthropic, Gemini, Ollama.

    227 GitHub starsUsed in 1 repo~3.6k tokens
    Auto-check: notes
  • Auto Animate

    secondsky/claude-skills

    AutoAnimate (@formkit/auto-animate) zero-config animations for React.

    227 GitHub stars~2.9k tokensUpdated 9 days ago
    Auto-check passed
  • Base UI React

    secondsky/claude-skills

    MUI Base UI unstyled React components with Floating UI. An agent skill from secondsky/claude-skills.

    227 GitHub stars~1.9k tokensUpdated 9 days ago
    Auto-check passed
  • Cloudflare Images

    secondsky/claude-skills

    This skill should be used when the user asks to "upload images to Cloudflare", "implement direct creator upload", "configure image transformations", "optimize WebP/AVIF", "create image variants"…

    227 GitHub stars~3.6k tokensUpdated 9 days ago
    Auto-check: notes
  • Cloudflare Nextjs

    secondsky/claude-skills

    Deploy Next.js to Cloudflare Workers via the OpenNext adapter (@opennextjs/cloudflare).

    227 GitHub stars~5.3k tokensUpdated 9 days ago
    Auto-check: notes
  • Cloudflare Sandbox

    secondsky/claude-skills

    Cloudflare Sandboxes SDK for secure code execution in Linux containers at edge.

    227 GitHub stars~4.5k tokensUpdated 9 days ago
    Auto-check passed

Categories

Questions about Cloudflare Workers Dev Experience

What does Cloudflare Workers Dev Experience do?

Cloudflare Workers local development with Wrangler, Miniflare, hot reload, debugging. Cloudflare Workers Dev Experience is an agent skill from secondsky/claude-skills. Cloudflare Workers local development with Wrangler, Miniflare, hot reload, debugging.

When should I use Cloudflare Workers Dev Experience?

Cloudflare Workers Dev Experience fits situations like: wrangler.jsonc configuration; encountering local dev; binding simulation errors.

How do I install Cloudflare Workers Dev Experience in Claude Code?

Run `npx skills add secondsky/claude-skills --skill cloudflare-workers-dev-experience -a claude-code`. Or copy the skill folder (plugins/cloudflare-workers/skills/cloudflare-workers-dev-experience in secondsky/claude-skills) into .claude/skills/cloudflare-workers-dev-experience in your project. Claude Code loads it when a task matches its description.

How do I install Cloudflare Workers Dev Experience in Codex?

Run `npx skills add secondsky/claude-skills --skill cloudflare-workers-dev-experience -a codex`. Or copy the skill folder (plugins/cloudflare-workers/skills/cloudflare-workers-dev-experience in secondsky/claude-skills) into .agents/skills/cloudflare-workers-dev-experience in your project. Codex loads it when a task matches its description.

Can I use Cloudflare Workers Dev Experience in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add secondsky/claude-skills --skill cloudflare-workers-dev-experience -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/cloudflare-workers-dev-experience, .gemini/skills/cloudflare-workers-dev-experience, .github/skills/cloudflare-workers-dev-experience and .opencode/skills/cloudflare-workers-dev-experience in your project.

What does Cloudflare Workers Dev Experience need to run?

Going by SKILL.md and its folder, Cloudflare Workers Dev Experience needs a shell and TypeScript for the scripts in its folder and the command-line tools its instructions call (bunx, wrangler, bun and npm). Our summary lists: Node.js; A Bash shell.

Does Cloudflare Workers Dev Experience access the network?

SKILL.md names 1 domain. As links in the text: developers.cloudflare.com. This is read from the text; nothing was executed.

Is Cloudflare Workers Dev Experience safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Cloudflare Workers Dev Experience use?

Cloudflare Workers Dev Experience is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Cloudflare Workers Dev Experience use?

About 1.6k tokens (SKILL.md is roughly 6.2k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 5.3k tokens, read only when the agent opens those files.

What are the alternatives to Cloudflare Workers Dev Experience?

Skills that share tags, products or a category with Cloudflare Workers Dev Experience: Update Deps (viclafouch/meme-studio, 110 stars), Swpm Dev Guide (deinsoftware/swpm, 125 stars), Deploy (cyanfish-x/tellux, 207 stars) and Ts2moonbit Migration (mizchi/skills, 356 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Cloudflare Workers Dev Experience?

secondsky (a GitHub user) maintains it in secondsky/claude-skills, which has 227 GitHub stars. The repository holds 169 skills in this directory. The repository was last updated on September 28, 2026.

Source: secondsky/claude-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.