$30 off During Our Annual Pro Sale. View Details »
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
エディターってAIで操作できるんだぜ
kis9a
0
310
最新のDirectX12で使えるレイトレ周りの機能追加について
projectasura
0
320
connect-python: convenient protobuf RPC for Python
anuraaga
0
320
関数の挙動書き換える
takatofukui
4
760
jakarta-security-jjug-ccc-2025-fall
tnagao7
0
100
Duke on CRaC with Jakarta EE
ivargrimstad
0
350
MAP, Jigsaw, Code Golf 振り返り会 by 関東Kaggler会|Jigsaw 15th Solution
hasibirok0
0
170
仕様がそのままテストになる!Javaで始める振る舞い駆動開発
ohmori_yusuke
8
4.7k
Atomics APIを知る / Understanding Atomics API
ssssota
1
230
非同期処理の迷宮を抜ける: 初学者がつまづく構造的な原因
pd1xx
1
310
JEP 496 と JEP 497 から学ぶ耐量子計算機暗号入門 / Learning Post-Quantum Crypto Basics from JEP 496 & 497
mackey0225
2
510
イベントストーミングのはじめかた / Getting Started with Event Storming
nrslib
1
770
Featured
See All Featured
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
34
2.3k
Speed Design
sergeychernyshev
33
1.3k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.3k
The Illustrated Children's Guide to Kubernetes
chrisshort
51
51k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
253
22k
The Pragmatic Product Professional
lauravandoore
36
7k
Designing for humans not robots
tammielis
254
26k
How to train your dragon (web standard)
notwaldorf
97
6.4k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.2k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
Documentation Writing (for coders)
carmenintech
76
5.2k
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
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