排队论游乐场的游乐项目_最佳代码游乐场中的7个

排队论游乐场的游乐项目

这些年来，出现了各种各样的前端代码游乐场。 大多数提供了一种快速而肮脏的方式来尝试客户端代码并与他人共享。 在本文中，我们快速浏览了其中的七个。

这些在线游乐场的典型功能包括：

• 颜色编码HTML，CSS和JavaScript编辑器
• 预览窗口-无需更新即可即时更新
• HTML预处理器，例如HAML
• LESS，SASS和Stylus CSS预处理
• 包含流行JavaScript库
• 开发者控制台和代码验证工具
• 通过短网址共享
• 将演示嵌入其他页面
• 代码分叉
• 零成本（或仅针对高级服务付费）
• 向全世界展示您的编码技巧！

最好的功能：它们使您可以测试和保留实验性的前端代码段，而无需创建文件，启动IDE或设置本地服务器的繁琐工作。

JSFiddle

JSFiddle是最早的代码游乐场之一，对随后的所有活动都产生了重大影响。 尽管有名称，它可以用于HTML，CSS和JavaScript测试的任何组合。 今天看起来有些基础，但仍提供高级功能，例如Ajax仿真。

密码笔

功能丰富的最佳外观游乐场的奖品归功于CodePen 。 该服务由Chris Coyier共同创建，重点介绍了流行的演示（“笔”）和Projects ，这是一个在线集成开发环境，可用于构建和部署Web项目，此功能于2017年3月添加。它提供了高级功能，例如作为Pen的共享和嵌入，添加了外部JS和CSS库，流行的预处理器以及更多其他功能。 PRO服务提供跨浏览器测试，配对编程和教学选项，每月仅需$ 9。

CSS甲板

这可能被称为CSS Deck ，但是它是具有社交和协作功能的成熟HTML，CSS和JavaScript运动场。 它类似于CodePen（我不知道谁影响了谁！），但您可能更喜欢它。

JS斌

JS Bin由JS大师Remy Sharp创立。 它专注于基础知识，并且非常好地处理它们。 它还提供了一个方便JavaScript控制台。 推荐的。

达伯特

Dabblet是另一个早期的游乐场， 最初是Lea Verou使用JavaScript功能HTML5 / CSS3演示系统。 它看起来很漂亮，并在需要时为所有CSS自动前缀。

柱塞

通过Plunker ，您可以添加多个文件（包括社区生成的模板）来启动项目。 就像CodePen一样，使用Plunker，您可以与其他开发人员协作创建工作演示，并共享您的工作。 Plunker的源代码是免费的，并且位于其GitHub存储库中 。

活织

Liveweave是又一个具有实时预览功能的在线HTML5，CSS3和JavaScript编辑器。 它提供HTML5，CSS3，JavaScript和jQuery的代码提示，并允许您将项目下载为zip文件。

您还可以在工作区中轻松添加外部库，例如jQuery，AndgularJS，Bootstrap等。 此外，Liveweave提供了一个标尺来帮助您编写响应式设计，并具有“ Team Up”功能，该功能与JSFiddle的协作编辑功能相同。

其他选择

当然，还有其他选择。 我们想念您的最爱吗？ 告诉我们吧！

我们这里没有讨论在线代码游乐场，它也可以让您共享后端代码，例如CodeSandbox 。 有关这些的更多信息，请转到James Hibbard的在线后端代码游乐场综述，以获取更多信息。

如果您希望托管自己的在线开发环境，请查看ICEcoder （我们在此处有一篇文章）。

而且，如果您不想在弄乱代码时不在线，但想要类似的东西，请查看Web Maker之类的东西（我们在此处提供了一篇文章）。

编码愉快！

翻译自: https://www.sitepoint.com/7-code-playgrounds/

排队论游乐场的游乐项目