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
Devvox Belgium - Agentic AI Patterns
kdubois
1
120
大規模アプリのDIフレームワーク刷新戦略 ~過去最大規模の並行開発を止めずにアプリ全体に導入するまで~
mot_techtalk
1
440
Serena MCPのすすめ
wadakatu
4
990
Cursorハンズオン実践!
eltociear
2
1k
オープンソースソフトウェアへの解像度🔬
utam0k
15
2.8k
技術的負債の正体を知って向き合う / Facing Technical Debt
irof
0
170
Web Components で実現する Hotwire とフロントエンドフレームワークの橋渡し / Bridging with Web Components
da1chi
3
2.3k
Web フロントエンドエンジニアに開かれる AI Agent プロダクト開発 - Vercel AI SDK を観察して AI Agent と仲良くなろう! #FEC余熱NIGHT
izumin5210
3
520
Goで実践するドメイン駆動開発 AIと歩み始めた新規プロダクト開発の現在地
imkaoru
4
830
はじめてのDSPy - 言語モデルを『プロンプト』ではなく『プログラミング』するための仕組み
masahiro_nishimi
0
180
なぜあの開発者はDevRelに伴走し続けるのか / Why Does That Developer Keep Running Alongside DevRel?
nrslib
3
400
All About Angular's New Signal Forms
manfredsteyer
PRO
0
140
Featured
See All Featured
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6.1k
Building Adaptive Systems
keathley
43
2.8k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
14k
Typedesign – Prime Four
hannesfritz
42
2.8k
The Straight Up "How To Draw Better" Workshop
denniskardys
238
140k
Six Lessons from altMBA
skipperchong
28
4k
Speed Design
sergeychernyshev
32
1.2k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.7k
Leading Effective Engineering Teams in the AI Era
addyosmani
3
370
Being A Developer After 40
akosma
91
590k
Rails Girls Zürich Keynote
gr2m
95
14k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
45
2.5k
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