HBuilder:一个不错的web前端IDE(代码编辑器)

时间:2022-08-30 20:31:07

Web前端开发,2000之后基本就是三剑客的天下。到现在DW也是不错的HTMLcoder,如今的前端开发早已是JS的天下。但是DW对于JS方面就弱爆了。DW虽然支持JS语法高亮也支持JQuery JqueryMobile 甚至还支持Phonegap。但是对于JS的支持到了有的程度而已,语法高亮、语法提示仅此而已了。我们需要的是什么呢?

1.高度匹配的语法提示,例如我定义了哪些空间,语法提示至少可以自动提示控件的ID,控件对应的方法函数,自定义函数的语法提示。

2.JS与HTML的大纲导航

3.JS函数变量的定义追溯

4.JS兼容性处理

5.JS调试

HBuilder是什么?

这个IDE是基于eclipse的专门用于Web前端设计代码编辑器。是过国产HTML5+项目的配套IDE,HTML5+是一个类似PhoneGap的基于Html5+CSS+JS的轻应用解决方案。同时提供android、ios、移动Web应用。而且开源。国内目前这类项目还是比较丰富的,总的来说这类方案还不错,对于一些简单的应用特别是中小型企业发布自己的APP降低了门槛,减少了成本,提高了效率。我个人对这类技术持看好的态度。HBuilder就是用来构建基于HTM5+的Web轻应用的IDE,既然是Web应用,自然对HTML5\CSS\JS支持要足够高了。那么理所当然的HBuilder可以用来进行Web的前端开发。

HBuilder解决了什么?

1.JS与HTML的大纲导航

HBuilder:一个不错的web前端IDE(代码编辑器)

这是我的一个.net项目,前端有一些jquery mobile 的HTML页面,用HBuilder进行编码的时候,代码大纲功能非常好用,DW面对这个完全一脸的无力感啊。一个html页面里面同时包含一些后期处理的js代码正常不过了,如果DW那种在代码视图拖着滚动条定位行号,绝对是个苦逼的工作。HB帮我至少解决了代码导航的问题!当然它不够好的地方在于它不能定位jq的一些事件申明。

2.语法提示够用

完全可以实现自己定义的控件ID提示,也完全能够实现自己申明的函数的提示。这已经足够,完爆DW只能提示简单的JS常用函数!

HBuilder:一个不错的web前端IDE(代码编辑器)

HBuilder:一个不错的web前端IDE(代码编辑器)

3.定义追溯

其实这个也是解决的导航的问题,但是这个功能很常用。而且可以用eclipse的快捷键。ctrl+alt+d .而且我选择的词汇,同样的词汇都会高亮出来。

HBuilder:一个不错的web前端IDE(代码编辑器)

HBuilder:一个不错的web前端IDE(代码编辑器)

结语

虽然Hbuilder并没有解决所有的JS开发中问题,例如JS语法的调试,但是好歹我们有替代解决的办法,使用浏览器的开发者模式或者FireBug,而且在没有HB的时候我们也是这么干的。对于一个IDE没有调试功能应该算是功能缺失的IDE,但是它不妨碍我将其作为我web前端code主力工具,DW做UI,HB做JS,VS调试动态代码。我已经很幸福了。

 

HBuilder:一个不错的web前端IDE(代码编辑器)

