学HTML5哪种前端开发工具比较好用？

作为一个前端开发工程师，使用一款自己上手且功能强大的开发工具是非常重要的，但是面对这么多开发工具，到底哪个比较好呢？

CSS

尽管CSS被认为只是属性－参数值对的简单集合，但是CSS却是很难掌握的。CSS3引入了许多的新特性，要想完全的掌握CSS变得越来越困难。

CSS预处理器

超过63％的开发者使用Sass，这也使得Sass成为无可争议的预处理首选者。8%的开发者使用PostCSS，通常情况下，PostCSS都是和AutoPrefixer等预处理器配合使用的。

仅有14%的开发者不使用任何预处理，他们更喜欢使用原始的CSS代码。尽管这种方式开发效率较慢，但是却是刚开始学习前端开发的最容易和最好的方式。如果86%的开发者使用预处理器，则平均一个网站需要进行7.2个CSS文件的请求。

仅有10%的受访者尝试过Less，19%的受访者尝试过Stylus。80%的受访者从未听闻Rework。

CSS的命名方式

46%的开发者在编码时会使用一种命名方式，对于CSS高级开发者和专家来说，这个比例上升到了57%。

最受欢迎的命名方式是BEM，占到总数的40%。接下来是CSS Modules（16%）、OOCSS（15%）和SMACSS（13%）。

其它的CSS工具

39%的受访者在当前的项目中使用Modernizr。14%的受访者使用Stylelint来检查CSS的有效性。23%的开发者不使用任何CSS工具或命名方式。

JavaScript

库和框架

尽管存在相关性问题，但是超过99%的开发者都曾使用过jQuery，有31%的受访者认为使用jQuery对大多数项目来说都很重要。目前仍有近70%的受访者继续在现有的项目中使用jQuery：

框架的情况看起来比较让人迷惑：

38%的项目目前正在使用React，然而只有29%的开发者认为使用React很流畅，18%人开发者认为使用React很有必要。0.1%的网站被发现使用了React，但请记着，这些调查结果只取自于前端开发人员，并不是所有的网页开发者。

25%的项目目前正在使用angular 1，然而只有8%的开发人员认为使用Angular 1很有必要，同时选择使用Angular 2的只有8%。

Vue.js已被用于10%的项目中，但只有不到6%的开发人员对这个框架感到满意，3%的人认为使用Vue.js很有必要

任务执行工具和模块绑定

有44%的开发者使用Gulp，所以Gulp是当仁不让的最受欢迎工具。同时，更为简单的npm script也从2016年的23%使用率上升到了26%。

Grunt的使用率下滑到了12%。有11%的受访者选择不使用任何任务执行工具。

使用模块绑定的开发者自2016年以来增长了20%，达到68%。其中Webpack是最受欢迎的模块绑定工具，占到了31%，其次是Browserify（11%）、RequireJS（8%）。

编译器：将ES6代码编译为ES5

62%的开发人员正在使用Babel这样的编译器，来将ES6代码编译为对旧浏览器更为友好的ES5代码。31%的受访者听说过这样的编译器，但是并未使用过。7%的开发者从未听说过这样的编译器。

62%这个数据是比较高的。IE和旧的应用并不支持最新的JavaScript语法，所以如果你正在编写的是ES6代码，那么就需要最新的浏览器来支持。如果项目需要在旧的浏览器版本下运行，那么最好编写ES5代码。

其它JavaScript工具

41%的开发者使用ESLint，19%的开发者使用JSLint，14%的开发者使用JSHint这样的工具来检查代码的合法性。

23%的受访者表示，他们不使用任何代码合法性检查工具。但是他们可能会使用文本编辑器和IDE来检查代码错误。

测试工具的使用率在一年时间之内增长了12%，达到了52%。但是纵观过去，JavaScript的测试一直是个挑战。测试驱动开发（TDD）这样的技术虽然能够捕获逻辑错误，却不能捕获异步事件下发生的错误。幸运的是，行为驱动开发（BDD）很可能会融合到真实浏览器的检查活动中，这样也会促使前端测试更加可操作。

hbuilder

作为一个编程的菜鸟，对于英语真的是有心无力，尤其是一些国外的开发工具都是英文界面，我就非常的不喜欢。hbuilder是国产的一款前端开发工具而且是免费的，对于英语不好的前端工程师是一个不错的消息。hbuilder的官方大致是这么解释为什么要开发hbuilder的：HTML最开始其实不是一个编程语言，确实用不着什么ide。但是发展到现在，7w多个语法，js越来越庞大，真开发一个达到原生水准的App，不是用以前的文本编辑器能搞定的。

目前竟然没有一个开发工具能把7w多HTML5语法提示齐全，这不科学，在原生开发里这是不可想象的，xcode之于iOS，eclipse之于Android，vs之于winphone，在语法提示、转到定义、重构、调试等方面都非常高效。作为同时熟悉原生和HTML5开发的我们，我们在开发HTML5时明显感受到效率低下。于是有了hubuilder。确实是hubuilder支持左右的前端语法代码提示，这个是我最喜欢的它的一个原因，而且还有强大的其他语言支持和开发webapp等功能，强大到没朋友。缺点也是有一些的，就是其有些稳定，有时可能会有些卡顿的现象，希望官方修复。

sublime text

sublime text是一个轻量级的编辑器，也是支持各种编程语言，sublime text所有的强大功能都是支持插件的，而且快捷键十分的好用，可以极大的减少开发的劳动程度，使用sublime就是要使用其快捷键和插件。该软件的优点的轻量级但是功能强大，缺点是对于项目的管理等不是很方便，代码提示不如hubuilder强大。

dreamwave

这是一款很经典的前端开发工具了，以前人们使用的是它的可视化开发工具，但是现在它只能是作为一个代码编辑器来使用的，当然一些可视化的功能现在也是用的上，如要插入Flash视频等还是使用可视化简单一些，毕竟不是所有人都能纯手写哪些意义不大的代码，优点是人们熟悉稳定，支持一些可视化的插入操作，缺点是代码提示不好，不能进行快速的开发只能是作为学习使用。

总结：以上只是前端开发工具中个人比较熟悉的，除此之外还有很多优秀的前端开发工具如webstorm等，大家可根据自己的喜好选择自己习惯的工具进行开发。