Skip to content

Commit

Permalink
Merge pull request #440 from ember-learn/amy/embertimes-129
Browse files Browse the repository at this point in the history
Add ember-autofocus-modifier writeup
  • Loading branch information
amyrlam authored Dec 17, 2019
2 parents d621bf5 + 099f202 commit 61928c6
Showing 1 changed file with 13 additions and 0 deletions.
13 changes: 13 additions & 0 deletions source/2019-12-20-the-ember-times-issue-129.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,9 @@ responsive: true
<SAYING-HELLO-IN-YOUR-FAVORITE-LANGUAGE> Emberistas! 🐹

<SOME-INTRO-HERE-TO-KEEP-THEM-SUBSCRIBERS-READING>
...
new ember-autofocus-modifier 💡,
...

READMORE

Expand All @@ -24,6 +27,16 @@ READMORE

---

## [New ember-autofocus-modifier 💡](https://medium.com/qonto-engineering/autofocus-modifier-improving-our-component-apis-fd589b98f4e)

While building an autofocus feature for their components, Qonto engineers were also able to improve their APIs. [Cyrille David (@dcyriller)](https://github.com/dcyriller) and team wanted to add autofocus to several components across two apps. For example, both their one-time-password input and their email input component needed autofocus. Since mixins are no longer recommended in the Ember ecosystem, Cyrille went with modifiers. [And they blogged about their experience here!](https://medium.com/qonto-engineering/autofocus-modifier-improving-our-component-apis-fd589b98f4e)

Modifiers are a new feature in the upcoming Ember Octane edition for **sharing code between components**, similar to directives in Vue or Angular. We revisited [Chris Garrett (@pzuraq)](https://github.com/pzuraq)'s blog [Coming Soon in Ember Octane - Part 4: Modifiers](https://blog.emberjs.com/2019/03/06/coming-soon-in-ember-octane-part-4.html) and the [Octane Guides preview docs: Out-of-Component-Modifications](https://octane-guides-preview.emberjs.com/release/components/template-lifecycle-dom-and-modifiers/#toc_out-of-component-modifications) to learn more!

Qonto wrapped up the code in a small addon, [`ember-autofocus-modifier`](https://github.com/qonto/ember-autofocus-modifier). You can use the code as-is, or copy the [snippet code](https://github.com/qonto/ember-autofocus-modifier/blob/v0.0.1/addon/modifiers/autofocus.js) and experiment with creating your own modifier.

---

## [Section Title in Title Case 🐹](#section-url)

<change section title emoji>
Expand Down

0 comments on commit 61928c6

Please sign in to comment.