个人前端开发工做流 - 环境篇

有人说过程序员和码农的本质区别就是程序员会不断探索提升生产力的方法。思惟模式的转变是提升生产力的最好方式，但打磨咱们的工具也是十分有意义的事，本文将从开发环境，自动化开发，开发工具等几个方面针对前端开发效率的提高和代码质量的提升来展开讨论。

每件事都是一个程序，开发也像程序同样，每一个步骤都是一段代码，当开发规模随着文档、代码、需求而增长时，重复的步骤变得愈来愈多。此时，若是能够像抽象代码同样抽象出一些相同操做就能够大大提高开发效率。所以，出现了更多更优质的工具来代替人工作一些不断重复的开发以减小程序员的工做量。

开发环境

Nodejs

首先，须要搭建一个自动化高效率的开发环境。之前咱们有shell、java、ruby来进行一些自动化脚本的执行。但自从Nodejs将Javascript带入了服务器，Front End开发环境也发生了翻天覆地的变化。Nodejs不只仅可让Jser开发服务端，还让Javascript成为了服务器脚本语言之一，能够用于文件的操做。

安装Nodejs的方法目前来讲很简单，点这里下载安装包，选择对应的平台的安装包便可。不过不得不说的是Source Code包，这是源码须要编译，虽然由C++写成，但gyp进行管理，因此编译时须要Python2.6+和C++编译器一块儿工做。经过命令 node -v 来检验是否安装成功，成功则返回当前版本号。

另外Nodejs还有同样必备的工具npm，就像ruby中的gem同样，是一个Nodejs的包管理器，能够为Nodejs添加一些包。npm的安装很是简单，能够说不用安装，在Linux下只有一行命令： make install , 而Windows和Mac都默认带有npm。固然若是想专门安装npm也是能够的，Linux下仍然是一行代码：

curl https://npmjs.org/install.sh | sudo sh

而Windows会稍微麻烦一点，在https://npmjs.org/dist/下载源码，而后放到和node.exe一个文件夹下便可。

使用npm来安装一些包很简单，使用这样的命令 npm install <package_name> ，通常来讲会默认安装在当前目录中。但若是使用参数 -g 就能够安装在全局。另外经过在项目中添加一个 package.json 文件，就能够定义项目依赖的Nodejs包，而后直接在该目录中执行 npm install 指令就会将package文件指定的包所有安装在当前目录。

Shell

不论是Linux仍是Mac都自然的拥有Shell环境，可是Windows中的CMD是没法和Shell相提并论的，并且不少开发工具也须要Shell环境。

还好Windows中有MSYS，全称是Minimal GNU（POSIX）system on Windows，它是一个GNU工具集，包括了bash，make，gawk和grep。能够直接下载

http://www.mingw.org/wiki/MSYS

若是须要整个Unix环境和C的库的话，还须要minGW。也能够直接安装Git Bash工具，会附带有这个，这样环境和Git就会一块儿装好。

http://git-scm.com/downloads

另外在Windows中使用Shell时，有几点须要注意。文件路径的根目录为Git Bash的文件根路径，可是可使用斜杠和盘符表明Windows的磁盘，好比进入D盘下的workspace文件夹就这样：

$ cd /d/workspace/

而Windows特有的文件夹名称中带有空格的问题能够经过两个方法解决。

$ mkdir /c/"work space"
$ rmdir /c/work\ space

用引号括起来带有空格的文件名或者使用反斜杠来转义空格。

Git

Git的安装很分散，每种平台都不同，Linux中也分为两种使用yum或者apt-get来安装：

// as Fedora
$ yum install git-core
// as Ubuntu
$ apt-get install git

Mac上是最简单的，在这里安装http://code.google.com/p/git-osx-installer

Windows也很方便，由于有了Msysgit，也同样直接安装。

编辑器

编辑器是每一个程序员最经常使用的工具，它在很大程度上决定了单纯Coding的效率。原来有人将Vim和Emacs奉为上古神器，不过我喜欢新的东西，SublimeText是目前编辑器中的新贵，拥有海量插件，使用Python编写，配置和操做都很是方便。能够到这里下载：

• SublimeText2

如今第3版正在进行beta测试，可是因为升级为Python3，原来的插件都由于API更新的问题而没法使用了，相信在正式版发布后插件将会陆续升级。这是第三版的下载地址，不会覆盖第二版。

• SublimeText3

此外，虽然它是付费软件，不过做者好像历来不怕没有人付费，若是没有注册仅仅会偶尔在保存时弹出Lisence声明，但确认会弹出官方页面，点取消便可。好像还有破解版本的出现，不过做者已经这么大度了，用破解版好像有点说不过去。国内曾经还有人组织过团购，可是做者表示不存在团购一说，只有公司批量购买，最终只有不了了之，售价$70。

浏览器

做为前端最基本的环境，浏览器是必不可少的。Chrome是我最喜欢的浏览器，由于它的快速高效以及很棒的开发者工具。虽然Firefox也是一款出色的浏览器，但Firebug做为一款插件，效率老是差那么一点，固然Firefox如今也推出了本身的调试工具。用于测试的IE浏览器也是常备工具之一，此外还有Opera和Safari。

Chrome和Firefox很强大的一个缘由就是，它们对W3C的标准都很快速的支持，许多最新的特性均可以体如今最新版的Chrome以及Firefox中。特别须要一说的是，它们都有一个每日更新的版本，用户能够体验到最新的功能，而浏览器厂商能够获取崩溃信息等反馈来提升品质。Chrome的每日更新版叫Chrome Canary,Firefox的比较直接，Firefox Nightly。

还有一款很神奇的浏览器，它不会渲染，也没有界面，基于Webkit内核，它叫PlantomJS，图标的幽灵和名字都突出了这一特色。也许看起来没什么用，但在测试或者作研究时，浏览器不厌其烦的弹出来时，它就有大用处了。

---

个人前端开发工做流 系列文章：

• 环境篇
• 自动化篇
• 工具篇
• 代码管理篇

原文博客http://www.tychio.net/tech/2013/09/25/improve-workflow.html