`
雨打蕉叶
  • 浏览: 231541 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

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、CSS3、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浏览器里,也可以和别人一起分享代码片段。

 

分享到:
评论

相关推荐

    分享8个最佳的代码片段在线测试网站

    本文为你带来 8 款非常好用的代码片段在线工具,帮助你快速、方便地测试、编辑代码片段。  1. ideone ideone 是一个在线代码编辑、调试工具,允许开发者在线编译、运行代码,支持超过 40 种编程语言。  2. ...

    常用代码片段

    8.检测字符串中只能包含:中文、数字、下划线(_)、横线(-); 9.检查有没有应用程序来接受处理你发出的intent; 10.使用TransitionDrawable实现渐变效果,比使用AlphaAnimation效果要好,可避免出现闪烁问题; 11....29...

    存储一些我做过的matlab的代码片段.rar

    我经常使用一系列代码片段将数据从ESP8266发布到云中进行存储,可视化和分析。 目录 介绍 使用ESP8266进行项目时,我经常需要收集和分析一些数据。 例如像项目中的湿度或温度等过程变量。 在其他情况下,我可能需要...

    基于jacoco,JGit 二次开发增量代码覆盖率工具.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    片段:从源文件中提取代码片段的Python3工具

    本质上,代码片段从给定的一组输入文件中提取文本的标记部分,并将其保存在其他位置。 功能包括: 通过从源文件读取,可在任何文本文件上工作,例如,任何编码语言 使用可自定义的标记语法 写入模板输出(例如.md...

    MyDog是一个代码生成工具.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    代码生成工具,快速生成controller,service,model,mapper,html代码,极大提高开发效率。.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    片段预览工具「Snippet Preview Tool」-crx插件

    代码片段预览工具由DejanSEO。 检查Google是否可以正确解析您的结构化数据标记并将其显示在搜索结果中。 通过此扩展程序,您可以快速测试当前所在页面的丰富网页摘要。 该扩展程序会打开Goog​​le的Rich Snippet...

    Java开发基础工具集,陆续收录常用的java代码,令代码更加简洁美观.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    phinder:PHP代码片段查找器

    Phinder:PHP代码片段查找器 Phinder是查找代码段的工具。 该工具的主要目的是加快代码检查过程,而不是静态错误检测。 假设您的项目具有以下本地规则: 调用in_array ,显式指定第3个参数,以避免意外的比较结果...

    JEECG是一款基于代码生成器的J2EE快速开发平台.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    程序本地测试工具

    程序本地测试工具资源描述可以把电子书的概述、源代码的说明、文档的片段填在这里,描述详细会获得我们的推荐,更容易被他人下载!描述大于20字不是问题吧!

    bumblebee(大黄蜂)运维工具:基于Elves远程管理平台进行开发,实现的一款远程命令行执行工具.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    在线开发工具网站.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    CrackDb是一款Java开发的数据库账号密码破解工具.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    Eclipse插件开发-测试用例自动生成工具.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    一款Android快速开发框(常用工具箱,控件,刷新,数据适配器).zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    基于TCP,Socket编程,模仿腾讯QQ界面,使用Java开发的一款网络聊天工具.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

    Vienna 是一款安卓音频操作工具,主要提供音频录制与播放的功能。提供简洁的接口降低音频开发的成本。.zip

    提供集成开发环境(IDE),如Visual Studio、Eclipse、Android Studio和Sublime Text等,这些工具集成了文本编辑器,支持语法高亮、自动补全、代码片段管理和版本控制等功能,有助于开发者高效编写和维护代码。...

Global site tag (gtag.js) - Google Analytics