什么是Hbuilder？

一，简介HBuilder

Hbuilder

HBuilder是DCloud（数字天堂）推出的一款支持HTML5的Web开发IDE。HBuilder的编写用到了Java、C、Web和Ruby。HBuilder本身主体是由Java编写。
它基于Eclipse，所以顺其自然地兼容了Eclipse的插件
从Frontpage、Dreamweaver、UE，到Sublime Text和JetBrains的WebStorm，Web编程的IDE已经更换了几批。但是HBuilder可以生存就是因为有自身的优势。

1.2，Hbuilder的优势是什么？

快，是HBuilder的最大优势，通过完整的语法提示和代码输入法、代码块等，大幅提升HTML、js、css的开发效率。
在HBuilder里预置了一个hello HBuilder的工程，用户敲这几十行代码后会发现，HBuilder比其他开发工具至少快5倍。“最全的浏览器兼容性数据、开发手机App等很多特点也都是HBuilder强于竞品的地方”，王安表示。以“快”为核心的HBuilder，引入了“快捷键语法”的概念，巧妙地解决了困扰许多开发者的快捷键过多而记不住的问题。开发者只需要记住几条语法，就可以快速实现跳转、转义和其他操作。比如alt+[是跳转到括号，alt+’是跳转到引号，alt+字母是跳转菜单项，而alt+左则是跳转到上一次光标位置。而Ctrl则是各种操作，比如ctrl+d就是删除一行。shift则是转义，比如shift+回车是，shift+空格是。
另外，HBuilder的生态系统可能是最丰富的Web IDE生态系统，因为它同时兼容Eclipse插件和Ruby Bundle。SVN、git、ftp、PHP、less等各种技术都有Eclipse插件。HBuilder的编写用到了Java、C、Web和Ruby。HBuilder本身主体是由Java编写，它基于Eclipse，所以顺其自然地兼容了Eclipse的插件。但因为Java效率太低，所以用C写了启动器。HBuilder柔和的绿色界面设计需要动态调节屏幕亮度，它还支持手机数据线\真机联调，而这些都是用C写的。
HBuilder很多界面，比如用户信息界面都是使用Web技术来做的，既漂亮，开发起来又快。最后，代码块、快捷配置命令脚本，都是用Ruby开发的。“这4种技术各有各的用途，我们团队内部也灵活运用，HBuilder的架构支持不同的技术互相融合信。至于我们的技术选型原则，首先满足用户需求，然后我们内部用什么技术能更快完成就会选什么技术”，王安解释道。

1.3，目前Web开发领域格局

目前主流的前端开发工具有Sublime为代表的文本编辑器，以及Webstorm、Brackets、Dreamweaver、vs等IDE。但说道为HTML5设计或做了特殊优化的，只有HBuilder、Webstorm和Brackets。文本编辑器以轻快方便的特点获得了很多用户的喜爱，但商业项目的编写缺少IDE还是会很低效。IDE相比文本编辑器最大的特点是拥有语法引擎，能够识别语言。编码比其他工具快5倍够不够？对极客而言，追求快，没有止境！代码输入法：按下数字快速选择候选项可编程代码块：一个代码块，少敲50个按键内置emmet：tab一下生成一串代码无死角提示：除了语法，还能提示ID、Class、图片、链接、字体…跳转助手、选择助手，不用鼠标，手不离键盘多种语言支持：php、jsp、ruby、python、nodejs等web语言，less、coffee等编译型语言均支持边改边看：一边写代码，一边看效果强悍的转到定义和一键搜索这里还有最全的语法库、最全的语法浏览器兼容库

二，Hbuilder IDE的下载

HBuilder下载地址：在HBuilder官网http://www.dcloud.io/点击免费下载，下载最新版的HBuilder。
HBuilder目前有两个版本，一个是windows版，一个是mac版。下载的时候根据自己的电脑选择适合自己的版本。

三，Hbuilder IDE的使用

3.1，设置编译器风格

Hbuilder打开之后，会出现一些很人性话的设置，还有一点就是Hbuilder的编辑器风格是黄色系，对眼睛比较好，不同于其他的编辑器一般是以黑白为主，这里我一般使用标准模式。

四，HBuilder的用法

4.1，什么是代码块？

代码块是常用的代码组合，比如在js中输入$，回车，则可以自动输入document.getElementById(id)。
查看、编辑代码块可以在工具-自定义代码块中，选择相应的代码块进行查看和编辑。也可以在激活代码块的代码助手中，点击详细信息右下角的修改图标进行修改和查看。
代码块激活字符原则1:连续单词的首字母。比如：dg激活document.getElementById(“”);vari激活var i=0;dn激活display: none;
代码块激活字符原则2:整段HTML一般使用tag的名称。比如script、style，通常，敲最多4个字母即可匹配到需要的代码块，不需要完整录入，如sc回车、st回车，即可完成script、style标签的输入。
代码块激活字符原则3:同一个tag，有多个代码块输出，则在最后加后缀。比如meta输出但metau则输出，metag同理。
代码块激活字符原则4:如果原始语法超过4个字符，针对常用语法，则第一个单词的激活符使用缩写。比如input button，缩写为inbutton，同理intext是输入框。
代码块激活字符原则5:js的关键字代码块，是在关键字最后加一个重复字母。比如if直接敲会提示if关键字，但iff回车，则出现if代码块。类似的有forr、withh等。由于funtion字母较长，为加快输入速度，取fun缩写，比如funn，输出function代码块，而funa和func，分别输出匿名函数和闭包。

什么是Hbuilder？相关推荐

HBuilder简单入门
HBuilder官网转载于:https://www.cnblogs.com/knuzy/p/9158440.html
【转】Hbuilder MUI 页面刷新及页面传值问题
文章来源:http://www.111cn.net/sys/CentOS/67213.htm 一.页面刷新问题 1.父页面A跳转到子页面B,B页面修改数据后再跳回A页面,刷新A页面数据 (1).父页面 ...
转载：HBuilder常用快捷键
原文:http://www.cnblogs.com/DCL1314/p/8625110.html HBuilder常用快捷键 1.文件新建 Ctrl + N 关闭 Ctrl + F4 全部关闭 Ct ...
HTML5+MUI+HBuilder 之初探情人
07,08年那会儿正当Java火爆,C/C++仍是广泛运用的一门语言的时候,所以我的大学都献给了C/C++和Java.当诺基亚的倒闭成为按键机时代衰落的标志时,移动APP的开发也如破堤之洪.爆炸式的崛 ...
Hbuilder开发移动App（1）
奇妙的前端,奇妙的js 众所周知,自从js有nodejs后,前端人员可以华丽的转身,去开发高并发非阻塞的服务端程序, 随着html5的出现,伴随一些amazing的特性,h5开发app的技术越发的成熟 ...
使用Wamp搭建Php本地开发环境，HBuilder调试
初涉Php,此处做点笔记,希望下次不要能够轻松应对,至少不要在入同一个坑本文摘要: wamp和HBuilder和Mysql5.7的安装包 Wamp的使用,包括80端口,443端口的占用问题 HBui ...
Hbuilder Android证书申请
Hbuilder Android证书申请 1.安装JDK 2.在cmd下,进入到JDK的bin目录,输入: keytool -genkey -alias yourapp -keyalg RSA -va ...
mac Hbuilder 无法打开的解决方案
mac Hbuilder 无法打开的解决方案参考文章: (1)mac Hbuilder 无法打开的解决方案 (2)https://www.cnblogs.com/silyvin/p/9106820. ...
Hbuilder 常用快捷键汇总
朋友推荐用Hbuilder编辑器,看了下Hbuilder官网和那视频,感觉牛逼哄哄的, 自己也就体验了一下,打开Hbuilder的快捷键列表,每个快捷键都体验了一下,以下展示出来的,每一个都是精华, ...
hbuilder入门之基本配置(php)
1.去Hbuilder官网下载最新的Hbuilder,安装即可. 2.打开Hbuilder,会发现有个HelloHbuilder文件,里面有个lession1.text,这个文件是属于入门文件,可以仔 ...

什么是Hbuilder？

一，简介HBuilder

Hbuilder

1.2，Hbuilder的优势是什么？

1.3，目前Web开发领域格局

二，Hbuilder IDE的下载

三，Hbuilder IDE的使用

3.1，设置编译器风格

四，HBuilder的用法

4.1，什么是代码块？

什么是Hbuilder？相关推荐

最新文章

热门文章