作为前端开发人员来说,我们需要和HTML、CSS和JavaScript打交道,并且需要不停的突破自己的创意极限来开发和设计最棒的交互场景。
很多资深的前端设计师都拥有自己最喜欢的工具、脚本和资源,在今天这篇文章中,我们将介绍一些能够帮助你高效开发的工具脚本和资源,权当抛砖引玉,希望能够带给大家帮助,如果你也有自己喜欢的好东西,请给我们留言,希望能够让更多的朋友了解。
1. JSFIDDLE
JSFIDDLE是一个超棒的在线JS/CSS/HTML调试和分享工具,大家可以方便的在web页面中分享代码,或者调试代码。并且有效的和同事或者朋友分享。
2. JSBin
JSbin是另外一个相当不错的在线调试和分享网站,和JSFIDDLE非常类似,但是整体界面更偏重于编辑和调试。你拥有更大的编辑区域,而且拥有控制台可以查看错误。
3. HTML/CSS/Javascript的在线开发工具 - Fiddle Salad
超棒的HTML/CSS/Javascript的在线开发工具,如果你使用过JSFIDDLE的话,相信大家会更喜欢这个功能强大的在线整合开发环境。
4. Tinkerbin
另外一个在线调试和演示前端开发工具,和jsfiddle比较起来,TinkerBin界面功能比较简答,但是界面布局更加合理。使用jsfiddle的时候,总感觉每一个窗口的输入都比较费劲,用户不得不来回的拖拉窗口。而使用Tinkerbin, 你可以更加容易的切换多个窗口或者单一个窗口来浏览器CSS、HTML或者JS代码。
5. Browser Support
作为一个前端开发者来说,处理不同浏览器的兼容性问题如同家常便饭,但是如果让你说出不同浏览器的CSS兼容性区别,还真不太容易,这里介绍的这个工具Browser Support,可以很方便的告诉你不同浏览器下的CSS区别以及是否被支持。相当的方便!
6. openwebicon
如果你厌倦了图片生成的图标的话,使用openwebicon是一个不错选择,你只需要添加class即可生成需要的图标。
7. gradient-scanner
这个工具超酷,能够帮助你将上传图片中的渐变特效生成CSS样式,非常便捷和高效,也非常实用。
8. Em Calculator
Em calculator是一个轻巧的JavaScript工具,能够帮助你创建灵活的CSS设计。它帮助你转换像素到em单位。可以帮助你有效的查看、比对像素和字体大小。
9. CSS ARROW PLEASE!
一个在线的、简单实用的生成气泡式提示的web工具。
10. checkmycolours
一个帮助你检查网站颜色对比度的工具,能够有效的帮助你设计搭配完美的颜色方案。
11. Screenqueri.es
如果你需要开发响应式布局设计的网站的话,这个工具肯定能够帮你大忙,它能够模拟不同设备的屏幕尺寸,并且帮助你占线不同设计上的网站显示效果,绝对是测试必备工具。
12. Dirty Markup
如果你需要一个帮助你规整书写混乱的代码的工具的话,我强烈推荐给你这个在线代码美化工具。这个在线工具能够帮助你有效的处理HTML/HTML5、CSS和JavaScript代码。
13. jQuery mobile原型设计开发工具 - codiqa
一个超棒的在线原型设计开发工具,这个在线设计工具能够帮助我们快速的使用拖拽的方式来构建一个基于jQuery mobile的web应用程序。
14. Screenfly
Screenfly是一个免费测试工具,可以用来测试不同客户端下(不同显示器或者移动设备)网站显示状况的工具。它使用一个代理服务器来模拟设备,并且支持最流行的平板电脑或者移动设备。
15. Fixie
fixiejs是一个超实用的虚构内容生成脚本,如果你设计网站或者网页,往往需要添加一些文字或者图片内容来查看效果,这个脚本可以有效的帮助你生成不同类型内容,让你专注于设计本身!
16. SimpleCart
超酷的纯JavaScript实现的购物车程序,能够很有效的帮助你生成一个B2C购物车。简单、实用、快捷!
17. Animate.css
animate.css 是一套超棒的CSS动画脚本,可以帮助你使用CSS实现各种类型的动画,不同的淡入、淡出,或者旋转、翻转特效。绝对是帮助你快速生成特效的好工具,你可以通过使用jQuery的addClass来给你的元素添加特效,方便实用,非常易于整合。 相信你一定会喜欢的!
18. Redactor - HTML富编辑器
基于jQuery的一个超棒WYSIWYG编辑器。这个编辑器使用jQuery技术作为框架开发完成,整合了很多炫酷的功能,比如,拖拽上传文件、自动保存等,速度很快,并且体积非常小。
19. jqueryboilerplate
jQuery Boilerplate是一个不错的jQuery插件开发工具,使用这个工具可以帮助你快速的构建一个jQuery插件。
相关推荐
个人收藏的JS前端开发脚本,里面有上百例脚本案例,是你成就JS前端设计师的梦想的舞台。 用过的给个好评,谢谢了!!!
MCGS脚本驱动开发工具,可以学习开发基于MCGS嵌入式组态软件相关的仪表驱动,可直接用MCGS触摸屏和仪表进行通讯交互。 脚本驱动是一种使用MCGS增强语言编写的设备驱动程序。 目的,是给用户提供一种与传统MCGS...
大家使用uiautomator ...并且可以基于本框架进行快速脚本开发。本贴不需要你学习怎么查找对应xml元素,源码里已经集成了。虽然XML并不困难。源码带了部分使用教程。使用生成子程序按钮,分析一下就能看懂了。@qqzzasw。
jquery.js脚本 前端辅助开发工具脚本
MCGS 脚本驱动 开发工具 简单易用 自动生成脚本工具
包含: 硬件检测 引导修复 效果图 系统检查 系统菜单 网络流量分析 强制修改系统 聊天软件 共享脚本 超级管理员密码 查看端口 IP一键切换
TC脚本开发工具界面美观简洁、使用方便、对于用户来说是一款很不错的软件,小编这里推荐大家使用这款软件! TC脚本开发工具功能特点 1、主要是模拟鼠标按键操作; 2、内置上百个中英文命,提供人性化的操作界面; ...
MCGS脚本驱动开发工具 使用教程 以及软件 中级使用教程 初级使用教程 脚本驱动开发软件等等
JSI框架提供一个无侵入的脚本库管理解决方案,和一个全面的前端开发调试、文档解析、模版编译、打包导出环境支持。 作为一个开发期间的脚本管理工具,让开发者在开发期间享受JSI带来的种种便捷,也可以作为一个运行...
【毕业设计】多用户在线云笔记平台开发(前端+后端源码+SQL脚本).zip 【毕业设计】多用户在线云笔记平台开发(前端+后端源码+SQL脚本).zip 【毕业设计】多用户在线云笔记平台开发(前端+后端源码+SQL脚本).zip ...
VBS脚本开发工具,辅助你编写VBS脚本
昆仑通态 MCGS脚本驱动开发工具功能概述视频rar,昆仑通态 MCGS脚本驱动开发工具功能概述视频
经典总结web前端开发中使用jQuery/js值得注意的一些地方,如DOM操作等额可以显著提升页面加载效率。
1500个前端开发常用JavaScript特效
昆仑通态脚本驱动开发工具使用指导手册对工程技术人员很有用
前端访问后台的脚本 do.ajax 前端访问后台的脚本 do.ajax 前端访问后台的脚本 do.ajax
本工具主要是针对简化网络工程师重复繁琐的工作而开发。工具只是将重复工作通过自己配置生成脚本代码来执行(其他运维场景估计也用得上)。考虑到易用性和数据操作的灵活性,采用EXCEL的VBA来进行开发,将数据放在...
请注意,这只是一个简单的示例脚本,实际的前端构建流程可能会更复杂,并涉及更多工具和步骤。在大型项目中,你可能会使用构建工具(如Webpack、Rollup)来自动化构建过程,并配置相应的加载器、插件等来满足项目的...