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
Glimmer ✨ as a Gateway to Ember 🐹
Search
Robert Jackson
July 11, 2017
Programming
0
59
Glimmer ✨ as a Gateway to Ember 🐹
Talk presented at EmberCamp London.
Robert Jackson
July 11, 2017
Tweet
Share
More Decks by Robert Jackson
See All by Robert Jackson
😂 of TypeScript
rwjblue
0
340
Testing: The Modern Way
rwjblue
0
41
Testing: The Future... Today?
rwjblue
0
61
Rails Developer's Intro to Ember
rwjblue
1
180
Testing - The Next Frontier
rwjblue
1
67
A tale of two pods
rwjblue
3
830
Ember 2.0 - RFC Recap
rwjblue
6
670
Ember CLI Addons
rwjblue
7
800
RAILS + EMBER.JS + EMBER-CLI = ❤
rwjblue
10
1.8k
Other Decks in Programming
See All in Programming
AI駆動のマルチエージェントによる業務フロー自動化の設計と実践
h_okkah
0
230
なぜ「共通化」を考え、失敗を繰り返すのか
rinchoku
1
680
チームで開発し事業を加速するための"良い"設計の考え方 @ サポーターズCoLab 2025-07-08
agatan
1
470
Git Sync を超える!OSS で実現する CDK Pull 型デプロイ / Deploying CDK with PipeCD in Pull-style
tkikuc
4
350
Android 16KBページサイズ対応をはじめからていねいに
mine2424
0
440
AIエージェントはこう育てる - GitHub Copilot Agentとチームの共進化サイクル
koboriakira
0
760
PipeCDのプラグイン化で目指すところ
warashi
1
300
ふつうの技術スタックでアート作品を作ってみる
akira888
1
1.3k
The Evolution of Enterprise Java with Jakarta EE 11 and Beyond
ivargrimstad
0
260
TypeScriptでDXを上げろ! Hono編
yusukebe
3
770
[SRE NEXT] 複雑なシステムにおけるUser Journey SLOの導入
yakenji
0
150
ニーリーにおけるプロダクトエンジニア
nealle
0
950
Featured
See All Featured
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
Embracing the Ebb and Flow
colly
86
4.8k
The Cult of Friendly URLs
andyhume
79
6.5k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Producing Creativity
orderedlist
PRO
346
40k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.4k
Git: the NoSQL Database
bkeepers
PRO
430
65k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
830
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
It's Worth the Effort
3n
185
28k
Transcript
1 Glimmer as a Gateway to Ember
2 Open Source Addict Ember Core Team OUR MISSION Investment
generally results in acquiring
3
4
5
6
7
8 Thank You!!
9 Glimmer.js
10 Optimized for Happiness Service Worker Enabled Mobile First Glimmer.js
11 Glimmer.js
12 Glimmer.js
13 Glimmer.js <user-greeting class="greeting" @name="Ricardo" @greeting="Olá"> </user-greeting>
14 Glimmer.js import Component from '@glimmer/component'; export default class Contact
extends Component { }
15 Glimmer.js import Component from '@glimmer/component'; export default class Contact
extends Component { get name() { return `Doctor Who`; } }
16 Glimmer.js import Component from '@glimmer/component'; export default class Contact
extends Component { @tracked('args') get name() { return `${this.args.first} ${this.args.last}`; } }
17 Glimmer.js import Component from '@glimmer/component'; export default class Contact
extends Component { args: { first: string; last: string; }; @tracked('args') get name() { return `${this.args.first} ${this.args.last}`; } }
18 Glimmer.js ember new test-webapp -b @glimmer/blueprint cd test-webapp ember
install ember-service-worker ember install ember-service-worker-asset-cache ember install ember-service-worker-cache-fallback ember install ember-web-app ember serve -prod
19 Glimmer.js
20 Ember
21 Ember import Ember from 'ember'; export default Ember.Service.extend({ });
22 Ember Mature Pre-postmodern JS Common Stability
23 Ember import Service from '@ember/service'; export default class extend
Service { }
24 Ember // ...snip... test('it “just” works?!?!', function(assert) { class
TestService extends Ember.Service {} let owner = getOwner(this); owner.register('service:test', TestService); let instance =owner.lookup('service:test'); assert.ok(instance instanceof TestService); assert.ok(instance instanceof Ember.Service); });
25 Ember import Component from '@ember/component'; export default class extends
Component { }
26 Ember // ...snip... test('it renders', function(assert) { class XFoo
extends Ember.Component {} this.register('component:x-foo', XFoo); this.register('template:components/x-foo', hbs`hi!`); this.render(hbs`{{x-foo}}`); assert.equal(this.$().text().trim(), 'hi!'); });
27 Ember Actions Computed Properties Injections Element Modification
28 Ember
29 Ember import Component from '@ember/component'; import { computed }
from 'ember-decorators/object'; export default class extends Component { @computed('first', 'last') name(first, last) { return `${first} ${last}`; } }
30 Ember import Component from '@ember/component'; import { action }
from 'ember-decorators/object'; export default class extends Component { @action update() { // ...snip... } }
31 Ember import Component from '@ember/component'; import { service }
from 'ember-decorators/service; export default class extends Component { @service i18n }
32 Ember Glimmer Components
33