现代前端开发小记

FruitHardCandy

2014-09-12

web开发分为前后，作为一个后端工程师，或者是前端小白，前端的开发可能会很头疼。
一路走来，坎坎坷坷，好在升级打怪还是会遗留一些经验的，记录下现代前端开发的经验。

黑暗时代的前端开发

在这个时代，前端开发的流程可能是这样的:UI前端框架最新力作！有奖试读！

.代码 
* 写各种html、css、js  
* 跑到各种前端模块网站上手动下载各种库  
* 一遍遍刷新浏览器，查看效果  
* 最终压缩各种静态文件  

问题

.代码 
* html代码重复，例如对于一个header和footer极有可能违反DRY,  
后期维护的时候绝对会是镇痛  
* 无法实时查看效果，需要手动刷新，就像某些蛋疼的java服务器，写个api不能自动加载  
需要手动重启，一个小时调不了几个bug(Life is too short,please use python).  
* 压缩这个事情很多人是不会去做的。  
* 代码的模块性很差，jquery确实灵活，不过时间长了之后代码就会杂草丛生，尤其是有  
别人接管你的代码的时候，极有可能看不懂，然后重构，这也就是为什么前端会出现各种  
MVC框架的原因  

UI前端框架最新力作！有奖试读！

现代前端开发

这个时代已经不是刀耕火种的年代了。

首先说说MVC

MVC在后端已经出现N多年了，前端现在也有出现，但是前端是不是要用MVC这种
东西是有待商榷的，个人的体会是，如果你的项目很小，只有你1～2个工程师
维护的时候，不需要用MVC框架，原因很简单，学习成本，时间是宝贵的，学习成本
绝对是硬伤，例如你选择Backbone Angular的时候，陡峭的学习曲线不仅仅会影响
你自己，以后新人在用你项目的时候也会经历这个痛苦。

MVC的优点，貌似这个就不用说了，一搜一大片。

我的实践

github上有很多优秀的开源项目，前端的工具也有很多，善用工具，善用优秀库

我brunch的一个脚手架项目 UI前端框架最新力作！有奖试读！

.代码 
check到不同分支使用，或者直接download release  
   
* 使用coffee写js，coffee会帮你避开js里面的各种血坑，使用类似python的语法  
* 使用html、css模板引擎，可以让你少写很多字母  
    html我选择的是jade， 可以使用include的语法，帮你减少DRY的可能性  
    css我选择stylus  
* 使用构建工具，我使用的是brunch，npm，bower  
    brunch解决黑暗时代一遍一遍手动刷新，以及自动引擎coffee，jade，编译  
    bower使得js、css库的安装方式变的异常简单  
    npm类似bower  
* bootstrap或者purecss(YUI)，个人倾向于使用purecss(IE7+)，IE6需要你自己手写css  
* 如果不用MVC，对js又不是很懂的话可以使用zarkfx,绝对节省你的开发时间,  
    zarkfx可以使用brunch + jade的 具体可以参考我simple项目的br-coffee-jade分支  
* 如果使用MVC，backbone + chaplin or angular选一个吧，注意MVC里面的限制，  
    例如使用MVC后他们有自己的驱动机制，对DOM操作都有限制，尤其是不能使用  
    zarkfx，这点非常讨厌  