From 206f3e0c995c9f6aed10eb4458b0e04a27febf50 Mon Sep 17 00:00:00 2001 From: Amy Lam Date: Sat, 11 Jul 2020 13:54:00 -0700 Subject: [PATCH 1/6] Set up new issue --- .../2020-07-10-the-ember-times-issue-155.md | 2 +- .../2020-07-17-the-ember-times-issue-156.md | 142 ++++++++++++++++++ 2 files changed, 143 insertions(+), 1 deletion(-) create mode 100644 source/2020-07-17-the-ember-times-issue-156.md diff --git a/source/2020-07-10-the-ember-times-issue-155.md b/source/2020-07-10-the-ember-times-issue-155.md index 379e1b1ce..02a302e44 100644 --- a/source/2020-07-10-the-ember-times-issue-155.md +++ b/source/2020-07-10-the-ember-times-issue-155.md @@ -1,7 +1,7 @@ --- title: The Ember Times - Issue No. 155 author: Chris Ng, Jared Galanis, Isaac Lee, Amy Lam -tags: Recent Posts, Newsletter, Ember.js Times, Ember Times, 2020 +tags: Newsletter, Ember.js Times, Ember Times, 2020 alias : "blog/2020/07/10-the-ember-times-issue-155.html" responsive: true --- diff --git a/source/2020-07-17-the-ember-times-issue-156.md b/source/2020-07-17-the-ember-times-issue-156.md new file mode 100644 index 000000000..17813e2cc --- /dev/null +++ b/source/2020-07-17-the-ember-times-issue-156.md @@ -0,0 +1,142 @@ +--- +title: The Ember Times - Issue No. 156 +author: the crowd +tags: Recent Posts, Newsletter, Ember.js Times, Ember Times, 2020 +alias : "blog/2020/07/17-the-ember-times-issue-156.html" +responsive: true +--- + + Emberistas! 🐹 + + + +READMORE + +--- + +## [Section title in sentence case 🐹](section-url) + + + + + + + + +--- + +## [Section title in sentence case 🐹](section-url) + + + + + + + + +--- + +## [Section title in sentence case 🐹](section-url) + + + + + + + + +--- + +## [Section title in sentence case 🐹](section-url) + + + + + + + + +--- + +## [Section title in sentence case 🐹](section-url) + + + + + + + + +--- + +## [Section title in sentence case 🐹](section-url) + + + + + + + + +--- + +## [Section title in sentence case 🐹](section-url) + + + + + + + + +--- + +## [Section title in sentence case 🐹](section-url) + + + + + + + + +--- + +## [Section title in sentence case 🐹](section-url) + + + + + + + + +--- + +## [Contributors' corner πŸ‘](https://guides.emberjs.com/release/contributing/repositories/) + +

This week we'd like to thank our siblings for their contributions to Ember and related repositories! πŸ’–

+ +--- + +## [Connect with us! πŸ€“](https://docs.google.com/forms/d/e/1FAIpQLScqu7Lw_9cIkRtAiXKitgkAo4xX_pV1pdCfMJgIr6Py1V-9Og/viewform) + +
+ 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! 🀞

