Upgrade to Pro — share decks privately, control downloads, hide ads and more …

前端开发工具

keelii
August 07, 2012

 前端开发工具

编辑器

keelii

August 07, 2012
Tweet

More Decks by keelii

Other Decks in Technology

Transcript

  1. 前端开发工具系列
    ——编辑器篇
    12年4月25日星期三

    View Slide

  2. 前端开发工具真的很重要吗?
    12年4月25日星期三

    View Slide

  3. 前端开发工具真的很重要吗?
    12年4月25日星期三

    View Slide

  4. 这得从我们的工作环境说起...
    12年4月25日星期三

    View Slide

  5. 这得从我们的工作环境说起...
    var feDe ={
    editor:[‘vim’, ‘dreamweaver’, ‘notepad++’],
    design:[‘psd’,‘jpg’],
    rd:[‘doc’,’rp’],
    browser:[‘chrome’, ‘fx’, ‘opera’, ‘ieN’, ‘...’],
    virtualhost: {
    xp: feDe
    win7: feDe
    }

    12年4月25日星期三

    View Slide

  6. 这得从我们的工作环境说起...
    12年4月25日星期三

    View Slide

  7. 这得从我们的工作环境说起...
    ⼀一两个编辑器/IDE
    12年4月25日星期三

    View Slide

  8. 这得从我们的工作环境说起...
    ⼀一两个编辑器/IDE
    几张页面设计稿
    12年4月25日星期三

    View Slide

  9. 这得从我们的工作环境说起...
    ⼀一两个编辑器/IDE
    几张页面设计稿
    若干需求/交互文档
    12年4月25日星期三

    View Slide

  10. 这得从我们的工作环境说起...
    ⼀一两个编辑器/IDE
    几张页面设计稿
    若干需求/交互文档
    各种浏览器
    12年4月25日星期三

    View Slide

  11. 这得从我们的工作环境说起...
    ⼀一两个编辑器/IDE
    几张页面设计稿
    若干需求/交互文档
    各种浏览器
    虚拟机(勤快的工程师必备利器)
    ...
    12年4月25日星期三

    View Slide

  12. 这得从我们的工作环境说起...
    ⼀一两个编辑器/IDE
    几张页面设计稿
    若干需求/交互文档
    各种浏览器
    虚拟机(勤快的工程师必备利器)
    ...
    12年4月25日星期三

    View Slide

  13. 这得从我们的工作环境说起...
    ⼀一两个编辑器/IDE
    几张页面设计稿
    若干需求/交互文档
    各种浏览器
    虚拟机(勤快的工程师必备利器)
    ...
    2G 内存
    12年4月25日星期三

    View Slide






  14. ,









    ,







    ,













    12年4月25日星期三

    View Slide






  15. ,





    选择⼀一个好的编辑器,不仅能让工作轻松愉快还能学到很多知识




    ,







    ,













    12年4月25日星期三

    View Slide

  16. 正题
    ❖ 编辑器分类
    ❖ ⼀一些常见的编辑器
    ❖ 推荐的编辑器
    12年4月25日星期三

    View Slide

  17. 正题
    <1>
    ❖ 编辑器分类
    ❖ ⼀一些常见的编辑器
    ❖ 推荐的编辑器
    12年4月25日星期三

    View Slide

  18. 编辑器分类
    - 平台
    • Windows
    Dreamweaver\ Notepad++\ EditPlus\ emEditor\ UltraEditor\ E Text Editor\ gVIM
    • Linux
    Emacs\ gEdit\ Nano Editor\ VI(VIM)
    • Mac OS
    TextMate\ Coda\ Espresso\ Macvim
    12年4月25日星期三

    View Slide

  19. 编辑器分类
    - 平台
    • Windows
    Dreamweaver\ Notepad++\ EditPlus\ emEditor\ UltraEditor\ E Text Editor\ gVIM
    • Linux
    Emacs\ gEdit\ Nano Editor\ VI(VIM)
    • Mac OS
    TextMate\ Coda\ Espresso\ Macvim
    这货是IDE
    12年4月25日星期三

    View Slide

  20. 编辑器分类
    - 平台
    • Windows
    Dreamweaver\ Notepad++\ EditPlus\ emEditor\ UltraEditor\ E Text Editor\ gVIM
    • Linux
    Emacs\ gEdit\ Nano Editor\ VI(VIM)
    • Mac OS
    TextMate\ Coda\ Espresso\ Macvim
    这货是IDE
    ⼀一直在PK,从
    未分胜负
    12年4月25日星期三

    View Slide

  21. 编辑器分类
    - 平台
    • Windows
    Dreamweaver\ Notepad++\ EditPlus\ emEditor\ UltraEditor\ E Text Editor\ gVIM
    • Linux
    Emacs\ gEdit\ Nano Editor\ VI(VIM)
    • Mac OS
    TextMate\ Coda\ Espresso\ Macvim
    这货是IDE
    ⼀一直在PK,从
    未分胜负
    Mac上最经典的编辑器
    12年4月25日星期三

    View Slide

  22. 编辑器分类
    - 类型
    • 付费
    UltraEditor\ EditPlus\ Sublime text\ ...
    • 免费
    NotePad++\ TextWrangler\ gedit
    • 开源
    VIM\
    12年4月25日星期三

    View Slide

  23. 编辑器分类
    - 类型
    • 付费
    UltraEditor\ EditPlus\ Sublime text\ ...
    • 免费
    NotePad++\ TextWrangler\ gedit
    • 开源
    VIM\
    可以无限试用
    哦~亲!
    12年4月25日星期三

    View Slide

  24. 正题
    <2>
    ❖ 编辑器分类
    ❖ ⼀一些常见的编辑器
    ❖ 推荐的编辑器
    12年4月25日星期三

    View Slide

  25. 常见编辑器
    1. Notepad++
    A free source code editor which supports several programming languages running
    under the MS Windows environment.
    功能特色
    ✓软件绿色小巧
    ✓编码支持良好
    ✓插件可扩展 <新版的plugin manager很好用>
    ✓语法高亮、代码折叠、代码提示(自动完成)
    不足
    -界面⼀一般
    -主题太少
    12年4月25日星期三

    View Slide

  26. 常见编辑器
    2. Editplus
    EditPlus is a text editor, HTML editor, PHP editor, Java editor and Hex Viewer for
    Windows. While it can serve as a good Notepad replacement, it also offers many
    powerful features for Web page authors and programmers.
    功能特色
    ✓软件绿色小巧
    ✓编码支持良好
    ✓语法高亮、代码折叠、代码提示(自动完成)
    不足
    -扩展插件太少
    -自动完成功能比较弱
    12年4月25日星期三

    View Slide

  27. 常见编辑器
    3. E text editor
    The power of TextMate on Windows
    功能特色
    ✓强大的TextMate Bundels支持
    ✓编码支持良好
    ✓语法高亮、代码折叠、代码提示(自动完成)
    ✓界面友好、主题漂亮
    不足
    -太多模仿TextMate没有创新
    -安装的时候要切系统区域设置
    12年4月25日星期三

    View Slide

  28. 常见编辑器
    4. Sublime Text 2
    Sublime Text is a sophisticated text editor for code, html and prose. You'll love the
    slick user interface and extraordinary features.
    功能特色
    ✓强大的TextMate Bundels支持
    ✓语法高亮、代码折叠、代码提示(自动完成)
    ✓界面友好、主题库丰富
    ✓强大的Package Control (扩展包管理)
    ✓VI模式
    ✓特色功能:mini map\ 热退出
    ✓出色的功能细节:缩进方式提示、代码折叠、选中高亮、多选
    不足
    -无法自动识别中文字符如GB2312, GBK (可装插件解决)
    12年4月25日星期三

    View Slide

  29. 常见编辑器
    5. VIM
    Vim (全称Vi Improved)是从vi发展出来的⼀一个文本编辑器。代码补完、编译及
    错误跳转等方便编程的功能特别丰富,在程序员中被广泛使用。和Emacs并
    列成为类Unix系统用户最喜欢的编辑器。——from 维基百科
    功能特色
    ✓语法高亮、代码折叠、代码提示
    ✓成千上万的插件支持
    ✓速度快、大文件处理性能高
    ✓特色功能:太多了列不完 (稍后演示)
    不足
    -学习曲线是所有编辑里面里从开始到结束始终最高
    12年4月25日星期三

    View Slide

  30. 主流编辑器学习曲线
    Ref: http://coolshell.cn/articles/3125.html
    12年4月25日星期三

    View Slide

  31. 正题
    <3>
    ❖ 编辑器分类
    ❖ ⼀一些常见的编辑器
    ❖ 推荐的编辑器
    12年4月25日星期三

    View Slide

  32. 推荐编辑器
    • Sublime Text 2
    功能强大、界面美观、细节丰富
    • Notepad++
    小巧简单、功能实(够)用
    • VIM
    如果你有足够的耐心,vim是不二之选
    12年4月25日星期三

    View Slide

  33. 那么...
    12年4月25日星期三

    View Slide

  34. 那么...
    12年4月25日星期三

    View Slide

  35. Thx
    keelii
    引用:
    •《论语·卫灵公》
    •http://www.sublimetext.com/2
    •http://notepad-plus-plus.org/
    •http://www.editplus.com/
    •http://coolshell.cn/articles/3125.html
    12年4月25日星期三

    View Slide