码代码新神器-Github Atom

 

周末闲着没事,逛论坛发现了一个新的编辑器,由github发布的Atom编辑器。瞬间被吸引了,所以就去尝试着折腾了一下,后来发现这个编辑器确实很不错,他的特点就是两个字:优美!!!

下载地址,官方网站下载速度太慢太慢了。。。这里有个github的下载地址。要快很多 下载编辑器点这里

Atom介绍

Github的员工Nathan Sobo在Atom的博客中提到:"Sublime和TextMate十分方便,但是扩展性不足;另一方面,Emacs和 Vim扩展性很强却需要学习日程工作中很少用到的脚本语言。"因此,他们希望找到一个平衡点,于是就有了Atom这个项目。

Atom 代码编辑器支持 Windows、Mac、Linux 三大桌面平台,完全免费,并且已经在 GitHub 上开放了全部的源代码。它支持各种编程语言的代码高亮(HTML / CSS / Javascript / PHP / Python / C / C++ / Objective C / Java / JSON / Perl / CoffeeScript / Go / Sass / YAML / Markdown等等)。

下面是优酷上Atom的宣传片,逼格好高的样子,老奶奶都写会css...:

我捣腾了这么久,说说自己的看法吧。作为一个一直使用sublime 编辑器的人来说,转用Atom是非常的简单,Atom和Sublime功能非常相似,很多快捷键都是一样的。虽然他们现有功能差不多,并且sublime更加轻巧,但是我觉得相比于sublime,Atom的优势也很明显,界面更加优美,功能强大,插件使用方便,可扩展性强等等。。。

优美

Atom装了expose这个插件之后,mac用户使用shift+command+e组合键可以得到意想不到的酷炫!!下面是截图为证,可以方便的看到每一个文件大概的内容,快速选择已经打开的文件。方便!!!优美!!!

和git完美结合

Atom 编辑器可以和 GIT 完美结合,所有对代码、文本的修改都能体现在编辑器的界面上。

比如在文件内新写的代码会在左边标记为绿色,删除的标记为红色,修改的标记为黄色。在左边的目录导航也能方便的看到文件改动:有改动的文件其文件名和所在文件夹名都会被标记为高亮显示。

编辑器底部会显示当前所在分支和对文件的修改行数统计,对于 GIT 用户来说非常方便。

基于WEB技术构建

和微软发布的Visual Studio Code编辑器一样,Atom 也是基于WEB技术(Chromium+Node.js)开发的,简单理解的话编辑器本身其实是一个跑在本地的网页,这足以让无数 WEB 工程师为之兴奋!用户可以用Javascript来编写编辑器插件,并且github大家都知道,他是Atom的强大后台支撑,这里有着大量的编程爱好者,相信Atom的插件会持续的增多,Atom也会变的越来越优秀。

Atom推荐插件

安装插件跟sublime一样,可以在setting界面中,搜索安装,也可以快捷键shift+command+p跳出搜索输入框输入关键字进行安装。

atom-beautify:美化代码,格式化代码的插件。

autocomplete-paths:输入.或者/的时候,会自动提示路径和路径下的文件。非常好用!

autoprefixer:css样式的兼容性添加。当写好自己的css之后,会自动添加类似-webkit-等前缀的css样式代码。

color-picker:css中需要赋值颜色的时候,使用这个插件可以看到一个完整的取色器,实时的取色,改变。。。非常方便!

file-icons:左边工程目录的每一个文件,如果有一个小图标表示就漂亮了,没错,就需要这个插件了。

git plus:当然是为了更好的使用git了。

markdown-format,markdown-writer:如果你不是Mac用户,并且十分喜欢使用markdown来写东西的话,那么你一定会爱上在Atom上写markdown的感觉~~

linter: 自动提示你代码中不规范的地方,让你拥有更加规范的代码习惯。如果你想得到完整的信息提示,则推荐这个插件linter-jshint

minimap:用过sublime text的同学一定知道右边那方便的缩略图,难道这么好用的工具Atom上会没有吗?不会!这个插件就会让你见到熟悉的缩略图, 而且功能更加强大!

插件 说明
minimap-codeglance 放大镜的功能,这个插件就会让你的鼠标移动到缩略图上的时候放大显示那边部分的代码
minimap-find-and-replace 当你想替换单词的时候你会想起ctrl+D,可以你知道全篇有多少你要替换的字符串吗?通过这个插件你就可以在缩略图上看到所有你选中的字符串
minimap-git-diff 通过这个插件,每当你修改你的代码的时候你就会在缩略图上看到和之前git中的区别
minimap-highlight-selected 当你选中部分代码的时候,它就会高亮的出现在缩略图中
minimap-linter 这个插件让你的缩略图显示的更加漂亮和完整

expose:当你一次性打开多个文件的时候也许你会使用分屏来查看,安装了这个插件之后使用shift+command+e就可以分屏查看。截图上面已经出现过,美不美!!!

atom-material-ui:这是一个主题插件,他有自带的一些动态效果,特别酷炫。话不多说,自己试试就知道。

终于废了老半天时间来搞这个编辑器,不过每装一个插件就能感受其强大的时候,就觉得很值得,下面是我使用这个主题的截图,很漂亮吧?

Atom快捷键

其实Atom和sublime的跨界件非常相似,比如我常用的cmd+d,这里只列出一些常用的快捷键。

ctrl+shift+s 保存所有打开的文件

cmd+\ 显示或隐藏目录树

cmd+b 在打开的文件之间切换

cmd+d 快速查找选中的内容

cmd+right, ctrl+E 移动到一行结束

cmd+left, ctrl+A 移动到一行开始

cmd+K, cmd+U 使当前字符大写

