Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
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
2分台で1500examples完走!爆速CIを支える環境構築術 - Kaigi on Rails 2025
falcon8823
3
3.3k
WebエンジニアがSwiftをブラウザで動かすプレイグラウンドを作ってみた
ohmori_yusuke
0
170
Back to the Future: Let me tell you about the ACP protocol
terhechte
0
130
Web技術を最大限活用してRAW画像を現像する / Developing RAW Images on the Web
ssssota
2
1.2k
CI_CD「健康診断」のススメ。現場でのボトルネック特定から、健康診断を通じた組織的な改善手法
teamlab
PRO
0
180
Le côté obscur des IA génératives
pascallemerrer
0
130
CSC509 Lecture 01
javiergs
PRO
1
430
アメ車でサンノゼを走ってきたよ!
s_shimotori
0
160
CSC509 Lecture 05
javiergs
PRO
0
300
CSC305 Lecture 01
javiergs
PRO
1
400
どの様にAIエージェントと 協業すべきだったのか?
takefumiyoshii
2
610
タスクの特性や不確実性に応じた最適な作業スタイルの選択(ペアプロ・モブプロ・ソロプロ)と実践 / Optimal Work Style Selection: Pair, Mob, or Solo Programming.
honyanya
3
140
Featured
See All Featured
A designer walks into a library…
pauljervisheath
209
24k
Done Done
chrislema
185
16k
The Power of CSS Pseudo Elements
geoffreycrofte
79
6k
The Invisible Side of Design
smashingmag
301
51k
Making Projects Easy
brettharned
119
6.4k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.7k
Become a Pro
speakerdeck
PRO
29
5.5k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
51k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
Site-Speed That Sticks
csswizardry
11
880
How to Ace a Technical Interview
jacobian
280
24k
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