Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Why Backbone
Search
Up Chen
November 19, 2011
Programming
1
1.9k
Why Backbone
Why should we use backbone instead hard code by ourself.
Up Chen
November 19, 2011
Tweet
Share
More Decks by Up Chen
See All by Up Chen
工程師討生活工具介紹:做更快一點
wallat
9
1.1k
Other Decks in Programming
See All in Programming
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
manfredsteyer
PRO
0
140
React Native New Architecture 移行実践報告
taminif
1
150
tsgolintはいかにしてtypescript-goの非公開APIを呼び出しているのか
syumai
6
2.2k
ゲームの物理 剛体編
fadis
0
340
認証・認可の基本を学ぼう後編
kouyuume
0
190
堅牢なフロントエンドテスト基盤を構築するために行った取り組み
shogo4131
8
2.3k
TestingOsaka6_Ozono
o3
0
150
なあ兄弟、 余白の意味を考えてから UI実装してくれ!
ktcryomm
11
11k
How Software Deployment tools have changed in the past 20 years
geshan
0
29k
AIコーディングエージェント(Manus)
kondai24
0
180
令和最新版Android Studioで化石デバイス向けアプリを作る
arkw
0
400
Github Copilotのチャット履歴ビューワーを作りました~WPF、dotnet10もあるよ~ #clrh111
katsuyuzu
0
110
Featured
See All Featured
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
61k
A Modern Web Designer's Workflow
chriscoyier
698
190k
Designing for humans not robots
tammielis
254
26k
Java REST API Framework Comparison - PWX 2021
mraible
34
9k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.8k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
jQuery: Nuts, Bolts and Bling
dougneiner
65
8.2k
[SF Ruby Conf 2025] Rails X
palkan
0
510
Speed Design
sergeychernyshev
33
1.4k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.1k
Transcript
Why Backbone.js
Up
www.coolpics.com.tw
What can Backbone solve ?
None
None
None
None
None
None
None
None
• Light MVC for front-end for client side • Focus
on the structure • No UI widgets • Model, View, Collection, and Router.
Model is a thing trace = { stock: ‘台積電’, status:
‘not-added’ };
Bind events on Model for everything Remove Reset Change
Bind events on Model for everything Remove Reset Change Even
bind to the variable changes change:stock
Original
Original After
View represents a model status: ‘not-added’ status: ‘added’ status: ‘loading’
updates itself
How to update itself ? Bind to model’s variables !!
stock: ‘台積電’, status: ‘not-added’ change:status
Set and forget
stock: ‘宏達電’, status: ‘not-added’ traceList.set({stock:’台積電’});
stock: ‘台積電’, status: ‘loading’ stock: ‘宏達電’, status: ‘not-added’ ajax
stock: ‘宏達電’, status: ‘not-added’ stock: ‘台積電’, status: ‘loading’
stock: ‘台積電’, status: ‘loading’ stock: ‘台積電’, status: ‘added’ stock: ‘宏達電’,
status: ‘not-added’ ajax
stock: ‘台積電’, status: ‘loading’ stock: ‘台積電’, status: ‘added’ stock: ‘宏達電’,
status: ‘not-added’
stock: ‘宏達電’, status: ‘not-added’ traceList.set({stock:’台積電’});
Set and forget traceList.set({stock:’台積電’});
None
Side Benefits
None
None
None
None
So ...
None
Thank You
Recommend starting point Official Todo example http://bit.ly/trqhlV PeepCode Backbone.js basic
http://bit.ly/vCcSNw
www.coolpics.com.tw