前端开发者手册第三部分: 前端开发工具代码编辑
上一篇:HTTP/网络 下一篇:浏览器

代码编辑

了解代码编辑器

源代码编辑器是一个文本编辑程序, 专门为编辑计算机程序源代码的程序员而设计的, 它可能是一个独立的应用程序或内置在集成开发环境(IDE)或web浏览器中. 源代码编辑器是最基本的编程工具, ,作为程序员的基本工作就是编写和编辑源代码. - Wikipedia

前端代码可以被一个简单的文本编辑应用程序(如: Notepad 或 TextEdit), 但是, 大多数前端人员使用专门为一种编程语言而设计的代码编辑器编辑.

可以这么说, 代码编辑器有各种各样的类型和大小. 选择一个编辑器是主观行为。选择一个, 学习它的使用,然后继续学习 HTML, CSS 和 JavasCript DOM.

但是, 我一直相信, 编辑器应该有如下特点:

  • 一份不错的关于如何使用编辑器的文档
  • 报告 HTML, CSS 和 JavaScript 代码的质量
  • 为 HTML, CSS 和 JavaScript 提供语法高亮
  • 为 HTML, CSS 和 JavaScript 提供代码自动完成
  • 通过插件的方式自定义编辑器架构
  • 有大量的第三方仓库/插件社区, 能够用于自定义编辑器
  • 轻量, 简单, 不耦合代码(不需要编辑代码等等)

我个人推荐将下列的插件和 Sublime Text 一起使用:

  • Package Control
  • Auto​File​Name
  • Sublime​Linter
    • Sublime​Linter-json
    • Sublime​Linter-jshint
    • Sublime​Linter-html-tidy
  • Side​Bar​Enhancements
  • Terminal
  • Bracket​Highlighter
  • Color Highlighter
  • CSS3
  • HTMLAttributes
  • String​Encode
  • HTML-CSS-JS Prettify

Sublime 的学习资源:

  • Sublime Productivity [read][$]
  • Sublime Text Power User Book [read][$]
  • Sublime Text 3 From Scratch [watch][$]
  • Perfect Workflow in Sublime Text 2 [watch][requires login, but free]

如果你想用免费的软件替代 Sublime($70), 可以考虑 atom 或brackets

在线合作的代码编辑器:

  • jsbin.com [free to $]
  • jsfiddle.net
  • liveweave.com
  • es6fiddle.net
  • codepen.io [free to $]
  • Plunker

在线代码编辑器:

  • codeanywhere [free to $]
  • Koding [free to $]
  • Cloud9 [free to $]
上一篇:HTTP/网络 下一篇:浏览器