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
Large scale apps using tools in backbone.marion...
Search
Jakob Dam Jensen
November 13, 2013
Programming
2
400
Large scale apps using tools in backbone.marionette
Jakob Dam Jensen
November 13, 2013
Tweet
Share
Other Decks in Programming
See All in Programming
Google Agent Development Kit でLINE Botを作ってみた
ymd65536
2
250
たった 1 枚の PHP ファイルで実装する MCP サーバ / MCP Server with Vanilla PHP
okashoi
1
260
ペアプロ × 生成AI 現場での実践と課題について / generative-ai-in-pair-programming
codmoninc
1
18k
効率的な開発手段として VRTを活用する
ishkawa
0
140
技術同人誌をMCP Serverにしてみた
74th
1
650
「Cursor/Devin全社導入の理想と現実」のその後
saitoryc
0
820
The Modern View Layer Rails Deserves: A Vision For 2025 And Beyond @ RailsConf 2025, Philadelphia, PA
marcoroth
1
150
AI コーディングエージェントの時代へ:JetBrains が描く開発の未来
masaruhr
1
150
明示と暗黙 ー PHPとGoの インターフェイスの違いを知る
shimabox
2
510
AIと”コードの評価関数”を共有する / Share the "code evaluation function" with AI
euglena1215
1
170
Hypervel - A Coroutine Framework for Laravel Artisans
albertcht
1
130
スタートアップの急成長を支えるプラットフォームエンジニアリングと組織戦略
sutochin26
1
5.8k
Featured
See All Featured
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
How GitHub (no longer) Works
holman
314
140k
Embracing the Ebb and Flow
colly
86
4.7k
Speed Design
sergeychernyshev
32
1k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
6
300
Building Applications with DynamoDB
mza
95
6.5k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Scaling GitHub
holman
460
140k
Transcript
None
None
NOPOINTLESSAPPS
None
• Jakob Dam Jensen • Web since 97 - JS
was frightening • ASP, Servlets, PHP indtil 2007 • Since then a lot of mobile dev • But I’ve played with most client-side libs Who am I?
None
Backbone is great • Is small • Provides structure •
Simple and elegant • I can fix bugs in it if I need to
Backbone can be a bitch • Because large scale apps
are difficult to maintain • Can become a tightly coupled mess • Not Backbones fault • Software-engineering is hard
Large Backbone apps are hard to maintain…
None
None
None
None
None
None
None
Backbone Pain Points • Routing • Internal communication (App events)
• It being small means that we’re on our own • Collection views etc. • View cleanup • No controllers.. really
But Backbone should be seen as the foundation
=)
You can fix all of this
But why should you?
None
Marionette to the rescue • Different view types + regions
• App architecture and infrastructure • Message bus • Controllers
Different view types
• View • CollectionView • ItemView • Layout • CompositeView
Different view types
None
None
None
None
None
Layout
None
None
None
None
None
None
App architecture
App Sup-App Sup-App Sup-App Sup-App
Blink Dashboard Members Calendar Account management List Show New List
Edit Show New List Edit Show New List Edit Show New Edit Index Index Index Index
None
None
None
None
None
Keeping things loose
Blink (App) Dashboard Members Calendar Account management List Show New
List Edit Show New List Edit Show New List Edit Show New Edit Index Index Index Index
Message bus: Commands • Can set command handler • App.commands.setHandler
name, function • Can execute commands • App.execute ‘name’, [function_options]
• edit:calendar_events • index:calendar_events • list:calendar_events • new:calendar_events • show:calendar_events
Calendar New List Edit Show Index Message bus: Commands
None
App.execute(‘index:calendar_events’, {event: event})
None
None
None
Message bus: Req Res • Can set request handlers •
App.reqres.setHandler ‘name’, function • Can request objects • App.request ‘name’, [options]
None
None
Message bus: vent • Can observe vent event • App.vent.on
‘name’, callbackFunction • Can trigger vent event • App.vent.trigger ‘name’, [options]
Blink (App) Dashboard Members Calendar Account management List Show New
List Edit Show New List Edit Show New List Edit Show New Edit Index Index Index Index
• Main app in module acts as facade • Commands
set here • Routing set here Modules encapsulates responsibilities Calendar New List Edit Show Index
None
None
Blink (App) Dashboard Members Calendar Account management List Show New
List Edit Show New List Edit Show New List Edit Show New Edit Index Index Index Index
None
What now?
None
Questions?
Anybody looking for freelance developers? =)
Thanks