做为一名前端开发工程师或者说你的职业定位是一名前端开发工程师,如果你不知道前端工程师该用哪些工具来提高日常开发效率的话,那简直是个超级大悲 剧。请不要告诉我,你仅仅知道使用firebug、ie8-developer tool,更不要告诉我,你一直在使用adobe dreamweaver,可是昨天在和几个同行交流当中,还真的有人仅仅知道这些,我顿时感觉自己有必要将自己在工作中所积累、所使用的一些开发工具与大 家分享一下,掌握了这些开发工具,可以让你事半功倍。但是工具是死的,人是活的,你不应该太过依赖这些工具(虽然它们会让你事半功倍,但是你需要会把握这 个度),就像有些前端工程师写CSS有个坏习惯:喜欢在dreamweaver在编写,因为dreamweaver有CSS自动提示功能啊,但是兄弟我在 这里告诉你,你要改掉这些依赖软件的习惯!一定要改!你应该使用editor plus或者notepad++来编写HTML或者CSS。如果各位有更好的开发工具也可以在文章评论中写出来,一起分享提高前端开发工作效率。
以下是前端开发工具集合:如有错误的地方请留言给我
1、FireBug—这是大名鼎鼎的Firefox插件,做WEB的无人不知、无人不晓。该插件功能非常强大,包括:CSS样式异步调试、JAVASCRIPT控制台及调试以及数据流监控等等,也是目前最流行的前端开发工具。
http://getfirebug.com/
2、IE Tester—这一位也是很流行的前端开发工具。它可以在window系统中运行多个版本的IE浏览器,支持多语言切换,支持插件安装(Debugbar),它是调试浏览器兼容性的最佳工具。免费的。
http://www.my-debugbar.com/wiki/IETester/HomePage
3、Debugbar—这是IE下面的一个开发工具,用于调试CSS和JS。其主要在IE Tester下运行,因为IE8下面已经有开发工具了
http://www.my-debugbar.com/wiki/Doc/DebugbarInstall
4、IE Web Developer—IE下的开发者工具条,为浏览器故障诊断、DOM追踪、javascript调试等等提供了有效的帮助,IE8中默认安装。
http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038&displaylang=en
5、WebDeveloper—firefox下的一个扩展工具。从它的名称就能够看出来它的作用。它也是一款非常流行的开发工具,仅次于firebug,功能非常强大。
https://addons.mozilla.org/zh-CN/firefox/addon/60/
6、HttpWatch—运行在IE和firefox下的一款监听HTTP和HTTPS以及WEB数据流的开发工具。
http://www.httpwatch.com/
7、HttpFox—和HttpWatch非常类似的一款开发工具,其主要是安装在firefox的插件中
https://addons.mozilla.org/eu/firefox/addon/6647?lang=en-US
8、Yslow—由YAHOO前端团队(YUI Team)开发的一款运行在Firefox下的网站性能分析工具。
http://developer.yahoo.com/yslow/
9、Editplus—window下的一款非常好用的文本编辑器
http://www.editplus.com/
10、Notepad++–一款非常轻巧的文本编辑器,但是功能非常强大
http://notepad-plus-plus.org/
11、JS Beautifier—一款javascript在线格式化工具
http://jsbeautifier.org/
12、JSLint—在线javascript语法校验工具
http://jslint.com/
13、JSCompress —在线压缩javascript工具
http://jscompress.com/
http://dean.edwards.name/packer/
14、JSMin—javascript压缩工具,可安装在window系统中
http://www.crockford.com/javascript/jsmin.html
15、JS Regexp Generator—javascript正则表达式编写工具(在线的)
http://www.jslab.dk/tools.regex.php
16、Companion JS—一款运行在IE下的javascript代码追踪插件,非常好用。报错信息非常详细、准确,它需要结合Microsoft Script Debugger。360安全卫士会把该插件列为IE有害插件,你可以忽略360的安全报告.
http://www.my-debugbar.com/wiki/CompanionJS/HomePage
17、CSS Compressor—在线压缩CSS的工具,非常好用。
http://www.cssdrive.com/index.php/main/csscompressor/
18、CSS Sprite Generator—在线生成CSS Sprite
http://spritegen.website-performance.org/
19、Winmerge—文件比对工具,和SVN中的文件比对相似,但是个人觉得它比SVN中的文件比对功能好用
http://winmerge.org/
20、Aptana—一款功能非常强大的开发IDE,可以编写HTML、CSS、JS、JAVA、C、C++、PHP……..,aptana也支持代码提示功能、支持代码结构显示以及项目大纲,比Dreamweaver好用N倍。强烈推荐!
http://www.aptana.com/
21、RegExpLib一个在线版本的正则表达式库
http://regexlib.com/Default.aspx