HBuilder:一个不错的web前端IDE(代码编辑器)的更多相关文章

  1. 如何打造一个"逼格"的web前端项目

    最近利用空余的时间(坐公交车看教程视频),重新了解了前后端分离,前端工程化等概念学习,思考如何打造一个“逼格”的web前端项目. 前端准备篇 前端代码规范:制定前端开发代码规范文档. PS:重中之中, ...

  2. web前端开发 代码规范 及注意事项

    web前端开发 代码规范 及注意事项 外部命名规范 html .js .css文件名称命名规范 my_script.js my_camel_case_name.css my_index.html 路径 ...

  3. Web 前端开发代码规范(基础)

    一. 引言 对于一个多人团队来说,制定一个统一的规范是必要的,因为个性化的东西无法产生良好的聚合效果,规范化可以提高编码工作效率,使代码保持统一的风格,以便于代码整合和后期维护. 二. HTML/CS ...

  4. WEB前端学习代码片段记录

    1.JS设计模式片段 Function.prototype.addMethod = function (name,fn) { this.prototype[name] = fn; return thi ...

  5. 论如何在服务器上部署一个自己的web前端项目

    就在前两天,有新人通过邮箱问到笔者,如何部署自己的web前端项目?笔者在此详细介绍. 一.购买云服务器 配置用户名密码.安全组 二.下载Xshell于Xftp工具 用于登录服务器和文件上传 三.在li ...

  6. 如何才能成为一个合格的web前端工程师

    转载原文地址:https://juejin.im/post/5cc1da82f265da036023b628 开篇前端开发是一个非常特殊的行业,它的历史实际上不是很长,但是知识之繁杂,技术迭代速度之快 ...

  7. web前端常用代码于面试等资源

    https://www.cnblogs.com/moqiutao/p/4766146.html

  8. 学习WEB前端是应该自学还是参加培训机构?

    先说观点,我强烈建议每个人都要自学,不要参加培训班. 我干web前端工程师这个职位已经有6年多的时间,之前在蚂蚁金服做过2年,后来离开是因为加班实在熬不住才走的,像这些已经上市的互联网公司几乎没有不加 ...

  9. 一切从编辑器说起:web前端代码编辑器

    俗话说:工欲善其事,必先利其器. 工欲善其事必先利其器.谓工匠想要使他的工作做好,一定要先让工具锋利.比喻要做好一件事,准备工作非常重要. 前端写代码也是一样,需要一个好的适合自己的代码编辑器. 我想 ...

随机推荐

  1. Laravel五大功能之Eloquent关系模式

    Eloquent是Laravel的原始ActiveRecord是实现的,建立在Laravel的Fluent Query Builder之上的,所以Eloquent类和Fluent类是一样的,能实现复杂 ...

  2. [POJ1068]Parencodings

    [POJ1068]Parencodings 试题描述 Let S = s1 s2...s2n be a well-formed string of parentheses. S can be enco ...

  3. 【PHP自定义显示系统级别的致命错误和用户级别的错误】

    使用方法set_error_handler可以自定义用户级别的错误和系统级别的错误信息显示和处理 用户级别的错误使用trigger_error方法产生一个用户级别的错误信息 代码示例: 系统级别的错误 ...

  4. 【读书笔记】读《编写高质量代码—Web前端开发修炼之道》 - JavaScript原型继承与面向对象

    JavaScript是基于原型的语言,通过new实例化出来的对象,其属性和行为来自于两部分,一部分来自于构造函数,另一部分是来自于原型.构造函数中定义的属性和行为的优先级比原型中定义的属性和优先级高, ...

  5. linux(Centos 6.3)学习笔记

    一.系统分区    1,磁盘分区        使用分区编辑器(partition editor)在磁盘上划分几个逻辑部分.碟片一旦划分成          数个分区,不同类的目录与文件可以存储进不同 ...

  6. PAT1029.Median (25)

    (一)题目 题目链接:https://www.patest.cn/contests/pat-a-practise/1029 1029. Median (25) Given an increasing ...

  7. 【luogu P1186】玛丽卡

    https://www.luogu.org/problem/show?pid=1186 考虑暴力,枚举图上每一条边删去后跑Dijkstra,取M次的最大值. 仔细想想就会发现删除最短路以外的边对最短路 ...

  8. 瞎j8封装第二版之数据库连接池

    写得很蛋疼,本来想支持多线程的,奈何对多线程和连接池理解着实太菜: 所以,起码是能拿到连接了... 但是还是不太懂这个连接池 我也是半抄别人的,以后再搞一搞这个吧. 先是配置文件 理想是很丰满的,奈何 ...

  9. vue.js笔记总结

    一份不错的vue.js基础笔记!!!! 第一章 Vue.js是什么? Vue(法语)同view(英语) Vue.js是一套构建用户界面(view)的MVVM框架.Vue.js的核心库只关注视图层,并且 ...

  10. TFA(Trace File Analyzer)的安装与使用(ORACLE版本12C)

    TFA是Oracle从11.2版本开始推出的一种类似diagcollection的一个oracle 集群日志收集器,而且TFA比diagcollection集中和自动化的诊断信息收集能力更强大.TFA ...