loading...

The Ember Times - Issue No. 119

embertimes profile image The Ember Times Originally published at blog.emberjs.com ・5 min read

The Ember Times (37 Part Series)

1) The Ember Times - Issue No. 114 2) The Ember Times - Issue No. 115 3 ... 35 3) The Ember Times - Issue No. 116 4) The Ember Times - Issue No. 117 5) The Ember Times - Issue No. 118 6) The Ember Times - Issue No. 119 7) The Ember Times - Issue No. 120 8) The Ember Times - Issue No. 123 9) The Ember Times - Issue No. 124 10) The Ember Times - Issue No. 125 11) The Ember Times - Issue No. 126 12) The Ember Times - Issue No. 127 13) The Ember Times - Issue No. 128 14) The Ember Times - Issue No. 129 15) The Ember Times - Issue No. 130 16) The Ember Times - Issue No. 131 17) The Ember Times - Issue No. 132 18) The Ember Times - Issue No. 133 19) The Ember Times - Issue No. 134 20) The Ember Times - Issue No. 135 21) The Ember Times - Issue No. 136 22) The Ember Times - Issue No. 137 23) The Ember Times - Issue No. 138 24) The Ember Times - Issue No. 139 25) The Ember Times - Issue No. 140 26) The Ember Times - Issue No. 141 27) The Ember Times - Issue No. 142 28) The Ember Times - Issue No. 143 29) The Ember Times - Issue No. 144 30) The Ember Times - Issue No. 145 31) The Ember Times - Issue No. 146 32) The Ember Times - Issue No. 147 33) The Ember Times - Issue No. 148 34) The Ember Times - Issue No. 149 35) The Ember Times - Issue No. 150 36) The Ember Times - Issue No. 152 37) The Ember Times - Issue No. 153

✌️ Emberistas! 🐹

Read the blog post on handling Promises and UI states with Ember.js πŸ”„, learn how Ember has helped Intercom evolve since 2014 πŸ“–, a mutable future with Ember Octane 🐹🏎, and Ember and GraphQL: a quick example πŸ“Ή.


Promises and UI States in Ember.js πŸ”„

Sabin Hertanu @herzzanu wrote a blog post on handling promises and UI states with Ember. Examples of this range from providing loading states when sending a post request to enabling complicated behaviour such as a backoff period before being able to interact with the UI again.

The idea was to write promise-based operations as generator functions using the provided ember-concurrency APIs.

Read the full blog post for more details!


Ember and GraphQL: A Quick Example πŸ“Ή

Watch an introduction to using GraphQL with Ember.js in Rocky Neurock @jneurock's new video! The YouTube video ⚑️quickly ⚑️ demonstrates how to get up and running with Ember.js, GraphQL, Apollo and EmberCLI Mirage.

If you've been interested in learning how to set up an application with GraphQL and Ember.js, or are just looking to learn a little more about GraphQL and Apollo and the relevant syntax, this video is a super nice resource. Plus, you get to see how EmberCLI Mirage can handle GraphQL queries! ✨

You can watch the video in full here.


The Evolution of Ember.js at Intercom πŸ“–

At JSDayIE 2019, Gavin Joyce (@GavinJoyce) presented a talk on how the adoption of Ember has helped Intercom grow over the years since 2014.

In particular, Gavin attributed these four keys to success:

  • Shared core values with Ember
  • Ability to empower new devs to ship soon meaningful features
  • Confidence in upgrades thanks to Ember's stability without stagnation
  • Ember's commitment to continuous improvement (case study in rendering engine)

He closed the talk by giving a preview of Ember Octane's native JS approach: "I don't know what you would remove from that. [...] Everything has a purpose, and it's beautifully minimal and clean." πŸ’™

Please have a look at Gavin's talk and share!


A Mutable, Octane Powered Future 🐹🏎

A handy helper has existed in the framework's API since the early days of Ember 1.13. It allows to specify that a certain value - which was passed down by a parent component or controller - may be mutated by a child component. This is the so-called {{mut}} helper.

Most Ember developers are familiar with the usage of {{mut}} from scenarios as the following one:

<!-- app/templates/components/my-component.hbs -->
<input
  value={{@passedDownValue}}
  oninput={{action (mut @passedDownValue) value="target.value"}}