cmd+K, cmd+L 使当前字符小写

ctrl+shift+K 删除当前行

ctrl+shift+U 调出切换编码选项

cmd+F 在当前打开的页面中查找

cmd+shift+f 在整个工程中查找

ctrl+space 提示补全信息

ctrl-shift-M Markdown预览(前提是装了markdown插件)

如果有需要,大家去看这个链接吧,里面的快捷键总结非常的全面,想看点这里

Github Atom的更多相关文章

  1. Github Atom 1.12.0-beta3 发布

    Github Atom 1.12.0-beta3 发布了,Atom 是 Github 专门为程序员推出的一个跨平台文本编辑器.具有简洁和直观的图形用户界面,并有很多有趣的特点:支持CSS,HTML,J ...

  2. 学会了 Vim 还有必要用 GitHub Atom 或者 Sublime Text 么?

    亦俊 ,90后,Vim 专栏作者 563 人赞同 Vim 知乎专栏:http://zhuanlan.zhihu.com/hack-vim 用过 [ Visual Studio 2015 ] [ Sub ...

  3. 我的前端故事----优美的编辑器GitHub Atom

    很多前端的同学都在用sublime text,我之前也在使用,但是后来接触到了Atom,就被它的高颜值深深的吸引了~~不愧是GitHub的工程师哦~审美就是高  Atom 作为一个跨平台的编辑软件,安 ...

  4. 码代码新神器-Github Atom

    周末闲着没事,逛论坛发现了一个新的编辑器,由github发布的Atom编辑器.瞬间被吸引了,所以就去尝试着折腾了一下,后来发现这个编辑器确实很不错,他的特点就是两个字:优美!!! 下载地址,官方网站下 ...

  5. github atom创建自己的语法高亮

    使用atom一段时间了,有些插件还不是很成熟.比如项目中使用protobuf,早就有人写了语法高亮(https://github.com/podgib/atom-protobuf),但是效果不是很好. ...

  6. github atom 试用

    github的编辑器atom 1.0已经出来了,在https://atom.io/ 我之前在win上一直用notepad++写了两年脚本.最近改写lua了,项目组统一用的sublime text.su ...

  7. Github Atom开源文本代码编辑器- 由 Github 打造的下一代编程开发利器

    个人理解:Github 热度超凡的一个项目Atom,electron是整个atom的核心,对于electron可以理解成 electron =io.js + Chromium    通过 Electr ...

  8. Github Atom汉化方式

    1.下载:Atom  https://atom.io/ 2.安装 3.菜单栏 -- Setting --- Install --- 搜索Chinese --安装汉化包 4.重启 生效.

  9. 徹底刪除atom

    rm -f ~/.atom rm -f /usr/local/bin/atom rm -f /usr/local/bin/apm rm -f /Applications/Atom.app rm -f ...

随机推荐

  1. Android NumberPicker和DatePicker分割线颜色设置

    NumberPicker /** * * 设置选择器的分割线颜色 * * @param numberPicker */ private void setDatePickerDividerColor(N ...

  2. handler.postDelayed()和timerTask

    public static void scrollToListviewTop(final XListView listView) { listView.smoothScrollToPosition(0 ...

  3. 浙江大学PAT上机题解析之3-04. 一元多项式的乘法与加法运算

    设计函数分别求两个一元多项式的乘积与和. 输入格式说明: 输入分2行,每行分别先给出多项式非零项的个数,再以指数递降方式输入一个多项式非零项系数和指数(绝对值均为不超过1000的整数).数字间以空格分 ...

  4. 黑马day16 jquery&层次选择器

    假设想通过DOM元素之间的层次关系来获取特定元素,比如后代元素,子元素,相邻元素,兄弟元素等,则须要使用层次选择器. 1 .ancestor descendant 使用方法: $("form ...

  5. js和循环依赖

    kmdjs和循环依赖 循环依赖是非常必要的,有的程序写着写着就循环依赖了,可以提取出一个对象来共同依赖解决循环依赖,但是有时会破坏程序的逻辑自封闭和高内聚.所以没解决好循环依赖的模块化库.框架.编译器 ...

  6. hdu2492 Ping pong

    hdu2492 Ping pong 题意:一群乒乓爱好者居住在一条直线上,如果两个人想打比赛需要一个裁判,裁判的 位置 必须在两者之间 ,裁判的能力也必须不大于 参赛者最大的,不小于参赛者最小的 白皮 ...

  7. 无限层级且乱序的树形结构数据的整理,利用HashMap降低遍历次数

    我们在展示一个机构树的时候,经常会遇到这种一个问题,查询数据的时候,是从下往上查的,但展示数据的时候,又要从下往上展示. 这时候就要把查询到的数据进行整理从而得到我们想要的结构. 举个样例. ID P ...

  8. 零积分下载,2014年辛星mysql教程秋季版第一本已经完工,期待您的支持

    经过一段时间的不懈努力.终于,2014年辛星mysql教程秋季版的第一本,即夯实基础已经完工,在csdn的下载地址为:去下载地址 ,假设左边地址跪了,能够去http://download.csdn.n ...

  9. 树——axure线框图部件库介绍

    终于到最后一个组件的介绍了!到这里基础的应用应该算完成了!  1. 拖动树组件,到页面编辑区域  2.添加节点,可以添加子节点也可以在该节点的前后添加平级节点  3. 编辑节点图标 做好上面的那一步, ...

  10. JavaScript编程:文档对象模型DOM

    5.文档对象模型DOM JS里的DOM和XML里的DOM不同,但是解析方式是一样的. document.getElementByID("id")根据ID获得元素节点. 创建和操作节 ...