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

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

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

其功能如下:

1、快速编辑
将光标定在颜色上,按下快捷键Ctrl+E即可编辑颜色。

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

2、快速文档
文档是英文的,快捷键是Ctrl+K,简单测试得出,可以提示css属性的用法

3、多点编辑
选中一串字符,按Ctrl+B可以连续选择相同的字符一起编辑。或者可以通过按住Ctrl+鼠标左键点击来设定多个编辑点。

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

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

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

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

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

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

推荐几个常用插件:

Emmet

Minifier

Beautify(代码美化,格式化)

Brackets Snippets(代码片段)

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

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

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

1、快速样式编辑因为要搜索整个目录,所以速度会很慢,要用它得配个SSD才行。。。

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

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

4、没有ST那么随心所欲,ST甚至可以修改Tab键、Enter的默认功能,触发顺序等,非常强大。

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

Brackets - 前端神器的更多相关文章

  1. 打造你的前端神器-webstorm11

    说起前端编辑器,用过dw,sublime,hbuilder,webstorm也不陌生,之前的版本8有用过一下,但是觉得比sublime重量太多,但是随着后来用node的开始,发现需要打造个web前端神 ...

  2. Brackets - 前端编辑器推荐

    Brackets是一款基于web(html+css+js)开发的web前端编辑器.它有许多普通编辑器难以实现的功能,是web前端开发者的神器. 戳我去下载 其功能如下: 1.快速编辑 将光标定在颜色上 ...

  3. Brackets前端开发IDE工具

    Brackets是一个开源的前端开发IDE工具,网页设计师和前端开发人员必备的前端开发IDE工具. 它能够使你在开发WEB网站实时预览你的网页,目前版本只适用于Chrome浏览器可以实时预览效果 支持 ...

  4. [前端神器]handlebars+require基本使用方法

    最近在某网站看到了handlebars.js,出于好奇就百度了下这是神马玩意,结果让我很是欢喜,于是就开始自学下,handlebars就几个方法,蛮简单,言归正传! 以下是基本教学逻辑演示,会附完整代 ...

  5. 前端神器 Firebug 2.0 新特性一览

    如果你从事Web前端方面的开发工作,那么对Firebug一定不会陌生,这是Firefox浏览器的一款插件,集HTML查看和编辑.Javascript控制台.网络状况监视器于一体,给Web开发者带来了极 ...

  6. 前端神器-神级代码编辑软件Sublime Text下载、使用教程、插件推荐说明、全套快捷键

    Sublime Text 是一个代码编辑器,也是HTML和散文先进的文本编辑器.Sublime Text是由程序员Jon Skinner于2008年1月份所开发出来,它最初被设计为一个具有丰富扩展功能 ...

  7. [前端神器]handlebars+requirejs基本使用方法

    最近在某网站看到了handlebars.js,出于好奇就百度了下这是神马玩意,结果让我很是欢喜,于是就开始自学下,handlebars就几个方法,蛮简单,言归正传! 以下是基本教学逻辑演示,会附完整代 ...

  8. 前端神器avalonJS入门(一)

    转自:http://www.cnblogs.com/vajoy/p/4063824.html avalonJS是司徒正美开发和维护的前端mvvm框架,可以轻松实现数据的隔离和双向绑定,相比angula ...

  9. 前端神器avalonJS入门(三)

    本章将介绍如何使用avalon来实现前端路由功能. 我们需要用到两个avalon路由配套模块—— mmHistory.js 和 mmRouter.js .其中mmHistory是用于历史管理,它会劫持 ...

随机推荐

  1. luogu3455 [POI2007]ZAP-Queries 简单的莫比乌斯反演

    link ms是莫比乌斯反演里最水的题... 题意:对于给定的整数a,b和d,有多少正整数对x,y,满足x<=a,y<=b,并且gcd(x,y)=d. 多组询问, T<=50000, ...

  2. 洛谷2685 [TJOI2012]桥

    [TJOI2012]桥 题目大意:给定一无向图,求删除一条边后1到n最短路的最大值,以及方案数. 做法:我们先从1为起点.从n为起点跑两边dij,获得每一个点到起点1.终点n的最短距离,其实距离和边权 ...

  3. 数据结构42:n个结点构造多少种树

    本节要讨论的是当给定 n(n>=0)个结点时,可以构建多少种形态不同的树. 如果两棵树中各个结点的位置都一一对应,可以说这两棵树相似.如果两棵树不仅相似,而且对应结点上的数据也相同,就可以说这两 ...

  4. 洛谷 P1801 黑匣子_NOI导刊2010提高(06)

    题目描述 Black Box是一种原始的数据库.它可以储存一个整数数组,还有一个特别的变量i.最开始的时候Black Box是空的.而i等于0.这个Black Box要处理一串命令. 命令只有两种: ...

  5. 黑马学习CSS之选择器 简单选择器,结合符,选择器,选择器组, 选择器优先级,名称空间

  6. fatal error C1859: “Release\IWBServer.pch”意外的预编译头错误,只需重新运行编译器就可能修复此问题

    解决方案 1.    创建预编译头(/Yc)   -- >     stdafx.cpp    使用预编译头(/Yu) 2.    complie 3.    使用预编译头(/Yu)    -- ...

  7. java读取配置到Hash表里

    import java.io.FileInputStream; import java.io.FileNotFoundException; import java.io.IOException; im ...

  8. 兼容IE,chrome,ff的设为首页、加入收藏及保存到桌面

    // JavaScript Document// 加入收藏 < a onclick="AddFavorite(window.location,document.title)" ...

  9. Quartz中Cron详解

    Quartz中的cron跟Linux系统的cron定义不太一样(Linux从分开始) 特殊字符: * 用来表示包含一个范围内的任意值. 例如, 分钟位置的“*” 表示 “每分钟”. ?  当不特定指代 ...

  10. Spring boot的热部署

    当把配置文件,比如yml也打到jar包后,如何修改配置,而又不用重新发布呢? 在jar包同一目录下,放置Application.yml (注意,不管jar包内是否此文件名)修改配置文件后,重新启动ja ...