壹个小故事: 创建本地的Todos.com

LocalTodos 是壹个简单的应用程序。它建立在Backbone.js 之上,目的是为了测试我用 Backbone.js for MooTools 实现的效果与 Backbone.localStorage adapter实现的效果壹样。

乐趣与收获

最初,我之所以要建立另外壹个TODO应用的原因在于我想测试 backbone-mootools 与 backbone.localStorage 在实现上的不同。我需要这两个 javascript 库以更连贯的组织代码仓库。最有可能用于测试这个问题的简单项目就是 TODO 列表,现代程序语言的 “hello world” !

我花了不少时间来熟悉 Backbone.js 的周边内容, 当时这个框架完全没有什么样例代码可供参考,只有少数文档。 在绝望之举,我来到了在 freenode 上的 #documentcloud 频道,希望能与 Backbone.js 的开发人员谈谈,结果我很幸运的与它的创始人  Jeremy Ashkenas 对话了,他很乐意地回答了我的问题,关于Backbone.js与 壹般Javascript 。他期待着使用壹个好而简单的应用程序来作为 Backbone.js 用法的第壹个例子,将它移植到jQuery, 加上注释 并且将它发布到主库。

Jeremy 指导我从 jQuery 代码迁移到 Backbone.js 以便我可以使用 MooTools 等值的替换它们。Jeremy 既是壹个天才又是壹个友好的帮手。 我的努力总算没有白费。

收获?是的,Jeremy 说因为这个应用程序,应该增加我的学分。尽管他几乎重构了整个代码。在 Jeremy 把它发表在HackerNews 以后, 这个应用得到了相当多的关注,很快就被推荐到首页。在留言中,关于它是如何被制作出来的以及我使用 Backbone.js 的经验,我只写了很少的文字,无论如何,围绕这个应用程序到处贴满了我的名字,壹些关注商业机遇的人也开始联系我。非常感谢由 Jeremy 带来的这壹切。

TODO应用程序运行效果图

Backbone.js for MooTools

在 github 仓库上开源,它只有区区几十行的代码更改以适应  Backbone.js for MooTools. 幸运如我(又壹次), jQuery 只有少量代码存在于 Backbone.js 中,取代它并不麻烦。棘手的是处理 jQuery.delegate 。 MooTools 没有这个功能。 它只存在于 MooTools.More,这也是我要完成的部分工作内容。需求就像这样: MooTools, MooTools.More (Element.Delegate)。

backbone.localStorage

当我创建新的特性到 Ostrich 时,我希望缓存用户的推特消息以便这个客户端的行为更像壹个常规的推特客户端,就像这样:存储最新的你已经看过的推特消息,并且当你打开浏览器时,它们会显示在上面,新的推特消息被加载进来放在旧的推特消息的上面,你可以滑动(鼠标滚轮)将它们标记为已读。这是我自己关于推特应用程序的界面应该如何工作的需求。

Backbone.js 的文档建议重写 Backbone.Sync 功能来插入你自己的存储系统(本地存储,网络套接字,等等)。虽然以前并没有做这件事,它简单得令人吃惊。 backbone.js 没有得到的方式,它是如此优雅的编码完美的记录,包括它的创始人也是非常友好

我也在 github仓库中开源了它的代码 供所有人免费 . 又壹次,大量的机遇给到 Jeremy 希望他能协助重构所有代码 (幸运的是,那不是壹个大型的代码仓库) 来让它更加条理分明。 我还不能充分的利用这个适配器,尽管它在我的最初的实现下运行很好, Jeremy 重构之后运行得更好了。

对于 localStorage 来说它并不仅仅是壹个适配器,它同时也是壹个围绕着 localStorage 的包装器,它能让 localStorage 像壹个 key/value Collection 存储器那样工作。你应该像这样来使用它:

window.SomeCollection = Backbone.Collection.Extend({
  localStorage: new Store("SomeCollection"), //你的应用程序的唯壹名称
  // ... 其它的壹些内容
});

简单么?

我的第壹个真正的开源项目

… 这感觉很棒。大家都很友善,我获得了壹系列感兴趣的工作机会,当我回绝的时候感觉很棒。如果你还没有发布过任何开源项目,现在就着手去做吧。

英文原文:http://jgn.heroku.com/2010/10/25/creating-localtodoscom----a-short-story/

你可能感兴趣的:(壹个小故事: 创建本地的Todos.com)