Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add ember-autofocus-modifier writeup #440

Merged
merged 4 commits into from
Dec 17, 2019
Merged

Add ember-autofocus-modifier writeup #440

Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
6ac53d5
Set up new issue
amyrlam Dec 14, 2019
ccb0fe7
Add ember-autofocus-modifier writeup
amyrlam Dec 17, 2019
89f1990
Merge branch 'blog/embertimes-129' into amy/embertimes-129
amyrlam Dec 17, 2019
099f202
Update source/2019-12-20-the-ember-times-issue-129.md
amyrlam Dec 17, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 13 additions & 0 deletions source/2019-12-20-the-ember-times-issue-129.md
View file
Open in desktop
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, Quonto 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)
amyrlam marked this conversation as resolved.
Show resolved Hide resolved

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