/>

In combination with the {{action}} helper, {{mut}} allows developers to create a useful, implicit and template-only shorthand for a setter function, that otherwise would require an explicit definition in the component class itself:

// app/components/my-component.js
import Component from '@ember/component';

export default Component.extend({
  actions: {
    updateValue(newValue) {
      this.set('passedDownValue', newValue);
    },
  },
});
<!-- app/templates/components/my-component.hbs -->
<input
  value={{@passedDownValue}}
  oninput={{action "updateValue" value="target.value"}}
/>

With Ember Octane coming soon and the new Glimmer Component API enforcing unidirectional data flow, many developers might wonder how the {{mut}} helper still fits into the overall picture. Are there any issues with using {{mut}} in future Octane apps? And are there still plans to deprecate the helper or 2-way-binding APIs from the framework in general?

You will find answers to all of these questions in an excellent deep-dive into mut and 2-way-bindings by Chris Garrett (@pzuraq). This blog post will clarify which data-binding framework APIs will remain for the foreseeable future (including Ember Octane) and which questions are still open in regards to 2-way binding components commonly used in Ember apps today.

Be sure to check out the article, share it with your colleagues and Ember friends and join the discussion on the Ember Discord!


Contributors' Corner πŸ‘

This week we'd like to thank @jacojoubert, @mansona, @ghislaineguerin, @pzuraq, @Frozenfire92, @Alonski, @igorT, @Gaurav0, @richard-viney, @tomdale, @dcyriller, @HeroicEric, @Panman8201, @rwjblue and @wongpeiyi for their contributions to Ember and related repositories! πŸ’–


Alt Text

Got a Question? Ask Readers' Questions! πŸ€“

Wondering about something related to Ember, Ember Data, Glimmer, or addons in the Ember ecosystem, but don't know where to ask? Readers’ Questions are just for you!

Submit your own short and sweet question under bit.ly/ask-ember-core. And don’t worry, there are no silly questions, we appreciate them all - promise! 🀞



#embertimes πŸ“°

Want to write for the Ember Times? Have a suggestion for next week's issue? Join us at #support-ember-times on the Ember Community Discord or ping us @embertimes on Twitter.

Keep on top of what's been going on in Emberland this week by subscribing to our e-mail newsletter! You can also find our posts on the Ember blog.


That's another wrap! ✨

Be kind,

Chris Ng, Isaac Lee, Jessica Jordan, Jared Galanis, Amy Lam and the Learning Team

The Ember Times (37 Part Series)

1) The Ember Times - Issue No. 114 2) The Ember Times - Issue No. 115 3 ... 35 3) The Ember Times - Issue No. 116 4) The Ember Times - Issue No. 117 5) The Ember Times - Issue No. 118 6) The Ember Times - Issue No. 119 7) The Ember Times - Issue No. 120 8) The Ember Times - Issue No. 123 9) The Ember Times - Issue No. 124 10) The Ember Times - Issue No. 125 11) The Ember Times - Issue No. 126 12) The Ember Times - Issue No. 127 13) The Ember Times - Issue No. 128 14) The Ember Times - Issue No. 129 15) The Ember Times - Issue No. 130 16) The Ember Times - Issue No. 131 17) The Ember Times - Issue No. 132 18) The Ember Times - Issue No. 133 19) The Ember Times - Issue No. 134 20) The Ember Times - Issue No. 135 21) The Ember Times - Issue No. 136 22) The Ember Times - Issue No. 137 23) The Ember Times - Issue No. 138 24) The Ember Times - Issue No. 139 25) The Ember Times - Issue No. 140 26) The Ember Times - Issue No. 141 27) The Ember Times - Issue No. 142 28) The Ember Times - Issue No. 143 29) The Ember Times - Issue No. 144 30) The Ember Times - Issue No. 145 31) The Ember Times - Issue No. 146 32) The Ember Times - Issue No. 147 33) The Ember Times - Issue No. 148 34) The Ember Times - Issue No. 149 35) The Ember Times - Issue No. 150 36) The Ember Times - Issue No. 152 37) The Ember Times - Issue No. 153

Posted on by:

embertimes profile

The Ember Times

@embertimes

Updates from the #ember Learning Team and friends 🐹

Discussion

markdown guide