feat(curriculum): add array shopping list workshop (freeCodeCamp#55939)

Author: jdwilkin4

client/i18n/locales/english/intro.json

@@ -1924,7 +1924,13 @@
       "avln": { "title": "157", "intro": [] },
       "mexq": { "title": "158", "intro": [] },
       "ifgn": { "title": "159", "intro": [] },
-      "qmdt": { "title": "160", "intro": [] },
+      "workshop-shopping-list": {
+        "title": "Build a Shopping List",
+        "intro": [
+          "In this workshop, you will practice working with arrays by building a shopping list.",
+          "You will review how to add and remove elements from an array using methods like <code>push</code>, <code>pop</code>, <code>shift</code>, and <code>unshift</code>."
+        ]
+      },
       "mokm": { "title": "161", "intro": [] },
       "froz": { "title": "162", "intro": [] },
       "ozth": { "title": "163", "intro": [] },

client/src/pages/learn/front-end-development/workshop-shopping-list/index.md

@@ -0,0 +1,9 @@
+---
+title: Introduction to the Build a Shopping List
+block: workshop-shopping-list
+superBlock: front-end-development
+---
+
+## Introduction to the Build a Shopping List
+
+This is a test for the new project-based curriculum.

curriculum/challenges/_meta/workshop-shopping-list/meta.json

@@ -0,0 +1,93 @@
+{
+  "name": "Build a Shopping List",
+  "blockType": "workshop",
+  "isUpcomingChange": true,
+  "usesMultifileEditor": true,
+  "hasEditableBoundaries": true,
+  "dashedName": "workshop-shopping-list",
+  "order": 155,
+  "superBlock": "front-end-development",
+  "challengeOrder": [
+    {
+      "id": "66c63bfa4685e4e3843fa0dc",
+      "title": "Step 1"
+    },
+    {
+      "id": "66c64095f61166ede6e39a84",
+      "title": "Step 2"
+    },
+    {
+      "id": "66c64210413532ee9d3bd342",
+      "title": "Step 3"
+    },
+    {
+      "id": "66c644c08ebcd2ef90c750bd",
+      "title": "Step 4"
+    },
+    {
+      "id": "66c645b345a39bf04864dc50",
+      "title": "Step 5"
+    },
+    {
+      "id": "66cbe2319d3845545a293a0b",
+      "title": "Step 6"
+    },
+    {
+      "id": "66c6491fe4c8e0f16845425f",
+      "title": "Step 7"
+    },
+    {
+      "id": "66c64ad16796c7f2419b45c5",
+      "title": "Step 8"
+    },
+    {
+      "id": "66c726c34ecf1e238aa9d7d5",
+      "title": "Step 9"
+    },
+    {
+      "id": "66c72a55418cc9247b710827",
+      "title": "Step 10"
+    },
+    {
+      "id": "66c72b0ffbc5522525768558",
+      "title": "Step 11"
+    },
+    {
+      "id": "66c72f4d0528bd268a82107b",
+      "title": "Step 12"
+    },
+    {
+      "id": "66c730183f4020275cbf0611",
+      "title": "Step 13"
+    },
+    {
+      "id": "66c730ee6ae076281721d0b9",
+      "title": "Step 14"
+    },
+    {
+      "id": "66c73a0c5b264f2a75164d94",
+      "title": "Step 15"
+    },
+    {
+      "id": "66c73a7798f6f62b2ae58f22",
+      "title": "Step 16"
+    },
+    {
+      "id": "66c73fa7433e082c4be096b1",
+      "title": "Step 17"
+    },
+    {
+      "id": "66c74079c30b1c2d166cb9a4",
+      "title": "Step 18"
+    },
+    {
+      "id": "66c742d045c9fc2e09fa64b1",
+      "title": "Step 19"
+    },
+    {
+      "id": "66c748ffdfbe4f2ede268be2",
+      "title": "Step 20"
+    }
+  ],
+  "helpCategory": "JavaScript"
+}

curriculum/challenges/english/25-front-end-development/workshop-shopping-list/66c63bfa4685e4e3843fa0dc.md

@@ -0,0 +1,36 @@
+---
+id: 66c63bfa4685e4e3843fa0dc
+title: Step 1
+challengeType: 1
+dashedName: step-1
+---
+
+# --description--
+
+In this workshop, you will continue to learn about arrays by building a grocery shopping list.
+
+Start by adding a `console.log` that logs the string `"Grocery shopping list"` to the console.
+
+# --hints--
+
+You should have a `console.log` in your code.
+
+```js
+assert.match(code, /console\.log(.*)/);
+```
+
+Your `console.log` should output the message `"Grocery shopping list"`. Double check for spelling and capitalization errors.
+
+```js
+assert.match(code, /console\.log\((["'])(Grocery\s+shopping\s+list)\1\)/);
+```
+
+# --seed--
+
+## --seed-contents--
+
+```js
+--fcc-editable-region--
+
+--fcc-editable-region--
+```

curriculum/challenges/english/25-front-end-development/workshop-shopping-list/66c64095f61166ede6e39a84.md

@@ -0,0 +1,50 @@
+---
+id: 66c64095f61166ede6e39a84
+title: Step 2
+challengeType: 1
+dashedName: step-2
+---
+
+# --description--
+
+For this shopping list, you will use an array to represent the items you need to buy.
+
+In the previous lecture videos, you learned how to create arrays like this:
+
+```js
+const fruits = ['apple', 'banana', 'orange'];
+```
+
+In this step, create a variable called `shoppingList` and assign it an empty array.
+
+# --hints--
+
+You should have a variable called `shoppingList`.
+
+```js
+assert.isNotNull(shoppingList);
+```
+
+You should assign an array to the `shoppingList` variable.
+
+```js
+assert.isArray(shoppingList);
+```
+
+Your array should be empty.
+
+```js
+assert.isEmpty(shoppingList);
+```
+
+# --seed--
+
+## --seed-contents--
+
+```js
+console.log("Grocery shopping list");
+
+--fcc-editable-region--
+
+--fcc-editable-region--
+```

curriculum/challenges/english/25-front-end-development/workshop-shopping-list/66c64210413532ee9d3bd342.md

@@ -0,0 +1,34 @@
+---
+id: 66c64210413532ee9d3bd342
+title: Step 3
+challengeType: 1
+dashedName: step-3
+---
+
+# --description--
+
+For this next portion of the workshop, you will practice adding food items to the grocery list.
+
+Start by using `console.log` to log the message `"It will be nice to have some fruit to eat."`. 
+
+# --hints--
+
+You should log the message `"It will be nice to have some fruit to eat."` to the console.
+
+```js
+assert.match(code, /console\.log\s*\(\s*(['"])(It\s+will\s+be\s+nice\s+to\s+have\s+some\s+fruit\s+to\s+eat\.)\1\s*\)\s*;?/);
+```
+
+# --seed--
+
+## --seed-contents--
+
+```js
+console.log("Grocery shopping list");
+
+const shoppingList = [];
+
+--fcc-editable-region--
+
+--fcc-editable-region--
+```

curriculum/challenges/english/25-front-end-development/workshop-shopping-list/66c644c08ebcd2ef90c750bd.md

@@ -0,0 +1,46 @@
+---
+id: 66c644c08ebcd2ef90c750bd
+title: Step 4
+challengeType: 1
+dashedName: step-4
+---
+
+# --description--
+
+In the previous lecture videos, you learned how to add items to the end of an array using the `push` method like this:
+
+```js
+fruits.push('pear');
+```
+
+Using the `push` method, add the string `"Apples"` to the `shoppingList` array.
+
+# --hints--
+
+Your `shoppingList` array should have one item in it.
+
+```js
+assert.lengthOf(shoppingList, 1);
+```
+
+Your `shoppingList` array should have the string `"Apples"` in it. Double check for spelling and capitalization errors.
+
+```js
+assert.includeMembers(shoppingList, ['Apples']);
+```
+
+# --seed--
+
+## --seed-contents--
+
+```js
+console.log("Grocery shopping list");
+
+const shoppingList = [];
+
+console.log("It will be nice to have some fruit to eat.");
+
+--fcc-editable-region--
+
+--fcc-editable-region--
+```

curriculum/challenges/english/25-front-end-development/workshop-shopping-list/66c645b345a39bf04864dc50.md

@@ -0,0 +1,54 @@
+---
+id: 66c645b345a39bf04864dc50
+title: Step 5
+challengeType: 1
+dashedName: step-5
+---
+
+# --description--
+
+To see the updated shopping list, you will need to log the current shopping list and a short message to the console.
+
+Since this message will be used repeatedly throughout the workshop, it is best to create a reusable function.
+
+Create a function called `getShoppingListMsg` that returns the string `"Current Shopping List: "` followed by the `shoppingList` array. 
+
+You can use template literals or string concatenation with the `+` operator to combine the string and the `shoppingList` array.
+
+# --hints--
+
+You should have a function called `getShoppingListMsg` in your code.
+
+```js
+assert.isFunction(getShoppingListMsg);
+```
+
+Your `getShoppingListMsg` function should return a string.
+
+```js
+assert.isString(getShoppingListMsg());
+```
+
+Your `getShoppingListMsg` function should return the message of `"Current Shopping List: "` followed by the `shoppingList` array. Double check spacing and spelling errors.
+
+```js
+assert.strictEqual(getShoppingListMsg(), "Current Shopping List: Apples");
+```
+
+# --seed--
+
+## --seed-contents--
+
+```js
+console.log("Grocery shopping list");
+
+const shoppingList = [];
+
+console.log("It will be nice to have some fruit to eat.");
+
+shoppingList.push("Apples");
+
+--fcc-editable-region--
+
+--fcc-editable-region--
+```