+ +

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, + +the crowd and the Learning Team From b821ab0e4b64e274a97f982d9a2480bbf0e92748 Mon Sep 17 00:00:00 2001 From: Chris Ng Date: Fri, 17 Jul 2020 15:10:01 -0400 Subject: [PATCH 2/6] blog(embertimes156): econn with typescript blog (#712) * Make markdown display as italic * Typical markdown syntax does not work in this repo, see https://github.com/ember-learn/ember-blog/issues/568 for more info. * Also, fixed markdownlint and alex lint errors * Set up new issue * blog(embertimes156): econn with typescript blog * Update source/2020-07-17-the-ember-times-issue-156.md Co-authored-by: abhilashlr * Update source/2020-07-17-the-ember-times-issue-156.md Co-authored-by: Isaac Lee <16869656+ijlee2@users.noreply.github.com> * Update source/2020-07-17-the-ember-times-issue-156.md Co-authored-by: Isaac Lee <16869656+ijlee2@users.noreply.github.com> Co-authored-by: Amy Lam Co-authored-by: abhilashlr Co-authored-by: Isaac Lee <16869656+ijlee2@users.noreply.github.com> --- .../2020-07-17-the-ember-times-issue-156.md | 33 ++++++++++++++----- 1 file changed, 25 insertions(+), 8 deletions(-) diff --git a/source/2020-07-17-the-ember-times-issue-156.md b/source/2020-07-17-the-ember-times-issue-156.md index 17813e2cc..bbf898bc5 100644 --- a/source/2020-07-17-the-ember-times-issue-156.md +++ b/source/2020-07-17-the-ember-times-issue-156.md @@ -1,6 +1,6 @@ --- title: The Ember Times - Issue No. 156 -author: the crowd +author: Chris Ng, the crowd tags: Recent Posts, Newsletter, Ember.js Times, Ember Times, 2020 alias : "blog/2020/07/17-the-ember-times-issue-156.html" responsive: true @@ -9,6 +9,7 @@ responsive: true Emberistas! 🐹 +Read the blog post on using ember-concurrency with TypeScript 🀝, READMORE @@ -91,14 +92,30 @@ READMORE --- -## [Section title in sentence case 🐹](section-url) +## [Using ember-concurrency with TypeScript 🀝](https://jamescdavis.com/using-ember-concurrency-with-typescript/) - - - +[James C. Davis (@jamescdavis)](https://github.com/jamescdavis) wrote a blog post summarizing how to use [TypeScript](https://github.com/microsoft/TypeScript) with [ember-concurrency](https://github.com/machty/ember-concurrency) as well as some best practices. - - +ember-concurrency is an addon that manages asynchronous tasks in Ember applications. The addon traditionally exports a `task` function which is used similarly to a computed property. + +```js +import { task } from 'ember-concurrency'; + +export default Component.extend({ + myTask: task(function*() { + yield foo; + return bar; + }) +} +``` + +The blog post goes through how to use ember-concurrency with Ember Octane and TypeScript. For Octane, we need to use Native Class Syntax. The [ember-concurrency-decorators](https://github.com/machty/ember-concurrency-decorators) package was created to make this work for ember-concurrency. + +However, decorators cannot change the type of the thing they decorate. To allow TypeScript, the [ember-concurrency-ts](https://github.com/chancancode/ember-concurrency-ts) package was created to provide a couple of utility functions such as `taskFor`. + +Finally, the [ember-concurrency-async](https://github.com/chancancode/ember-concurrency-async) package provides a Babel transform that allows you to define ember-concurrency tasks using async/await rather than generator function. This simplifies using `taskFor` on assignment while providing complete type-safety for ember-concurrency tasks. + +Read the [full blog post](https://jamescdavis.com/using-ember-concurrency-with-typescript/) with all the tips and tricks and try it out yourself today! --- @@ -139,4 +156,4 @@ That's another wrap! ✨ Be kind, -the crowd and the Learning Team +Chris Ng, the crowd and the Learning Team From fa999436bf6c278c555210a4a324c2c8f81cd94c Mon Sep 17 00:00:00 2001 From: Jared Galanis Date: Fri, 17 Jul 2020 21:29:39 -0400 Subject: [PATCH 3/6] add-mirage-graphql --- .../2020-07-17-the-ember-times-issue-156.md | 23 ++++++++++++------- 1 file changed, 15 insertions(+), 8 deletions(-) diff --git a/source/2020-07-17-the-ember-times-issue-156.md b/source/2020-07-17-the-ember-times-issue-156.md index bbf898bc5..4a91b3fc9 100644 --- a/source/2020-07-17-the-ember-times-issue-156.md +++ b/source/2020-07-17-the-ember-times-issue-156.md @@ -1,6 +1,6 @@ --- title: The Ember Times - Issue No. 156 -author: Chris Ng, the crowd +author: Chris Ng, Jared Galanis the crowd tags: Recent Posts, Newsletter, Ember.js Times, Ember Times, 2020 alias : "blog/2020/07/17-the-ember-times-issue-156.html" responsive: true @@ -10,6 +10,7 @@ responsive: true Read the blog post on using ember-concurrency with TypeScript 🀝, +Mirage JS with GraphQL 🏝, READMORE @@ -119,14 +120,20 @@ Read the [full blog post](https://jamescdavis.com/using-ember-concurrency-with-t --- -## [Section title in sentence case 🐹](section-url) +## [Mirage JS with GraphQL 🏝](https://github.com/miragejs/graphql) - - - + Have you been wanting to use [Mirage JS](https://miragejs.com/) with GraphQL? + + Thanks to [Rocky Neurock (@jneurock)](https://github.com/jneurock), [Mirage GraphQL](https://github.com/miragejs/graphql) provides the ability to create a GraphQL route handler based on your GraphQL and Mirage schemas. - - + Mirage GraphQL does a bunch of things: + +* It fulfills GraphQL requests by fetching data from Mirage's database. +* It filters records from Mirage's database by using arguments from your GraphQL queries. +* It handles create, update and delete type mutations automatically based on some conventions. +* It allows you to supply your own resolvers (for cases where the automatic query and mutation resolution isn't sufficient). + +There's plenty of examples on how to get started using GraphQL with Mirage JS using Mirage GraphQL over at the repo, go ahead and [check them out for yourself](https://github.com/miragejs/graphql#example-use-cases). --- @@ -156,4 +163,4 @@ That's another wrap! ✨ Be kind, -Chris Ng, the crowd and the Learning Team +Chris Ng, Jared Galanis the crowd and the Learning Team From 6804ce0d584e23cac2780c37266afccffced8015 Mon Sep 17 00:00:00 2001 From: abhilashlr Date: Sat, 18 Jul 2020 00:24:52 +0530 Subject: [PATCH 4/6] blog(embertimes156): adds reusable DOM behavior blog post --- .../2020-07-17-the-ember-times-issue-156.md | 28 +++++++++++-------- 1 file changed, 16 insertions(+), 12 deletions(-) diff --git a/source/2020-07-17-the-ember-times-issue-156.md b/source/2020-07-17-the-ember-times-issue-156.md index 4a91b3fc9..818f2b3e9 100644 --- a/source/2020-07-17-the-ember-times-issue-156.md +++ b/source/2020-07-17-the-ember-times-issue-156.md @@ -1,6 +1,6 @@ --- title: The Ember Times - Issue No. 156 -author: Chris Ng, Jared Galanis the crowd +author: Chris Ng, Abhilash LR, Jared Galanis, the crowd tags: Recent Posts, Newsletter, Ember.js Times, Ember Times, 2020 alias : "blog/2020/07/17-the-ember-times-issue-156.html" responsive: true @@ -12,6 +12,8 @@ responsive: true Read the blog post on using ember-concurrency with TypeScript 🀝, Mirage JS with GraphQL 🏝, +Reusable DOM behavior in React vs Ember πŸͺ”, + READMORE --- @@ -38,14 +40,16 @@ READMORE --- -## [Section title in sentence case 🐹](section-url) +## [Reusable DOM behavior in React vs Ember πŸͺ”](https://dev.to/rajask05/reusable-dom-behavior-in-react-vs-ember-4p04) - - - +[Raja SK](https://github.com/RajaSK05) wrote a blog post comparing React and Ember's approach to creating reusable components that deal with DOM behaviors. He talks about how to approach the same using the following patterns: - - +- React's class-based and functional component approach +- Ember's mixin and **modifier** approach. + +He also talks about how to use the [ember-modifier](https://github.com/ember-modifier/ember-modifier) addon if you have been using the Ember mixin patterns so far for DOM behaviors and sharing code between components. + +Read the [full blog post](https://dev.to/rajask05/reusable-dom-behavior-in-react-vs-ember-4p04) today! --- @@ -128,10 +132,10 @@ Read the [full blog post](https://jamescdavis.com/using-ember-concurrency-with-t Mirage GraphQL does a bunch of things: -* It fulfills GraphQL requests by fetching data from Mirage's database. -* It filters records from Mirage's database by using arguments from your GraphQL queries. -* It handles create, update and delete type mutations automatically based on some conventions. -* It allows you to supply your own resolvers (for cases where the automatic query and mutation resolution isn't sufficient). +- It fulfills GraphQL requests by fetching data from Mirage's database. +- It filters records from Mirage's database by using arguments from your GraphQL queries. +- It handles create, update and delete type mutations automatically based on some conventions. +- It allows you to supply your own resolvers (for cases where the automatic query and mutation resolution isn't sufficient). There's plenty of examples on how to get started using GraphQL with Mirage JS using Mirage GraphQL over at the repo, go ahead and [check them out for yourself](https://github.com/miragejs/graphql#example-use-cases). @@ -163,4 +167,4 @@ That's another wrap! ✨ Be kind, -Chris Ng, Jared Galanis the crowd and the Learning Team +Chris Ng, Abhilash LR, Jared Galanis, the crowd and the Learning Team From 3d6ca6745de862b7f07bfcdc476f3acc4638d2d8 Mon Sep 17 00:00:00 2001 From: Amy Lam Date: Fri, 17 Jul 2020 21:14:45 -0700 Subject: [PATCH 5/6] Update 2020-07-17-the-ember-times-issue-156.md --- .../2020-07-17-the-ember-times-issue-156.md | 104 +++--------------- 1 file changed, 18 insertions(+), 86 deletions(-) diff --git a/source/2020-07-17-the-ember-times-issue-156.md b/source/2020-07-17-the-ember-times-issue-156.md index 818f2b3e9..5534bceaa 100644 --- a/source/2020-07-17-the-ember-times-issue-156.md +++ b/source/2020-07-17-the-ember-times-issue-156.md @@ -1,102 +1,21 @@ --- title: The Ember Times - Issue No. 156 -author: Chris Ng, Abhilash LR, Jared Galanis, the crowd +author: Chris Ng, Abhilash LR, Jared Galanis, Amy Lam tags: Recent Posts, Newsletter, Ember.js Times, Ember Times, 2020 alias : "blog/2020/07/17-the-ember-times-issue-156.html" responsive: true --- - Emberistas! 🐹 +πŸ‘‹ Emberistas! 🐹 - Read the blog post on using ember-concurrency with TypeScript 🀝, -Mirage JS with GraphQL 🏝, - Reusable DOM behavior in React vs Ember πŸͺ”, +and last, but not least, Mirage JS with GraphQL 🏝! READMORE --- -## [Section title in sentence case 🐹](section-url) - - - - - - - - ---- - -## [Section title in sentence case 🐹](section-url) - - - - - - - - ---- - -## [Reusable DOM behavior in React vs Ember πŸͺ”](https://dev.to/rajask05/reusable-dom-behavior-in-react-vs-ember-4p04) - -[Raja SK](https://github.com/RajaSK05) wrote a blog post comparing React and Ember's approach to creating reusable components that deal with DOM behaviors. He talks about how to approach the same using the following patterns: - -- React's class-based and functional component approach -- Ember's mixin and **modifier** approach. - -He also talks about how to use the [ember-modifier](https://github.com/ember-modifier/ember-modifier) addon if you have been using the Ember mixin patterns so far for DOM behaviors and sharing code between components. - -Read the [full blog post](https://dev.to/rajask05/reusable-dom-behavior-in-react-vs-ember-4p04) today! - ---- - -## [Section title in sentence case 🐹](section-url) - - - - - - - - ---- - -## [Section title in sentence case 🐹](section-url) - - - - - - - - ---- - -## [Section title in sentence case 🐹](section-url) - - - - - - - - ---- - -## [Section title in sentence case 🐹](section-url) - - - - - - - - ---- - ## [Using ember-concurrency with TypeScript 🀝](https://jamescdavis.com/using-ember-concurrency-with-typescript/) [James C. Davis (@jamescdavis)](https://github.com/jamescdavis) wrote a blog post summarizing how to use [TypeScript](https://github.com/microsoft/TypeScript) with [ember-concurrency](https://github.com/machty/ember-concurrency) as well as some best practices. @@ -124,6 +43,19 @@ Read the [full blog post](https://jamescdavis.com/using-ember-concurrency-with-t --- +## [Reusable DOM behavior in React vs Ember πŸͺ”](https://dev.to/rajask05/reusable-dom-behavior-in-react-vs-ember-4p04) + +[Raja SK](https://github.com/RajaSK05) wrote a blog post comparing React and Ember's approach to creating reusable components that deal with DOM behaviors. He talks about how to approach the same using the following patterns: + +- React's class-based and functional component approach +- Ember's mixin and **modifier** approach. + +He also talks about how to use the [ember-modifier](https://github.com/ember-modifier/ember-modifier) addon if you have been using the Ember mixin patterns so far for DOM behaviors and sharing code between components. + +Read the [full blog post](https://dev.to/rajask05/reusable-dom-behavior-in-react-vs-ember-4p04) today! + +--- + ## [Mirage JS with GraphQL 🏝](https://github.com/miragejs/graphql) Have you been wanting to use [Mirage JS](https://miragejs.com/) with GraphQL? @@ -143,7 +75,7 @@ There's plenty of examples on how to get started using GraphQL with Mirage JS us ## [Contributors' corner πŸ‘](https://guides.emberjs.com/release/contributing/repositories/) -

This week we'd like to thank our siblings for their contributions to Ember and related repositories! πŸ’–

+

This week we'd like to thank @kiwiupover, @rwjblue, @pzuraq, @rjschie, @arthirm, @kategengler, @richgt, @JoaoDsv, @snewcomer, @igorT, @st-h, @mansona, @pdud, @mehulkar, @bmish, @jaredgalanis, @abhilashlr, @chrisrng, @jenweber, @nickschot, @sly7-7, @superlou, @amyrlam, @hergaiety for their contributions to Ember and related repositories! πŸ’–

--- @@ -167,4 +99,4 @@ That's another wrap! ✨ Be kind, -Chris Ng, Abhilash LR, Jared Galanis, the crowd and the Learning Team +Chris Ng, Abhilash LR, Jared Galanis, Amy Lam and the Learning Team From 6728f409f48d8c0902c886380d15941a99c4cb0d Mon Sep 17 00:00:00 2001 From: Amy Lam Date: Fri, 17 Jul 2020 21:21:14 -0700 Subject: [PATCH 6/6] Update 2020-07-17-the-ember-times-issue-156.md --- source/2020-07-17-the-ember-times-issue-156.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/2020-07-17-the-ember-times-issue-156.md b/source/2020-07-17-the-ember-times-issue-156.md index 5534bceaa..f89b662f3 100644 --- a/source/2020-07-17-the-ember-times-issue-156.md +++ b/source/2020-07-17-the-ember-times-issue-156.md @@ -9,7 +9,7 @@ responsive: true πŸ‘‹ Emberistas! 🐹 Read the blog post on using ember-concurrency with TypeScript 🀝, -Reusable DOM behavior in React vs Ember πŸͺ”, +reusable DOM behavior in React vs Ember πŸͺ”, and last, but not least, Mirage JS with GraphQL 🏝! READMORE