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
150
From Strategy Definition to Execution with OKRs and Roadmap
sebarmeli
0
140
From Mission to Strategy: going over OKRs and Roadmap
sebarmeli
0
270
Managing a software engineering team
sebarmeli
1
590
Enforcing coding standards in a JS project
sebarmeli
0
580
Enforcing Coding Standards
sebarmeli
1
120
ES6: The future is now
sebarmeli
2
480
EcmaScript 6 - the future is here
sebarmeli
5
7.2k
Dependency management and Package management in JavaScript
sebarmeli
0
730
Other Decks in Programming
See All in Programming
Node-RED を(HTTP で)つなげる MCP サーバーを作ってみた
highu
0
120
Cursor AI Agentと伴走する アプリケーションの高速リプレイス
daisuketakeda
1
130
PHPでWebSocketサーバーを実装しよう2025
kubotak
0
250
AIプログラマーDevinは PHPerの夢を見るか?
shinyasaita
1
180
Benchmark
sysong
0
280
明示と暗黙 ー PHPとGoの インターフェイスの違いを知る
shimabox
2
390
Code as Context 〜 1にコードで 2にリンタ 34がなくて 5にルール? 〜
yodakeisuke
0
120
ソフトウェア品質を数字で捉える技術。事業成長を支えるシステム品質の マネジメント
takuya542
0
540
AIエージェントはこう育てる - GitHub Copilot Agentとチームの共進化サイクル
koboriakira
0
480
関数型まつりレポート for JuliaTokai #22
antimon2
0
160
『自分のデータだけ見せたい!』を叶える──Laravel × Casbin で複雑権限をスッキリ解きほぐす 25 分
akitotsukahara
1
600
Quand Symfony, ApiPlatform, OpenAI et LangChain s'allient pour exploiter vos PDF : de la théorie à la production…
ahmedbhs123
0
120
Featured
See All Featured
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
A designer walks into a library…
pauljervisheath
207
24k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.8k
A better future with KSS
kneath
239
17k
Intergalactic Javascript Robots from Outer Space
tanoku
271
27k
Visualization
eitanlees
146
16k
How to train your dragon (web standard)
notwaldorf
94
6.1k
Git: the NoSQL Database
bkeepers
PRO
430
65k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Building Applications with DynamoDB
mza
95
6.5k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.5k
Practical Orchestrator
shlominoach
188
11k
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