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
Modular UI with (Angular || Ember)
Search
Andy Appleton
January 15, 2014
Programming
0
100
Modular UI with (Angular || Ember)
A talk at the London Ember.js meetup
Andy Appleton
January 15, 2014
Tweet
Share
More Decks by Andy Appleton
See All by Andy Appleton
Done is better than perfect
appltn
0
480
Rage against the state machine
appltn
1
390
Building web apps with Express
appltn
4
460
The Modern JavaScript Application
appltn
5
530
Object Creation Pattern Performance
appltn
1
660
Introducing Mint Source
appltn
1
380
Other Decks in Programming
See All in Programming
SwiftUI Performance 不要なViewの再描画と更新を抑える
bigamitiongit
1
160
雑に思考を整理する技術と効能
konifar
57
26k
PHP8.3の機能を振り返る / Review of PHP 8.3 features
seike460
PRO
1
110
"config" ってなんだ? / What is "config"?
okashoi
0
220
SwiftUIで使いやすいToastの作り方 / How to build a Toast system which is easy to use in SwiftUI
lovee
3
100
Prepare for Jakarta EE 11 - Performance and Developer Productivity
ivargrimstad
0
490
受託開発でGitLab CI を活用していく
xiombatsg
1
270
コードレビューで学ぶ!Kotlinオブジェクト指向デザインパターン
akkie76
2
180
元気予報
suu_mire0726
0
860
1BRC--Nerd Sniping the Java Community
gunnarmorling
0
310
Rubyでたのしむクリエイティブコーディング/Enjoy Creative coding with Ruby
chobishiba
1
160
FigmaとPHPで作る1ミリたりとも表示崩れしない最強の帳票印刷ソリューション
ttskch
39
18k
Featured
See All Featured
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
9
8.3k
Faster Mobile Websites
deanohume
297
30k
Intergalactic Javascript Robots from Outer Space
tanoku
266
26k
Optimizing for Happiness
mojombo
370
69k
Done Done
chrislema
178
15k
Side Projects
sachag
451
41k
Robots, Beer and Maslow
schacon
PRO
155
7.9k
The Art of Programming - Codeland 2020
erikaheidi
41
12k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
501
140k
10 Git Anti Patterns You Should be Aware of
lemiorhan
646
57k
Optimising Largest Contentful Paint
csswizardry
7
2.3k
Why Our Code Smells
bkeepers
PRO
331
56k
Transcript
MODULAR UI WITH (ANGULAR || EMBER)
ANDY APPLETON @appltn
None
IN JANUARY 2013 WE HAD A PROBLEM
None
customer merchant partner
customer merchant partner
None
WE STARTED SEEING PATTERNS
None
None
None
DEVELOPERS ARE ALLERGIC TO DUPLICATION
<!-- my-page.html --> ! <gc-modal></gc-modal>
<!-- modal-template.html --> ! <a href="#">Show modal</a> <div class="modal-hidden">
<h1>Modal title</h1> <p>Modal content</p> </div>
<!-- my-page.html --> ! <gc-modal link-text="Add customer"> </gc-modal>
<!-- modal-template.html --> ! <a href="#">{{link-text}}</a> <div class="modal-hidden"> <h1>Modal
title</h1> <p>Modal content</p> </div>
<!-- my-page.html --> ! <gc-modal link-text="Add customer"> <h1>New Customer</h1> <form>
... </form> </gc-modal>
<!-- modal-template.html --> ! <a href="#">{{link-text}}</a> ! <div class="hidden-modal" ng-transclude></div>
ANGULAR ROCKS!
EMBER SUCKS!
QUESTIONS?
<!-- my-page.html --> ! {{#gc-modal title="Add customer"}} <h1>{{title}}</h1> <p>Dialog content</p>
{{/gc-modal}}
<!-- modal-template.html --> ! <a href="#">{{link-text}}</a> <div class="hidden-modal"> {{yield}}
</div>
NEXT PROBLEM
THOSE PESKY CUSTOMERS
customer merchant partner
None
SEPARATE APPS SHARED COMPONENTS
TO THE RESCUE
None
THE APP BECOMES A THIN(ish) LAYER OF GLUE CODE
None
None
None
/gocardless-ng
?