The Ember Times - Issue No. 94

Bonghjornu Emberistas! 🐹

This week: calling nested components in Angle Brackets Invocation Syntax πŸ”, 2 RFCs for improving Ember Data πŸ’¬, an exclusive interview with Ember contributor @danielleadams πŸŽ™, user impersonation with Ember Simple Auth πŸ‘€, check out code splitting on routes πŸ––, a brand-new blog post about @action, {{on}} & {{fn}} πŸš€, and last, but not least, EmberCamp videos are live! 🍿


Nested Components in Angle Brackets: A First Look πŸ”

Starting Ember 3.10 (currently in beta), we can call nested components in angle brackets! πŸŽ‰πŸŽ‰πŸŽ‰ Recall, we want to use angle brackets to add clarity to code.

EmberMap gave us a first look at the new syntax and how to incrementally migrate our templates. For example, the template,

1
2
3
4
5
6
7
{{#ui-grid columns='md:2 lg:3' gutters='md:3' as |grid|}}
  {{#each sortedEpisodes as |episode|}}
    {{#grid.column}}
      {{podcast/components/podcast-card episode=episode}}
    {{/grid.column}}
  {{/each}}
{{/ui-grid}}

would become,

1
2
3
4
5
6
7
<Grid @columns='md:2 lg:3' @gutters='md:3' as |grid|>
  {{#each sortedEpisodes as |episode|}}
    <grid.Column>
      <Podcast::Components::PodcastCard @episode={{episode}} />
    </grid.Column>
  {{/each}}
</Grid>

The best news? You don't have to wait till your app is at 3.10. Thanks to @rwjblue, you can use a polyfill to get the full feature set of angle brackets today! πŸ˜ƒ

Learn more about angle bracket components from EmberMap.


Record Data RFC: Record State πŸ’¬

In RFC #463, @igorT asks for your help with improving the Record Data interface in Ember Data.

What is Record Data? Introduced in Ember 3.5, Record Data was designed to...

  • Help addons extend Ember Data without relying on private APIs
  • Help apps manage relationships, dirty attributes, rollbacks, and specialized models via these addons

In the RFC, @igorT proposes that we add methods that return the created and deleted states of a record. These methods would be consumed by the addons to make correct decisions.

If you'd like to learn more, please take a look at RFC #463. Please also leave your feedback! ✍️


Ember Data RFC: Request State Service πŸ’¬

On a related note, @igorT proposes in RFC #466 that we create a Request State service, which returns the in-flight and completed states of a request. The service would, not only simplify how we determine the state of a request, but also help us work with data from multiple sources.

You can read more about the proposal in RFC #466. As always, feedback is welcome! πŸ™‚


"I contribute to Ember" with Danielle Adams πŸŽ™

Danielle Adams

In our 10th edition of the contributor interview series, community member Danielle Adams, also known as @danielleadams, talks about her work as a mentor, conference MC and public speaker and shares tips to be present and confident when presenting your ideas. ✨

You can read the full interview on the Ember Forum.

Read more


User Impersonation in SaaS with Ember.js and Ruby on Rails πŸ‘€

When developing SaaS (software as a service) applications, it is important to be able to log in as one of your users and see exactly what they see. This can help with debugging issues and aid your support team in assisting users.

@matixmatix has created an awesome tutorial on how this can be done using Ember.js (with Ember Simple Auth) and Ruby on Rails (with Doorkeeper gem for OAuth2).

Achieving this is a fairly simple process. Normally, a client exchanges their username and password for an access token. To impersonate that user, we would need to create the token without the user's password. We can ask DoorKeeper to issue a new token for the provided user directly. Lastly, we update our existing OAuth2 authorizer so that we can pass the token (instead of a password) to log in as that user.

Read @matixmatix's full tutorial to get started!


Code Splitting on Routes πŸ––

In Embroider, an experimental build system for EmberJS, @ef4 added the splitAtRoutes option along with the @embroider/router package to enable per route code splitting. Ember applications can start testing route code splitting by just sticking to community conventions.

Try out Embroider today!


@action, on & fn blog post πŸš€

If you haven't been following the discussion on @action, {{on}}, and {{fn}}, this is the blog post for you!

@pzuraq continues his wonderful series of blog posts with a new one that focuses on the evolution of @action, {{on}}, and {{fn}} in detail.

The post covers some of the rationales for changing the use of {{action}} and how the use of the @action decorator will differ, including consideration of what the responsibilities of actions are and treatment of how decorators can help improve binding context.

You also won't want to miss coverage of the {{on}} modifier that replaces event handling responsibilities of {{action}} and the {{fn}} partial application helper, both of which have RFC's that have moved into Final Comment Period (FCP).

For more details, check out the full blog post here.


EmberCamp Videos are Live! 🍿

Looking for some more Ember content to watch? The first batch of EmberCamp 2018 videos are now available!

We especially enjoyed @toranb's talk Fast Feedback, Forward Progress where he talks about ways to work smarter, not harder as developers. He shares ways to choose productivity with a few stories in Ember.

  • Test driven development: Choose a feedback loop designed for experimentation and learning
  • Hot reloading: Choose a feedback loop designed with layout in mind
  • User experience: Choose a feedback loop your customers will love

Stay tuned for future announcements by following @embercamp on Twitter. And save the date, EmberCamp Chicago 2019 will be on August 23rd.


Contributors' Corner πŸ‘

This week we'd like to thank @nlfurniss, @kellyselden, @xg-wang, @Turbo87, @jaredgalanis, @rwjblue, @raido, @locks, @pete-the-pete, @dcyriller, @CvX, @rwwagner90, @amyrlam, @ef4 and @chiragpat for their contributions to Ember and related repositories! πŸ’–


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

Office Hours Tomster Mascot

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,

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