Brackets - 前端神器

作了几年的 .Net 项目开发,后来公司转 Java 语言开发,Java 作了还没一年,公司准备先后端分离开发,而我被分到前端!css

Brackets是一款基于web(html+css+js)开发的web前端编辑器。它有许多普通编辑器难以实现的功能,是web前端开发者的神器。html

Brackets官网下载:http://brackets.io/前端

其功能以下:web

一、快速编辑
将光标定在颜色上,按下快捷键Ctrl+E便可编辑颜色。后端

将光标定在标签或者class或者id上,Brackets就会搜索整个目录下的css,列出匹配的项,快速编辑样式,不再用处处找样式啦!浏览器

 

二、快速文档
文档是英文的,快捷键是Ctrl+K,简单测试得出,能够提示css属性的用法前后端分离

三、多点编辑
选中一串字符,按Ctrl+B能够连续选择相同的字符一块儿编辑。或者能够经过按住Ctrl+鼠标左键点击来设定多个编辑点。编辑器

四、目录管理
侧边栏分为两块,上面一块工做区,显示当前打开的文档,下面一块是当前目录的文件列表,点击目录名称能够添加新的目录或者切到其它目录(Brackets里叫目录,不叫项目,其实同样)。工做区右边两个按钮,一个是设置排序按钮,一个是分屏按钮,能够将屏幕横切或竖切成两块。函数

五、实时预览
实时预览,你懂的。用过Sublime Text的应该知道Emmet LiveStyle,可是有许多问题。而Brackets的实时预览是编辑器自己就整合的,使用起来要好的多。点击右侧扩展里的第一个闪电图标打开实时预览。工具

第二个图标是同步手机端实时预览,手机端须要安装Edge CC。

其实Brackets还有另一个名字Adobe Edge Code CC,他们的功能几乎如出一辙,至于到底什么关系,就等英语学的好的大神们去窥探了。

六、JSLint语法检查
对js文件,内置JSLint语法检查器,它能够检查出一些难以用肉眼发觉的错误,吐槽一下,少个空格你也算个问题?一个alert函数你报了8个问题。。。

七、扩展插件
Brackets也支持插件,点击右侧工具箱的图标,能够打开扩展管理,固然,有时候会被墙一下。

推荐几个经常使用插件:

Emmet

Minifier

Beautify(代码美化,格式化)

Brackets Snippets(代码片断)

总结
Brackets用着漂亮的UI,还有许多特点功能,它是一款基于web语言开发的编辑器,在编辑器中按F12会在Chrome浏览器中打开控制台,能够看到Brackets的“内脏”。

本人使用的是Sublime Text,因为熟悉了ST的快捷键,自定义了许多代码片断,宏命令等,转到Brackets实在不舍。

目前我发现它也有一些缺点,以下:

一、快速样式编辑由于要搜索整个目录,因此速度会很慢,要用它得配个SSD才行。。。

二、目前没有发现宏功能,不过对宏的需求不是很大。

三、代码片断没有ST好用,快捷键须要设置组合键,其余键按了不是没反应就是触发默认功能了。

四、没有ST那么为所欲为,ST甚至能够修改Tab键、Enter的默认功能,触发顺序等,很是强大。

但对于新手来讲,我比较推荐这款编辑器,毕竟除去了习惯的问题,它仍是有许多地方作的比Sublime Text要好。

相关文章
相关标签/搜索