18款在线代码片断测试工具

本文做者Steve Smith是网站DesignDrizzle的创始人，他是一位工做超过7年的专业网站设计者。在这篇文章里展现了一些比较有价值、用起来很是方便的代码片断检测工具。这些工具将大大的提高开发者在代码片断检测方面的工做效率，亦可确保他们的代码运行起来万无一失。许多开发者都使用在线代码片断检测工具，这些工具当中有些是容许开发者和别人一块儿编辑/分享相互之间的代码，分享的目的主要是共同分析代码并相互协助完成代码片断的检查。

　　下面的这18个工具能够帮助开发者用来检查不管是即兴创做的代码仍是用于大型工程的代码，同时还可让开发者自主修改代码，以便更好的理解代码的功能性。

　　1. CodePen

　　CodePen只是一个Web前端的运行场地，具有机动、训练和分享等多种功能。同时，CodePen还可让使用者构建一个压缩版本的测试案例来证实并解决编码当中的错误。

　　2. Dabblet

　　Dabblet的界面十分简洁，操做起来并不复杂，特别适合新手和想尝试最新HTML5标签和CSS3样式的前端工程师使用。Dabblet的一大特点是代码编写时可免加CSS前缀。由于，Dabblet的创造者Lea Verou本人就是免CSS前缀JavaScript脚本prefix-free的创造者，Dabblet拥有此功能也就是瓜熟蒂落的事。HTML和CSS代码间的切换也很方便，点击隐藏工具栏右上方的标签便可。用户能够根据本身的习惯，调整前端代码的预览效果，浏览器内全屏预览将在新标签页中打开。

　　Dabblet支持用Github账号登陆，测试的代码片断既能够匿名保存也能够保存在用户的Github：gist中，以便用户将代码段嵌入本身的网站或是进一步分享给其余人。

　　3. Ideone

　　在线多语言编程执行器工具，支持包括C++，Java，JavaScript，Perl，PHP，Python和Ruby在内的40多种编程语言，能在线直接作编译和执行动做，该工具是一款简易的编程测试工具，虽然不能替代专业版的工具，可是其功能很是全面。

　　4. jsfiddle

　　jsfiddle是一个在线的shell编辑器，经过JavaScript框架建立自定义的环境，以简化JavaScript代码。还能够用于测试示例代码。不只如此，你还能够添加一个Ajax echo后端，而且经过一系列的JavaScript框架自动载入资源，如MooTools，jQuery，Dojo，Prototype，YUI，Glow和Vanilla等等。

　　还有一个重要特性就是可以保存和分享一个unique URL生成代码，jsfiddle还有一个嵌入的功能。它提供了一个由4个部分组成的界面：

• HTML 编辑器
• CSS 编辑器
• JavaScript 编辑器
• 输出界面

　　5. Codepad

　　Codepad是一款简单的在线IDE编译器，适用于团队协做工做，帮助代码生成一个简短的URL，这样就能经过聊天或者电子讯息与人分享。

　　操做起来也很方便：只须要把代码粘贴进去就能够编译运行了，连工程也不须要新建，并且Codepad支持的语言有9种，包括C，C++，D，Haskell，Lua，OCaml，PHP，Perl，Plain Text，Python，Ruby，Scheme，Tcl。

　　6. Liveweave

　　LiveWeave对于Web设计者和开发者来讲都是一个极好的在线工具，它提供了6个Tab功能或特征，能够浏览、编辑、分隔、JavaScript库和Tidy、CSS三、HTML5等在线编辑。

　　7. Google Code Playground

　　有了这款在线工具，Web开发者就能够快速检查和运行代码，也就不必非得打开一个外在校订器。

　　8. Pastebin.me

　　这是一款不可多得好工具，开发者能够理所应当的从新调整基于浏览器视角的代码窗格大小，这一功能对于宽屏显示器使用者来讲是至关有吸引力的。

　　9. CSSDesk

　　CSSDesk容许用户快速敏捷的检查代码片断，还能让整个效果看起来活灵活现。左侧两个面板，能够分别输入HTML和CSS代码，但不支持JavaScript调试。你能够改变“预览区”的背景颜色，能够保存或下载调试完成的代码。

　　10. jsbin v.2

　　经过这款Web App，开发者就能对代码片断进行测试，并改善它的功能性。同时还能向别人分享URL。它分红JavaScript、HTML、CSS、控制面板和输出这5个区域，你能够自行勾选显示哪些区域。

　　11. Tinkerbin

　　和jsfiddle比较起来，Tinkerbin界面功能比较简答，可是界面布局更加合理。使用jsfiddle的时候，总感受每个窗口的输入都比较费劲，用户不得不来回的拖拉窗口。而使用Tinkerbin，你能够更加容易的切换多个窗口或者单独一个窗口编辑CSS，HTML，或者JS代码，根本不须要生成文件或者上传到服务器上。Tinkerbin同时也支持Coffeescript，Sass（with Compass），Less，HAML等类库。

　　12. Try Editor v.1.5

　　这是一款比较适中的、使用起来毫无压力的代码片断检查工具，只要将代码片断粘贴到Try Editor里面，从感受上就能知道效果如何。

　　13. Snippet.io

　　它是一个没有多少限制条件的工具，能够绝不费力跟别人一块儿分享代码片断。

　　14. HTMLEdit Square

　　HTMLEdit Square是一款实时的后台操做工具，用于便捷的检查HTML代码。

　　15. Rendur

　　Rendur是一个轻量级的在线调试交流工具，功能很少，可是加载和运行都很快。用户能够在HTML、CSS、Javascript三个面板中切换，输入相应代码。代码的运行结果，会自动显示在背景网页上。最后一个面板，显示的是整个网页的源码。

　　16. Tinker

　　使用Tinker工具编写和分享代码都是至关方便的，速度不是通常的快啊！

　　17. Practicode

　　在这里，能够编写代码片断；另外，也能够提取HTML、CSS和VBScript代码。

　　18. jsdo.it

　　在这个网站里，能够将代码内接到Web浏览器里，也能够和别人一块儿分享代码片断。