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
Backbone.js in a real life application
Search
Sebastiano Armeli
December 14, 2011
Programming
1
120
Backbone.js in a real life application
Talk give at MelbJS, Melbourne - December 2011
Sebastiano Armeli
December 14, 2011
Tweet
Share
More Decks by Sebastiano Armeli
See All by Sebastiano Armeli
Cultivate Excellence In Engineering Teams through Continuous Software Engineering
sebarmeli
1
170
From Strategy Definition to Execution with OKRs and Roadmap
sebarmeli
0
160
From Mission to Strategy: going over OKRs and Roadmap
sebarmeli
0
280
Managing a software engineering team
sebarmeli
1
600
Enforcing coding standards in a JS project
sebarmeli
0
590
Enforcing Coding Standards
sebarmeli
1
120
ES6: The future is now
sebarmeli
2
480
EcmaScript 6 - the future is here
sebarmeli
5
7.3k
Dependency management and Package management in JavaScript
sebarmeli
0
740
Other Decks in Programming
See All in Programming
Goで実践するドメイン駆動開発 AIと歩み始めた新規プロダクト開発の現在地
imkaoru
4
870
バッチ処理を「状態の記録」から「事実の記録」へ
panda728
PRO
0
170
Go言語の特性を活かした公式MCP SDKの設計
hond0413
1
360
ソフトウェア設計の実践的な考え方
masuda220
PRO
4
620
(Extension DC 2025) Actor境界を越える技術
teamhimeh
1
270
はじめてのDSPy - 言語モデルを『プロンプト』ではなく『プログラミング』するための仕組み
masahiro_nishimi
3
770
Software Architecture
hschwentner
6
2.3k
CSC305 Lecture 09
javiergs
PRO
0
280
Google Opalで使える37のライブラリ
mickey_kubo
2
120
その面倒な作業、「Dart」にやらせませんか? Flutter開発者のための業務効率化
yordgenome03
1
140
AI Coding Meetup #3 - 導入セッション / ai-coding-meetup-3
izumin5210
0
3.4k
フロントエンド開発のためのブラウザ組み込みAI入門
masashi
6
3.2k
Featured
See All Featured
Keith and Marios Guide to Fast Websites
keithpitt
411
23k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.5k
Speed Design
sergeychernyshev
32
1.2k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
230
22k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
127
54k
jQuery: Nuts, Bolts and Bling
dougneiner
65
7.9k
How GitHub (no longer) Works
holman
315
140k
Producing Creativity
orderedlist
PRO
347
40k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.1k
The World Runs on Bad Software
bkeepers
PRO
72
11k
KATA
mclloyd
PRO
32
15k
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
Transcript
Backbone.js in a real-life application Sebastiano Armeli-Battana @sebarmeli https://github.com/sebarmeli December
14 , 2011 MelbJS, Melbourne Monday, 3 June 13
JavaScript MVC Framework Model - View - Collections Lightweight RESTful
JSON Interface Backbone.js Monday, 3 June 13
AJAX applications Desktop-like applications State vs Page Hash tag /
pushState Single Page Application Monday, 3 June 13
Online Purchasing System https://web01.archicentre.com.au/websales/nrma High Responsive Data-driven Approach Events-oriented Monday,
3 June 13
Source code structure /js application.js models views controllers routers helpers
lib live Monday, 3 June 13
Source code structure /js application.js models views controllers routers helpers
lib live $(function){ AC.app_router = new AC.Routers.AppRouter(); Backbone.history.start({root: location.pathname}); }) Monday, 3 June 13
Router STATE ACTION Monday, 3 June 13
Router / index() FormPostcodeView STATE ACTION Monday, 3 June 13
Router / index() /#/postcode/xxxx FormPostcodeView selectRooms() FormRoomsView STATE ACTION Monday,
3 June 13
Router / index() /#/postcode/xxxx FormPostcodeView selectRooms() FormRoomsView extrasDetails() FormExtrasView STATE
ACTION /#/postcode/xxxx/product/yyy/rooms/zzz Monday, 3 June 13
FormPostcodeView FormPostcodeView PostcodeView Monday, 3 June 13
FormPostcodeView FormPostcodeModel PostcodeModel Monday, 3 June 13
FormRoomsView FormRoomsView PriceView(s) Monday, 3 June 13
FormRoomsView FormRoomsModel ProductQuotesCollection ProductQuoteModel ProductQuoteModel ProductQuoteModel ProductQuoteModel ProductQuoteModel ProductQuoteModel Monday,
3 June 13
FormExtrasView FormExtrasView ParameterBView ParameterBView ParameterBView ParameterNView QuotePriceView Monday, 3 June
13
FormExtrasView FormExtrasModel ProductQuote Model Parameter Parameter Parameter Parameter Monday, 3
June 13
Models Backbone.Model Key-value pairs fetch() / save() RESTful JSON API
Validation Monday, 3 June 13
Collections Backbone.Collection models attribute fetch() / save() url attribute parse()
Monday, 3 June 13
Views Backbone.View el / model / events attributes initialize() /
render() HTML templating ICanHaz.js Monday, 3 June 13
Testing Jasmine-jquery SinonJS Monday, 3 June 13
http://documentcloud.github.com/backbone/ http://www.ibm.com/developerworks/web/library/wa-backbonejs/index.html Resources Monday, 3 June 13