Update ember-resources chapters (#1732)

* Update prose.md

* Update prose / answer

* update

Author: NullVoxPopuli

apps/tutorial/public/docs/2-reactivity/6-resource-builders/prose.md

@@ -37,4 +37,7 @@ It is:
 <time>{{Clock 'ja-JP-u-ca-japanese'}}</time><br />
 ```
 
+Learn more about [resourceFactory here](https://github.com/NullVoxPopuli/ember-resources/blob/main/docs/docs/what-is-resourceFactory.md).
+
+
 [mdn-DateTimeFormat]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat

apps/tutorial/public/docs/2-reactivity/6-resource-composition/answer.gjs

@@ -1,13 +1,16 @@
 import { resource, cell, resourceFactory } from 'ember-resources';
 
-const Time = resourceFactory((ms) => resource(({ on }) => {
-  let time = cell(Date.now());
-  let interval = setInterval(() => time.current = Date.now(), ms);
+function Time(ms) {
+  return resource(({ on }) => {
+    let time = cell(Date.now());
+    let interval = setInterval(() => time.current = Date.now(), ms);
 
-  on.cleanup(() => clearInterval(interval));
+    on.cleanup(() => clearInterval(interval));
 
-  return time;
-}));
+    return time;
+  });
+}
+resourceFactory(Time);
 
 const Clock = resource(({ use }) => {
   return use(Time(1_000));
@@ -18,7 +21,7 @@ const Stopwatch = resource(({ use }) => {
 });
 
 // from a previous example
-const FormattedClock = resourceFactory((locale = 'en-US') => {
+function FormattedClock(locale = 'en-US')  {
   let formatter = new Intl.DateTimeFormat(locale, {
     month: 'long',
     day: 'numeric',
@@ -33,7 +36,8 @@ const FormattedClock = resourceFactory((locale = 'en-US') => {
 
     return () => formatter.format(time.current);
   });
-});
+}
+resourceFactory(FormattedClock);
 
 // demonstrating that use can be used multiple times
 const Watch = resource(({ use }) => {

apps/tutorial/public/docs/2-reactivity/6-resource-composition/prompt.gjs

@@ -1,13 +1,16 @@
 import { resource, cell, resourceFactory } from 'ember-resources';
 
-const Time = resourceFactory((ms) => resource(({ on }) => {
-  let time = cell(Date.now());
-  let interval = setInterval(() => time.current = Date.now(), ms);
+function Time(ms) {
+  return resource(({ on }) => {
+    let time = cell(Date.now());
+    let interval = setInterval(() => time.current = Date.now(), ms);
 
-  on.cleanup(() => clearInterval(interval));
+    on.cleanup(() => clearInterval(interval));
 
-  return time;
-}));
+    return time;
+  });
+}
+resourceFactory(Time);
 
 const Clock = resource(({ use }) => {
   /* Add your composition here */

apps/tutorial/public/docs/2-reactivity/6-resource-composition/prose.md

@@ -4,31 +4,36 @@ In previous chapters, we've built a clock, which updates every second.
 But now let's say we also want to make a Stopwatch, but we only want to manage `setInterval` once, we may want to make a Resource with configurable interval milliseconds, like this:
 
 ```js
-const Time = resourceFactory((ms) => resource(({ on }) => {
-  let time = cell(Date.now());
-  let interval = setInterval(() => time.current = Date.now(), ms);
-
-  on.cleanup(() => clearInterval(interval));
-
-  return time;
-}));
+function Time(ms) {
+  return resource(({ on }) => {
+    let time = cell(Date.now());
+    let interval = setInterval(() => time.current = Date.now(), ms);
+  
+    on.cleanup(() => clearInterval(interval));
+  
+    return time;
+  })
+}
+resourceFactory(Time); // declare intent to use in a template
 ```
+Learn more about [resourceFactory here](https://github.com/NullVoxPopuli/ember-resources/blob/main/docs/docs/what-is-resourceFactory.md).
 
 This uses the [`Date.now()`][mdn-date] method which gives us millisecond precision and represents the time in milliseconds since January 1, 1970 00:00:00 UTC (the [epoch][ecma-epoch]).
 
 
 The `on` object is not the only property we have at our disposal.  We are provided a `use` function that allows us to _use_ other resources.
 
 ```js 
-const FormattedClock = resourceFactory((locale = 'en-US') => {
+function FormattedClock(locale = 'en-US') {
   let formatter = new Intl.DateTimeFormat(locale, { /* ... */ });
 
   return resource(({ on, use }) => {
     const time = use(Time(1_000));
 
     return () => formatter.format(time.current);
   });
-});
+}
+resourceFactory(FormattedClock);
 ```
 
 This allows us to use the same resource to both make a `Clock` as well as a `Stopwatch`