代码沙盒
在浏览器里写并运行 HTML、CSS、JavaScript 和 Python。
6 款工具1 款免费
使用须知
沙盒省掉配环境的步骤：复现一个 bug、分享一段最小示例、试用一个库，打开浏览器就行。
- 浏览器直接运行，不装任何东西
- 能生成可分享的链接，还原你此刻的状态
- 支持任务所需的依赖
全部 6 款工具
CodePen部分免费
前端创意 playground 与社区
代码沙盒CodeSandbox部分免费
浏览器里的完整前端工程环境
代码沙盒JSFiddle免费
老牌在线代码演示工具
代码沙盒PlayCode部分免费
毫秒级即时预览的 JS 沙盒
代码沙盒Replit部分免费
浏览器里的全能 IDE 与云开发环境
代码沙盒StackBlitz部分免费
WebContainers：浏览器里跑 Node.js
代码沙盒快速对比
| 工具 | 价格 | 平台 | 适合 |
|---|---|---|---|
| CodePen | 部分免费 | Web | 写 CSS 效果 demo、面试作品和教学示例 |
| CodeSandbox | 部分免费 | Web | 复现前端框架 bug、做组件原型 |
| JSFiddle | 免费 | Web | 回答技术问题时附一段可运行的示例 |
| PlayCode | 部分免费 | Web | 快速试一段 JS 逻辑或写 canvas 小动画 |
| Replit | 部分免费 | Web / 移动端 | 没有配环境就想跑一段 Python 或搭个原型 |
| StackBlitz | 部分免费 | Web | 想要真 Node 环境又不想开本地 IDE 的场合 |
本分类的标签
常见问题
代码沙盒 有多少款工具？
本分类收录 6 款工具，每款都链到官网。
代码沙盒 的工具免费吗？
这里 1 款工具中有 6 款免费；其余提供免费或付费档，已在各卡片注明。
代码沙盒 的工具是怎么挑选的？
每款工具都必须能在官网直接使用、持续维护，并且与同类有差异化。所有描述均由我们亲自撰写，卡片定期复核。