anthropics/skills180kfrontend-design
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
前端开发
Migrate Cloudflare Sandbox apps from stable @cloudflare/sandbox to @cloudflare/sandbox@next (SDK 1.0 preview). Use sandbox-next for apps already on the preview.
把这段话发给 Claude Code、Codex 或 Cursor。智能体会先检查安全性,你确认后才安装。
读取 https://funcoding.ai/skills/fcakyon/claude-codex-settings/sandbox-migrate-to-next/install.md ,按里面的步骤帮我安装这个 Skill。
@next)Perform the port. Follow the steps in order. Depth lives in docs—fetch the linked page when a step needs detail.
Human guide: Migrate · 1.0 preview
New projects should start on @next (sandbox-next), not this skill. Day-to-day stable work → sandbox-stable. Deprecated-API cleanup without moving to @next → 2026 deprecation guide first if needed.
Existing apps should migrate when you can, so you are ready when 1.0 becomes the stable release. Do not force production cutover without the user agreeing.
Prefer installed @next types and the migrate doc over memory.
Stop after any step that needs a user decision.
@next line.@next control protocols are incompatible both ways; gradual rollout leaves a broken mixed window. In-flight container work can stop.await sandbox.exec(...) means process started, not command finished.timeout / AbortSignal cancel the wait only, not the process.gitCheckout on core, process stdin, string-exec completion helper).| Stable | @next |
|---|---|
SANDBOX_TRANSPORT / transport / setTransport | Remove — RPC only |
await sandbox.exec("cmd") → buffered result | await sandbox.exec(argv) → handle, then output / waits |
execStream / startProcess | Same handle: logs, waitFor*, kill |
| Default / named sessions | Gone — cwd/env per launch, or one shell script |
sandbox.terminal(request) / session terminal | createTerminal + terminal.connect(request) |
xterm sessionId | terminalId |
Interpreter methods on Sandbox | withInterpreter → sandbox.interpreter.* |
gitCheckout | argv git via exec |
| String kill signals | Numeric only |
Files, mounts, backups, ports, tunnels, proxyToSandbox | Mostly unchanged (ignore session/transport bits on stable pages) |
Depth: Migrate · after port, day-to-day → sandbox-next
rg 'SANDBOX_TRANSPORT|transport:|setTransport|enableDefaultSession|createSession|getSession|deleteSession|execStream\(|startProcess\(|killProcess\(|sandbox\.terminal\(|sessionId|gitCheckout\(|SandboxTransport|ExecutionSession'
Also: string exec(, cd then a later exec, bare createCodeContext / runCode on Sandbox.
--containers-rollout=immediate (live processes/terminals/streams may stop)?-python image variant?npm install @cloudflare/sandbox@next
FROM cloudflare/sandbox:next
# Python: cloudflare/sandbox:next-python
Same prerelease tag on Worker and image when not on floating next.
Apply replacements from the map. For each area, implement from the doc—not from stable habits:
| Area | Doc |
|---|---|
| Commands / handles / waits | Processes · Processes API |
cwd / env / secrets | Environment · Outbound traffic |
| Drop sessions | Migrate · Lifecycle |
| Terminals | Terminals |
| Interpreter | Interpreter |
| Errors | Errors |
| Durable job across requests | Process execution — lifetime / durability |
Commands (shape):
// Before (stable)
const result = await sandbox.exec("npm test");
// After (@next)
const process = await sandbox.exec(["/bin/bash", "-lc", "npm test"]);
const result = await process.output({ encoding: "utf8" });
const server = await sandbox.exec(["/bin/bash", "-lc", "npm run dev"], {
cwd: "/workspace/app",
});
await server.waitForPort(3000, { timeout: 60_000 });
await server.kill(); // numeric; default 15
Terminals (shape):
const terminal = await sandbox.createTerminal({ command: ["bash"], cwd: "/workspace" });
const t = await sandbox.getTerminal(terminal.id);
if (!t) return new Response("terminal gone", { status: 410 });
return t.connect(request, { cursor, cols, rows });
Interpreter (shape):
import { Sandbox as BaseSandbox } from "@cloudflare/sandbox";
import { withInterpreter } from "@cloudflare/sandbox/interpreter";
export class Sandbox extends BaseSandbox<Env> {
interpreter = withInterpreter(this);
}
Git (shape):
const clone = await sandbox.exec(
["git", "clone", "--depth", "1", "--", repoUrl, "/workspace/repo"],
{ cwd: "/workspace" },
);
const result = await clone.output({ encoding: "utf8" });
Delete transport settings entirely. Remove session APIs. Isolate users with separate sandbox IDs.
Staging/branch first. Production is one deploy of matching Worker + image:
npx wrangler deploy --containers-rollout=immediate
Leave rollout_active_grace_period at default 0 (or set 0 if raised). After cutover, pre-deploy process/terminal IDs are invalid. Details: Migrate · Container rollouts
@next line@nextexec + output({ encoding: "utf8" })--containers-rollout=immediateThen day-to-day work uses sandbox-next.
@next Worker with stable image (or reverse)await exec as command completioncd / exports persist across exec callsgitCheckout, process stdin, or undocumented APIssetEnvVars / launch env
anthropics/skills180kGuidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
前端开发
anthropics/skills180kSuite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.
前端开发
addyosmani/agent-skills103kGuides stable API and interface design. Use when designing APIs, module boundaries, or any public interface. Use when creating REST or GraphQL endpoints, defining type contracts between modules, or establishing boundaries between frontend and backend.
前端开发
addyosmani/agent-skills103kBuilds production-quality, accessible, responsive user-facing UIs. Use when building or modifying interfaces and pages, creating components, implementing layouts, meeting WCAG accessibility requirements, managing state, or when the output needs to look and feel production-quality rather than AI-generated.
前端开发
addyosmani/agent-skills103kOptimizes application performance across frontend, backend, queries, and databases. Use when performance requirements exist, when you suspect performance regressions, when Core Web Vitals or load times need improvement, when N+1 query patterns need fixing, or when profiling reveals bottlenecks.
前端开发
nexu-io/open-design100kOpenDesign's feature business case for the plugin marketplace: the user pain, options, tradeoffs, and the measure of success. Built as a decision-grade product management deck for PM, eng, design, leadership.
前端开发