一直在路上 - junType

最近发现自己越来越不行了，做前端也有些岁月了，神马HTML5，CSS3等层出不穷，如果再不及时Update一下自己，很快也会被这个行业给淘汰了！废话不多说了，今天主要是记一下自己学习Backbone的笔记。
国内有用到这技术的有豆瓣说 阿尔法城 可能是他们比较出名。。。
前端MVC 主要讲的是在前端方面实现MVC的模板，在前端也有自己的模块，视图，控制器，这结合RESTful来做是个不错的选择，我在瘦服务端架构TSA(Thin Server Architecture)记录了一下
而Backbone只是通向前端MVC其中的一条路而已。。。
Backbone.js API中文文档
我下面的源码出自 让我们用Backbone.js来写一个HelloWorld程序 我也是通过这源码结合API进行学习 上面那篇博文有些错误，我已经修正。
这里说一下Backbone的执行顺序
路由（Backbone.Router）-> 模型（Backbone.Model）-> 视图（Backbone.View）

路由告诉你要去哪里。
App.Controllers.Routes = Backbone.Router.extend({ routes: { "!/hello" : "hello",//使用#!/hello驱动路由 这里会去分行下面hello这个函数 }, hello : function(){ //新建一个模型，模型向后端请求更新内容成功后根据模型渲染新页面 var helloModel = new App.Models.Hello; //调用模板 helloModel.fetch({ success: function(model){ //成功拿到数据，调用视图渲染页面 var helloView = new App.Views.Hello({model: model}); helloView.trigger('change'); //绑定change事件 } }); } });
模型告诉该干些什么。这里是去拿数据，set是提供一个设置初始数据
App.Models.Hello = Backbone.Model.extend({ url: function() { return '/index/test'; // 获得数据的后台地址。 }, initialize: function() { this.set({'message':'hello world'}); // 前端定义一个message字段，name字段由后端提供。 } });
最后你就知道了有什么了
App.Views.Hello = Backbone.View.extend({ el: "body", //在哪里显示 template: $("#hello-container-template").html(), //获取模板 模板是用Mustache initialize: function(options){ this.options = options; this.bind('change', this.render); this.model = this.options.model; }, render: function(){ // render方法，目标只有两个：填充this.el，返回this以便链式操作。 $(this.el).html(Mustache.to_html(this.template,this.model.toJSON())); return this; } });
上面就是MVC的核心了，下面就是一个管理着 视图/控制/模型 的全局类
var App = { Models: {}, Views: {}, Controllers: {}, Collections: {}, initialize: function() { new App.Controllers.Routes(); Backbone.history.start() // 要驱动所有的Backbone程序，Backbone.history.start()是必须的。 } };
调用，完事啦。。。
App.initialize();
其实我只知道了这么点皮毛，接下来就要在实践中多去学习了，期待有后续。。。
给自己加个油，提个醒！
PS 接下来，我将试着在 doulaipk.com 去实践，求PHP程序猿...