web前端开发七武器

web前端开发七武器

发布于2011年01月11日，归属于前端开发工具。 前41个座位已被强势霸占！ 共有4,037人围观



前几天发了一篇《2010年天朝前端发展回忆录》，颇为意外，讨论最多的居然是前端IDE的话题，究竟哪款IDE才是最适合或是为前端量身定做的IDE？就目前来看，这个话题还没有答案，因为大部分IDE的出现并不是为前端服务的（aptana除外，但aptana目前越来越偏重ruby了，所以称其为 ruby的IDE更恰当）。同时，这个话题也激发了明河写一篇前端开发工具总结文章的想法。

工欲善其事必先利其器
对于那门语言来说工具都是非常重要的一块，前端开发的情况比较特殊，五花八门，十八般武器都有，而这个行业真的发展很快，新工具也是层出不穷，这对于前端初学者来说，既是福音，又是麻烦事，选择多了，未必是件好事，当然没选择，就绝对是件坏事。
接下来明河根据自身对工具的使用感受，将前端工具做了下总结和归类。同时我会在接下来的时间写出关于这些常用工具的使用教程。

武器一：前端开发IDE

最佳前端开发IDE：[b]IntelliJ IDEA[/b]
推荐指数：












凭什么最佳IDE是IntelliJ IDEA？论资历比不过dreamweaver(其实在java开发中idea的名气是蛮大的，国内用的人太少)；论血统比不过 aptana(aptana的诞生还是很明确的，就是前端开发用的。)；论轻巧比不上editplus、nodepad++；论牛逼还有Visual Studio横在那呢。
关于理由，明河这里先不讲，等日后明河发IntelliJ IDEA的系列使用教程时，会一一给朋友们演示IntelliJ IDEA强悍的地方。
明河使用DW不下1年，使用aptana也不下1年，期间还陆续使用了editplus、nodepad++，而明河使用idea只是二三个月，就把其他工具给抛弃了，剩个nodepad++（轻量的好处就是打开快，便于快速调试）。
idea教程正在谋划中，敬请期待！

武器二：前端开发调试器

最佳前端开发调试器：[b]firebug[/b]
推荐指数：












firebug作为最佳前端开发调试器，应该是毫无争议的，也许你会告诉明河还有google chrome开发者工具呢。是的，论功能google chrome开发者工具不输于firebug，但论影响力firebug就非google chrome开发者工具可比，firebug的出现在整个前端发展史上具有重要的意义。
firebug的使用，我想明河无需多此一举写教程了，大家都懂的…..

最佳性能分析器：[b]YSLOW[/b]
推荐指数：












前端工程师诞生于雅虎，而雅虎对于前端发展推动作用是巨大的，比如js框架YUI2、YUI3，比如yuicompressor，比如YSLOW，SLOW阐述的几个关于web性能优化准则，已经成为前端行业标准。

最佳远程调试器：fiddler（小提琴）
推荐指数：












fiddler的本地代理调试真的非常的方便和强大，尤其是调试ajax的时候（调试ajax，如果你复制一份代码到本地，存在跨域问题，请求不到数据而使用fiddler不用担心这个问题）。

武器三：前端文件压缩/编译器

最佳压缩器/编译器：[b]yuicompressor和Google Closure Compiler[/b]
推荐指数：










从js压缩的质量来看，Google Closure Compiler的压缩率比yuicompressor高些，Google Closure Compiler更准确说法应该是编译器。它要求你的js符合规范，不然压缩后的js很容易报错，yuicompressor一般没这个问题。css的压缩二者相差倒是不大。目前明河是二者都有用，yuicompressor用的更频繁些。

武器四：前端开发build工具

最佳前端开发build工具：[b]ant[/b]
推荐指数：










这里的build工具主要指的是一键合并、压缩、移动、删除js文件、css文件等。
关于ant，明河写了不少教程：

ant入门指南—web前端开发七武器（1）

认识基础任务标签（上）—ant入门指南（3）

认识基础任务标签（下）—ant入门指南（4）

property—ant入门指南（5）

dataType—ant入门指南（6）

ant结合yui-compressor和closure-compiler—ant入门指南（7）

ant结合jsdoc构建js文档—ant入门指南8

武器五：多浏览器

最佳IE多版本浏览器：[b]IETEST[/b]
推荐指数：










浏览器兼容性调试，是前端工作的很重要的组成部分，其中以IE6、IE7、IE8的调试最让人头疼，IETEST可以解决这一问题，值得一提的是IETEST也只是模拟，没有达到百分百的真实效果，有条件的最好用虚拟机。

备选多版本浏览器：[b]Browser Sandbox [/b]

武器六：javascript测试器

最佳javascript单元测试框架：[b]Jasmine[/b]
推荐指数：










Jasmine是kissy使用的js测试框架，也是明河鼎力推荐的测试框架。

Jasmine入门教程—web前端开发七武器（上）

Jasmine入门教程—web前端开发七武器（下）

jasmine快速入门（PPT）

武器七：版本控制系统

最佳版本控制系统：git
推荐指数：













明河的git学习笔记：

msysGit的中文支持—git学习笔记

git处理文件忽略—git学习笔记

github快速使用指南—git学习笔记

明河结语

欢迎朋友们补充其他前端工具，明河在此先拜谢。