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
明日から始めるリファクタリング
ryounasso
0
130
NixOS + Kubernetesで構築する自宅サーバーのすべて
ichi_h3
0
640
ソフトウェア設計の実践的な考え方
masuda220
PRO
4
560
After go func(): Goroutines Through a Beginner’s Eye
97vaibhav
0
370
理論と実務のギャップを超える
eycjur
0
130
詳しくない分野でのVibe Codingで困ったことと学び/vibe-coding-in-unfamiliar-area
shibayu36
3
4.9k
非同期jobをtransaction内で 呼ぶなよ!絶対に呼ぶなよ!
alstrocrack
0
720
CSC509 Lecture 06
javiergs
PRO
0
260
Swift Concurrency - 状態監視の罠
objectiveaudio
2
510
10年もののAPIサーバーにおけるCI/CDの改善の奮闘
mbook
0
810
uniqueパッケージの内部実装を支えるweak pointerの話
magavel
0
980
Introducing ReActionView: A new ActionView-Compatible ERB Engine @ Kaigi on Rails 2025, Tokyo, Japan
marcoroth
3
1k
Featured
See All Featured
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
870
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.2k
Practical Orchestrator
shlominoach
190
11k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
Writing Fast Ruby
sferik
629
62k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.1k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.7k
Leading Effective Engineering Teams in the AI Era
addyosmani
1
270
Documentation Writing (for coders)
carmenintech
75
5k
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