diff --git a/curriculum/challenges/_meta/learn-basic-string-and-array-methods-by-building-a-music-player/meta.json b/curriculum/challenges/_meta/learn-basic-string-and-array-methods-by-building-a-music-player/meta.json index 39c8f3e75ec..2eaa5d48140 100644 --- a/curriculum/challenges/_meta/learn-basic-string-and-array-methods-by-building-a-music-player/meta.json +++ b/curriculum/challenges/_meta/learn-basic-string-and-array-methods-by-building-a-music-player/meta.json @@ -53,336 +53,360 @@ "title": "Step 10" }, { - "id": "653fb19b515fde28243f727a", + "id": "660ae3eeef9ad289bece426b", "title": "Step 11" }, { - "id": "65420b821b14f25a6b35c3b3", + "id": "660ae8ad1475698da3c3c37d", "title": "Step 12" }, { - "id": "657b2b0b6a48071a6db28e7a", + "id": "660aea8782242e8f4bcc42d8", "title": "Step 13" }, { - "id": "65420dcfc60580678dad7a92", + "id": "660aef1d5bd6c092f1931830", "title": "Step 14" }, { - "id": "654210a9eda99477f5697a94", + "id": "660af2b86c0fca95f7570fc5", "title": "Step 15" }, { - "id": "654212b82fb5cf872f77148f", + "id": "660af462d18730978fdf5c50", "title": "Step 16" }, { - "id": "654213f2fad2d48f74d6c239", + "id": "653fb19b515fde28243f727a", "title": "Step 17" }, { - "id": "654215fe7b4a899ddceb3b60", + "id": "65420b821b14f25a6b35c3b3", "title": "Step 18" }, { - "id": "6567055f59d39f07d1c542dc", + "id": "657b2b0b6a48071a6db28e7a", "title": "Step 19" }, { - "id": "654218753c255fabb81f57ca", + "id": "65420dcfc60580678dad7a92", "title": "Step 20" }, { - "id": "65c64fe6c770a22db893e931", + "id": "654210a9eda99477f5697a94", "title": "Step 21" }, { - "id": "65a608b7e7c75a04ccf0c23c", + "id": "654212b82fb5cf872f77148f", "title": "Step 22" }, { - "id": "65a6098a3405f206312e28f5", + "id": "654213f2fad2d48f74d6c239", "title": "Step 23" }, { - "id": "65a609f6e23f3b06c608fb57", + "id": "654215fe7b4a899ddceb3b60", "title": "Step 24" }, { - "id": "65a60aa3efd8fa079c2d1537", + "id": "6567055f59d39f07d1c542dc", "title": "Step 25" }, { - "id": "65a60b0b8b4f96085ac23463", + "id": "654218753c255fabb81f57ca", "title": "Step 26" }, { - "id": "65cf1f2cd796c06057bf3f3c", + "id": "65c64fe6c770a22db893e931", "title": "Step 27" }, { - "id": "65c6532520cf4f323329b2c6", + "id": "65a608b7e7c75a04ccf0c23c", "title": "Step 28" }, { - "id": "653283d07b8f9d294aafa83b", + "id": "65a6098a3405f206312e28f5", "title": "Step 29" }, { - "id": "65362bfd67d61d517deef191", + "id": "65a609f6e23f3b06c608fb57", "title": "Step 30" }, { - "id": "653635c731206b718659d3d5", + "id": "65a60aa3efd8fa079c2d1537", "title": "Step 31" }, { - "id": "653639d63a45a077333312c8", + "id": "65a60b0b8b4f96085ac23463", "title": "Step 32" }, { - "id": "656472ed8f552d2f2b3f7883", + "id": "65cf1f2cd796c06057bf3f3c", "title": "Step 33" }, { - "id": "653641509b6e7681a9333245", + "id": "65c6532520cf4f323329b2c6", "title": "Step 34" }, { - "id": "655235c2e607297f00316650", + "id": "653283d07b8f9d294aafa83b", "title": "Step 35" }, { - "id": "65364566e84e378837fbaf2a", + "id": "65362bfd67d61d517deef191", "title": "Step 36" }, { - "id": "65422ba173a18b1bedef1bb6", + "id": "653635c731206b718659d3d5", "title": "Step 37" }, { - "id": "6552127b2576c2fbc5ecc2ea", + "id": "653639d63a45a077333312c8", "title": "Step 38" }, { - "id": "65672136535209761a5cf02b", + "id": "656472ed8f552d2f2b3f7883", "title": "Step 39" }, { - "id": "65521badc7b7470edf952372", + "id": "653641509b6e7681a9333245", "title": "Step 40" }, { - "id": "65521ec3bb117c195c4f6cb5", + "id": "655235c2e607297f00316650", "title": "Step 41" }, { - "id": "655220a3fa5c3c200bc8e938", + "id": "65364566e84e378837fbaf2a", "title": "Step 42" }, { - "id": "6552303a9a78704f8ff072e9", + "id": "65422ba173a18b1bedef1bb6", "title": "Step 43" }, { - "id": "655487f686aabfc2a10ba887", + "id": "6552127b2576c2fbc5ecc2ea", "title": "Step 44" }, { - "id": "659b0093d7db5a1a1122b7bd", + "id": "65672136535209761a5cf02b", "title": "Step 45" }, { - "id": "6552385244ccf89b77d6b332", + "id": "65521badc7b7470edf952372", "title": "Step 46" }, { - "id": "655243068222c2c1166b90b0", + "id": "65521ec3bb117c195c4f6cb5", "title": "Step 47" }, { - "id": "655476e1ff522252fdcce5e4", + "id": "655220a3fa5c3c200bc8e938", "title": "Step 48" }, { - "id": "655479aa3e1e0360ae38b7a6", + "id": "6552303a9a78704f8ff072e9", "title": "Step 49" }, { - "id": "65547ee197840478a1b95f4b", + "id": "655487f686aabfc2a10ba887", "title": "Step 50" }, { - "id": "6554815fe2472f8bfdab7642", + "id": "659b0093d7db5a1a1122b7bd", "title": "Step 51" }, { - "id": "655482742cc5499726e3f347", + "id": "6552385244ccf89b77d6b332", "title": "Step 52" }, { - "id": "655483ebf0096ba02b2c3d4c", + "id": "655243068222c2c1166b90b0", "title": "Step 53" }, { - "id": "655485321913feabbc5f00f8", + "id": "655476e1ff522252fdcce5e4", "title": "Step 54" }, { - "id": "6554860ea4dfbab2f4786fc8", + "id": "655479aa3e1e0360ae38b7a6", "title": "Step 55" }, { - "id": "65548f747a4cdafd186948d1", + "id": "65547ee197840478a1b95f4b", "title": "Step 56" }, { - "id": "655490f55c36900779336988", + "id": "6554815fe2472f8bfdab7642", "title": "Step 57" }, { - "id": "65671421254eeb489875cdd8", + "id": "655482742cc5499726e3f347", "title": "Step 58" }, { - "id": "655492e6b90c7a198c587943", + "id": "655483ebf0096ba02b2c3d4c", "title": "Step 59" }, { - "id": "655494d5a15d6a2567e1ea60", + "id": "655485321913feabbc5f00f8", "title": "Step 60" }, { - "id": "655495a6bd96e42bc3baa795", + "id": "6554860ea4dfbab2f4786fc8", "title": "Step 61" }, { - "id": "6555d17af9ff06a14d399f6d", + "id": "65548f747a4cdafd186948d1", "title": "Step 62" }, { - "id": "6555d458687cb3b357834df9", + "id": "655490f55c36900779336988", "title": "Step 63" }, { - "id": "6555d729c9bfd7c3195f1948", + "id": "65671421254eeb489875cdd8", "title": "Step 64" }, { - "id": "6555d7e384056dc9c581fadf", + "id": "655492e6b90c7a198c587943", "title": "Step 65" }, { - "id": "6555d8faed60b9d3e4a6cefb", + "id": "655494d5a15d6a2567e1ea60", "title": "Step 66" }, { - "id": "6555dd138e70cae6b546966d", + "id": "655495a6bd96e42bc3baa795", "title": "Step 67" }, { - "id": "6555de565387a2efe90a6ccc", + "id": "6555d17af9ff06a14d399f6d", "title": "Step 68" }, { - "id": "6555e04aeb225bfbae237344", + "id": "6555d458687cb3b357834df9", "title": "Step 69" }, { - "id": "6555e0bfe4d69904410f7cd3", + "id": "6555d729c9bfd7c3195f1948", "title": "Step 70" }, { - "id": "6555e39a5f4c6f138c7d9405", + "id": "6555d7e384056dc9c581fadf", "title": "Step 71" }, { - "id": "6555e57d3e6d9d221c4735be", + "id": "6555d8faed60b9d3e4a6cefb", "title": "Step 72" }, { - "id": "6555e6cec786da2aadc11ea0", + "id": "6555dd138e70cae6b546966d", "title": "Step 73" }, { - "id": "6555e7acdbae972d3e8e0f5b", + "id": "6555de565387a2efe90a6ccc", "title": "Step 74" }, { - "id": "6555e9197bf1d7416bdd76e0", + "id": "6555e04aeb225bfbae237344", "title": "Step 75" }, { - "id": "6555ebf07ec610585a626f72", + "id": "6555e0bfe4d69904410f7cd3", "title": "Step 76" }, { - "id": "65571e742fbf4532d8f98e90", + "id": "6555e39a5f4c6f138c7d9405", "title": "Step 77" }, { - "id": "655720534347cb3f31cdfb3d", + "id": "6555e57d3e6d9d221c4735be", "title": "Step 78" }, { - "id": "65572399a8e16d50bc2c1ff3", + "id": "6555e6cec786da2aadc11ea0", "title": "Step 79" }, { - "id": "6557421eb6a7a0f0500e3106", + "id": "6555e7acdbae972d3e8e0f5b", "title": "Step 80" }, { - "id": "655724bac464795a0ad91082", + "id": "6555e9197bf1d7416bdd76e0", "title": "Step 81" }, { - "id": "655727b2e1e49d6adf584442", + "id": "6555ebf07ec610585a626f72", "title": "Step 82" }, { - "id": "65672adafbaa37a6cef886f7", + "id": "65571e742fbf4532d8f98e90", "title": "Step 83" }, { - "id": "655729e68e49b277a6b448bd", + "id": "655720534347cb3f31cdfb3d", "title": "Step 84" }, { - "id": "65572bb34a7e488224b937fc", + "id": "65572399a8e16d50bc2c1ff3", "title": "Step 85" }, { - "id": "65572e5aaf022790fb4a81b1", + "id": "6557421eb6a7a0f0500e3106", "title": "Step 86" }, { - "id": "655737cd004591b0271d6826", + "id": "655724bac464795a0ad91082", "title": "Step 87" }, { - "id": "65573a97c59ddbbf028ca95e", + "id": "655727b2e1e49d6adf584442", "title": "Step 88" }, { - "id": "65573d0abe4d38cd6fa13f44", + "id": "65672adafbaa37a6cef886f7", "title": "Step 89" }, { - "id": "655b49333d9f265bc1512152", + "id": "655729e68e49b277a6b448bd", "title": "Step 90" }, { - "id": "655b4bbff1dbf66cb2ed4dac", + "id": "65572bb34a7e488224b937fc", "title": "Step 91" }, { - "id": "655b4c8f636d9675953a0388", + "id": "65572e5aaf022790fb4a81b1", "title": "Step 92" }, { - "id": "655b4dad1d38ff7cdd65cbfe", + "id": "655737cd004591b0271d6826", "title": "Step 93" + }, + { + "id": "65573a97c59ddbbf028ca95e", + "title": "Step 94" + }, + { + "id": "65573d0abe4d38cd6fa13f44", + "title": "Step 95" + }, + { + "id": "655b49333d9f265bc1512152", + "title": "Step 96" + }, + { + "id": "655b4bbff1dbf66cb2ed4dac", + "title": "Step 97" + }, + { + "id": "655b4c8f636d9675953a0388", + "title": "Step 98" + }, + { + "id": "655b4dad1d38ff7cdd65cbfe", + "title": "Step 99" } ], "helpCategory": "JavaScript" diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653283d07b8f9d294aafa83b.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653283d07b8f9d294aafa83b.md index da6d87935b1..de7c16816a3 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653283d07b8f9d294aafa83b.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653283d07b8f9d294aafa83b.md @@ -1,8 +1,8 @@ --- id: 653283d07b8f9d294aafa83b -title: Step 29 +title: Step 35 challengeType: 0 -dashedName: step-29 +dashedName: step-35 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65362bfd67d61d517deef191.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65362bfd67d61d517deef191.md index 12ffe59a586..0a95dbfb279 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65362bfd67d61d517deef191.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65362bfd67d61d517deef191.md @@ -1,8 +1,8 @@ --- id: 65362bfd67d61d517deef191 -title: Step 30 +title: Step 36 challengeType: 0 -dashedName: step-30 +dashedName: step-36 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653635c731206b718659d3d5.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653635c731206b718659d3d5.md index ec22802986d..e59771e94a8 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653635c731206b718659d3d5.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653635c731206b718659d3d5.md @@ -1,8 +1,8 @@ --- id: 653635c731206b718659d3d5 -title: Step 31 +title: Step 37 challengeType: 0 -dashedName: step-31 +dashedName: step-37 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653639d63a45a077333312c8.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653639d63a45a077333312c8.md index c255c8d4106..9d47ec5903d 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653639d63a45a077333312c8.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653639d63a45a077333312c8.md @@ -1,8 +1,8 @@ --- id: 653639d63a45a077333312c8 -title: Step 32 +title: Step 38 challengeType: 0 -dashedName: step-32 +dashedName: step-38 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653641509b6e7681a9333245.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653641509b6e7681a9333245.md index 4049bd430b1..907ca622216 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653641509b6e7681a9333245.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653641509b6e7681a9333245.md @@ -1,8 +1,8 @@ --- id: 653641509b6e7681a9333245 -title: Step 34 +title: Step 40 challengeType: 0 -dashedName: step-34 +dashedName: step-40 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65364566e84e378837fbaf2a.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65364566e84e378837fbaf2a.md index e4398d0e54b..df244bac597 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65364566e84e378837fbaf2a.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65364566e84e378837fbaf2a.md @@ -1,8 +1,8 @@ --- id: 65364566e84e378837fbaf2a -title: Step 36 +title: Step 42 challengeType: 0 -dashedName: step-36 +dashedName: step-42 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653fb19b515fde28243f727a.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653fb19b515fde28243f727a.md index c7c95c30363..0a7f8ce8f56 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653fb19b515fde28243f727a.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/653fb19b515fde28243f727a.md @@ -1,29 +1,13 @@ --- id: 653fb19b515fde28243f727a -title: Step 11 +title: Step 17 challengeType: 0 -dashedName: step-11 +dashedName: step-17 --- # --description-- -Now you need a way to display the songs in the UI (User Interface). To do this, you'll create a `renderSongs` function using the arrow function syntax. - -An arrow function is a shorter and more concise way to write functions in JavaScript. It's a function expression, which is a function that's assigned to a variable. - -Here is an example of an arrow function with a single parameter and a single expression in the function body: - -```js -const exampleArrowFunction = (param) => { - return param -}; -``` - -If the function body consists of a single expression, you can omit the curly braces and the `return` keyword. This is called an `implicit return`: - -```js -const exampleArrowFunction = (param) => param; -``` +To display the songs in the UI (User Interface), you'll need to create a function. Use the arrow function syntax to create a `renderSongs` function that takes in `array` as its parameter. diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65420b821b14f25a6b35c3b3.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65420b821b14f25a6b35c3b3.md index 981c5a757b1..80c6cf6a669 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65420b821b14f25a6b35c3b3.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65420b821b14f25a6b35c3b3.md @@ -1,8 +1,8 @@ --- id: 65420b821b14f25a6b35c3b3 -title: Step 12 +title: Step 18 challengeType: 0 -dashedName: step-12 +dashedName: step-18 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65420dcfc60580678dad7a92.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65420dcfc60580678dad7a92.md index a3a869cdaeb..6425771f0b3 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65420dcfc60580678dad7a92.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65420dcfc60580678dad7a92.md @@ -1,8 +1,8 @@ --- id: 65420dcfc60580678dad7a92 -title: Step 14 +title: Step 20 challengeType: 0 -dashedName: step-14 +dashedName: step-20 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654210a9eda99477f5697a94.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654210a9eda99477f5697a94.md index 159fe8d94de..6f00ce94ff1 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654210a9eda99477f5697a94.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654210a9eda99477f5697a94.md @@ -1,8 +1,8 @@ --- id: 654210a9eda99477f5697a94 -title: Step 15 +title: Step 21 challengeType: 0 -dashedName: step-15 +dashedName: step-21 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654212b82fb5cf872f77148f.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654212b82fb5cf872f77148f.md index 0415e8470b5..a9faf7a9e72 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654212b82fb5cf872f77148f.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654212b82fb5cf872f77148f.md @@ -1,8 +1,8 @@ --- id: 654212b82fb5cf872f77148f -title: Step 16 +title: Step 22 challengeType: 0 -dashedName: step-16 +dashedName: step-22 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654213f2fad2d48f74d6c239.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654213f2fad2d48f74d6c239.md index 250d38aa699..c98830b0635 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654213f2fad2d48f74d6c239.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654213f2fad2d48f74d6c239.md @@ -1,8 +1,8 @@ --- id: 654213f2fad2d48f74d6c239 -title: Step 17 +title: Step 23 challengeType: 0 -dashedName: step-17 +dashedName: step-23 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654215fe7b4a899ddceb3b60.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654215fe7b4a899ddceb3b60.md index f9f16ffcd32..9453d74d59c 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654215fe7b4a899ddceb3b60.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654215fe7b4a899ddceb3b60.md @@ -1,8 +1,8 @@ --- id: 654215fe7b4a899ddceb3b60 -title: Step 18 +title: Step 24 challengeType: 0 -dashedName: step-18 +dashedName: step-24 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654218753c255fabb81f57ca.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654218753c255fabb81f57ca.md index b206429ea20..77d7e1ca020 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654218753c255fabb81f57ca.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/654218753c255fabb81f57ca.md @@ -1,8 +1,8 @@ --- id: 654218753c255fabb81f57ca -title: Step 20 +title: Step 26 challengeType: 0 -dashedName: step-20 +dashedName: step-26 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65422ba173a18b1bedef1bb6.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65422ba173a18b1bedef1bb6.md index d365016689f..00141dad051 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65422ba173a18b1bedef1bb6.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65422ba173a18b1bedef1bb6.md @@ -1,8 +1,8 @@ --- id: 65422ba173a18b1bedef1bb6 -title: Step 37 +title: Step 43 challengeType: 0 -dashedName: step-37 +dashedName: step-43 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552127b2576c2fbc5ecc2ea.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552127b2576c2fbc5ecc2ea.md index 4b376ec457d..b9692ffe3ce 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552127b2576c2fbc5ecc2ea.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552127b2576c2fbc5ecc2ea.md @@ -1,8 +1,8 @@ --- id: 6552127b2576c2fbc5ecc2ea -title: Step 38 +title: Step 44 challengeType: 0 -dashedName: step-38 +dashedName: step-44 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65521badc7b7470edf952372.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65521badc7b7470edf952372.md index 3cafebc0bf0..0dc822cd838 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65521badc7b7470edf952372.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65521badc7b7470edf952372.md @@ -1,8 +1,8 @@ --- id: 65521badc7b7470edf952372 -title: Step 40 +title: Step 46 challengeType: 0 -dashedName: step-40 +dashedName: step-46 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65521ec3bb117c195c4f6cb5.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65521ec3bb117c195c4f6cb5.md index fc2e975c0e1..a0f0cbedaa0 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65521ec3bb117c195c4f6cb5.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65521ec3bb117c195c4f6cb5.md @@ -1,8 +1,8 @@ --- id: 65521ec3bb117c195c4f6cb5 -title: Step 41 +title: Step 47 challengeType: 0 -dashedName: step-41 +dashedName: step-47 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655220a3fa5c3c200bc8e938.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655220a3fa5c3c200bc8e938.md index b5155829381..26123bd56b3 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655220a3fa5c3c200bc8e938.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655220a3fa5c3c200bc8e938.md @@ -1,8 +1,8 @@ --- id: 655220a3fa5c3c200bc8e938 -title: Step 42 +title: Step 48 challengeType: 0 -dashedName: step-42 +dashedName: step-48 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552303a9a78704f8ff072e9.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552303a9a78704f8ff072e9.md index 6190fb89e5e..eae116d4a2f 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552303a9a78704f8ff072e9.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552303a9a78704f8ff072e9.md @@ -1,8 +1,8 @@ --- id: 6552303a9a78704f8ff072e9 -title: Step 43 +title: Step 49 challengeType: 0 -dashedName: step-43 +dashedName: step-49 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655235c2e607297f00316650.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655235c2e607297f00316650.md index a75078887be..212ab3bb8b0 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655235c2e607297f00316650.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655235c2e607297f00316650.md @@ -1,8 +1,8 @@ --- id: 655235c2e607297f00316650 -title: Step 35 +title: Step 41 challengeType: 0 -dashedName: step-35 +dashedName: step-41 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552385244ccf89b77d6b332.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552385244ccf89b77d6b332.md index 2677a01ece6..f8d806550b2 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552385244ccf89b77d6b332.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6552385244ccf89b77d6b332.md @@ -1,8 +1,8 @@ --- id: 6552385244ccf89b77d6b332 -title: Step 46 +title: Step 52 challengeType: 0 -dashedName: step-46 +dashedName: step-52 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655243068222c2c1166b90b0.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655243068222c2c1166b90b0.md index 1ecbf74b347..121777da773 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655243068222c2c1166b90b0.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655243068222c2c1166b90b0.md @@ -1,8 +1,8 @@ --- id: 655243068222c2c1166b90b0 -title: Step 47 +title: Step 53 challengeType: 0 -dashedName: step-47 +dashedName: step-53 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655476e1ff522252fdcce5e4.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655476e1ff522252fdcce5e4.md index 046e2ce86da..647495447b8 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655476e1ff522252fdcce5e4.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655476e1ff522252fdcce5e4.md @@ -1,8 +1,8 @@ --- id: 655476e1ff522252fdcce5e4 -title: Step 48 +title: Step 54 challengeType: 0 -dashedName: step-48 +dashedName: step-54 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655479aa3e1e0360ae38b7a6.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655479aa3e1e0360ae38b7a6.md index 27f5f0656a9..f7b3c82f845 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655479aa3e1e0360ae38b7a6.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655479aa3e1e0360ae38b7a6.md @@ -1,8 +1,8 @@ --- id: 655479aa3e1e0360ae38b7a6 -title: Step 49 +title: Step 55 challengeType: 0 -dashedName: step-49 +dashedName: step-55 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65547ee197840478a1b95f4b.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65547ee197840478a1b95f4b.md index 7f8c686ebd4..e4f3aeb5126 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65547ee197840478a1b95f4b.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65547ee197840478a1b95f4b.md @@ -1,8 +1,8 @@ --- id: 65547ee197840478a1b95f4b -title: Step 50 +title: Step 56 challengeType: 0 -dashedName: step-50 +dashedName: step-56 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6554815fe2472f8bfdab7642.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6554815fe2472f8bfdab7642.md index 01b97fe5bcc..1c2aecd5ccd 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6554815fe2472f8bfdab7642.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6554815fe2472f8bfdab7642.md @@ -1,8 +1,8 @@ --- id: 6554815fe2472f8bfdab7642 -title: Step 51 +title: Step 57 challengeType: 0 -dashedName: step-51 +dashedName: step-57 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655482742cc5499726e3f347.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655482742cc5499726e3f347.md index ad9acadeaf0..1afb3fef5e1 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655482742cc5499726e3f347.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655482742cc5499726e3f347.md @@ -1,8 +1,8 @@ --- id: 655482742cc5499726e3f347 -title: Step 52 +title: Step 58 challengeType: 0 -dashedName: step-52 +dashedName: step-58 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655483ebf0096ba02b2c3d4c.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655483ebf0096ba02b2c3d4c.md index fa177fb8190..6862fa6eaa5 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655483ebf0096ba02b2c3d4c.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655483ebf0096ba02b2c3d4c.md @@ -1,8 +1,8 @@ --- id: 655483ebf0096ba02b2c3d4c -title: Step 53 +title: Step 59 challengeType: 0 -dashedName: step-53 +dashedName: step-59 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655485321913feabbc5f00f8.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655485321913feabbc5f00f8.md index c1425d11f38..e1490f9fe3b 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655485321913feabbc5f00f8.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655485321913feabbc5f00f8.md @@ -1,8 +1,8 @@ --- id: 655485321913feabbc5f00f8 -title: Step 54 +title: Step 60 challengeType: 0 -dashedName: step-54 +dashedName: step-60 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6554860ea4dfbab2f4786fc8.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6554860ea4dfbab2f4786fc8.md index b7b9462e0e5..1be745e237c 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6554860ea4dfbab2f4786fc8.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6554860ea4dfbab2f4786fc8.md @@ -1,8 +1,8 @@ --- id: 6554860ea4dfbab2f4786fc8 -title: Step 55 +title: Step 61 challengeType: 0 -dashedName: step-55 +dashedName: step-61 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655487f686aabfc2a10ba887.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655487f686aabfc2a10ba887.md index 3ea8471bc4d..36acd9bc80e 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655487f686aabfc2a10ba887.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655487f686aabfc2a10ba887.md @@ -1,8 +1,8 @@ --- id: 655487f686aabfc2a10ba887 -title: Step 44 +title: Step 50 challengeType: 0 -dashedName: step-44 +dashedName: step-50 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65548f747a4cdafd186948d1.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65548f747a4cdafd186948d1.md index b2e2b6ed290..6318a3dd61f 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65548f747a4cdafd186948d1.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65548f747a4cdafd186948d1.md @@ -1,8 +1,8 @@ --- id: 65548f747a4cdafd186948d1 -title: Step 56 +title: Step 62 challengeType: 0 -dashedName: step-56 +dashedName: step-62 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655490f55c36900779336988.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655490f55c36900779336988.md index 51cebc47137..be032a0e44c 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655490f55c36900779336988.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655490f55c36900779336988.md @@ -1,8 +1,8 @@ --- id: 655490f55c36900779336988 -title: Step 57 +title: Step 63 challengeType: 0 -dashedName: step-57 +dashedName: step-63 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655492e6b90c7a198c587943.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655492e6b90c7a198c587943.md index 20916d83c52..174ef907306 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655492e6b90c7a198c587943.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655492e6b90c7a198c587943.md @@ -1,8 +1,8 @@ --- id: 655492e6b90c7a198c587943 -title: Step 59 +title: Step 65 challengeType: 0 -dashedName: step-59 +dashedName: step-65 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655494d5a15d6a2567e1ea60.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655494d5a15d6a2567e1ea60.md index 2f77c46bdf7..f26844231aa 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655494d5a15d6a2567e1ea60.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655494d5a15d6a2567e1ea60.md @@ -1,8 +1,8 @@ --- id: 655494d5a15d6a2567e1ea60 -title: Step 60 +title: Step 66 challengeType: 0 -dashedName: step-60 +dashedName: step-66 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655495a6bd96e42bc3baa795.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655495a6bd96e42bc3baa795.md index 65f20ca4714..934ec0e9d3a 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655495a6bd96e42bc3baa795.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655495a6bd96e42bc3baa795.md @@ -1,8 +1,8 @@ --- id: 655495a6bd96e42bc3baa795 -title: Step 61 +title: Step 67 challengeType: 0 -dashedName: step-61 +dashedName: step-67 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d17af9ff06a14d399f6d.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d17af9ff06a14d399f6d.md index d926f3e583c..ef0e89e6d90 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d17af9ff06a14d399f6d.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d17af9ff06a14d399f6d.md @@ -1,8 +1,8 @@ --- id: 6555d17af9ff06a14d399f6d -title: Step 62 +title: Step 68 challengeType: 0 -dashedName: step-62 +dashedName: step-68 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d458687cb3b357834df9.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d458687cb3b357834df9.md index abdd41a3bc3..d67fbd19d08 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d458687cb3b357834df9.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d458687cb3b357834df9.md @@ -1,8 +1,8 @@ --- id: 6555d458687cb3b357834df9 -title: Step 63 +title: Step 69 challengeType: 0 -dashedName: step-63 +dashedName: step-69 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d729c9bfd7c3195f1948.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d729c9bfd7c3195f1948.md index 1657ae956df..2311b0f39ff 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d729c9bfd7c3195f1948.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d729c9bfd7c3195f1948.md @@ -1,8 +1,8 @@ --- id: 6555d729c9bfd7c3195f1948 -title: Step 64 +title: Step 70 challengeType: 0 -dashedName: step-64 +dashedName: step-70 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d7e384056dc9c581fadf.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d7e384056dc9c581fadf.md index 51055649099..ab01aed3a22 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d7e384056dc9c581fadf.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d7e384056dc9c581fadf.md @@ -1,8 +1,8 @@ --- id: 6555d7e384056dc9c581fadf -title: Step 65 +title: Step 71 challengeType: 0 -dashedName: step-65 +dashedName: step-71 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d8faed60b9d3e4a6cefb.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d8faed60b9d3e4a6cefb.md index e07e27ac0cd..45164df6ee6 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d8faed60b9d3e4a6cefb.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555d8faed60b9d3e4a6cefb.md @@ -1,8 +1,8 @@ --- id: 6555d8faed60b9d3e4a6cefb -title: Step 66 +title: Step 72 challengeType: 0 -dashedName: step-66 +dashedName: step-72 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555dd138e70cae6b546966d.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555dd138e70cae6b546966d.md index c5863e45bda..b13feec8157 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555dd138e70cae6b546966d.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555dd138e70cae6b546966d.md @@ -1,8 +1,8 @@ --- id: 6555dd138e70cae6b546966d -title: Step 67 +title: Step 73 challengeType: 0 -dashedName: step-67 +dashedName: step-73 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555de565387a2efe90a6ccc.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555de565387a2efe90a6ccc.md index 5568a84c32d..3e5ea933931 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555de565387a2efe90a6ccc.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555de565387a2efe90a6ccc.md @@ -1,8 +1,8 @@ --- id: 6555de565387a2efe90a6ccc -title: Step 68 +title: Step 74 challengeType: 0 -dashedName: step-68 +dashedName: step-74 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e04aeb225bfbae237344.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e04aeb225bfbae237344.md index 6cd7d354d8b..de487ff66a8 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e04aeb225bfbae237344.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e04aeb225bfbae237344.md @@ -1,8 +1,8 @@ --- id: 6555e04aeb225bfbae237344 -title: Step 69 +title: Step 75 challengeType: 0 -dashedName: step-69 +dashedName: step-75 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e0bfe4d69904410f7cd3.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e0bfe4d69904410f7cd3.md index f8790b729e7..92ab2e98555 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e0bfe4d69904410f7cd3.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e0bfe4d69904410f7cd3.md @@ -1,8 +1,8 @@ --- id: 6555e0bfe4d69904410f7cd3 -title: Step 70 +title: Step 76 challengeType: 0 -dashedName: step-70 +dashedName: step-76 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e39a5f4c6f138c7d9405.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e39a5f4c6f138c7d9405.md index 153096f971d..f56cb761e45 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e39a5f4c6f138c7d9405.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e39a5f4c6f138c7d9405.md @@ -1,8 +1,8 @@ --- id: 6555e39a5f4c6f138c7d9405 -title: Step 71 +title: Step 77 challengeType: 0 -dashedName: step-71 +dashedName: step-77 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e57d3e6d9d221c4735be.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e57d3e6d9d221c4735be.md index 14c5d5ad078..0eb84d81095 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e57d3e6d9d221c4735be.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e57d3e6d9d221c4735be.md @@ -1,8 +1,8 @@ --- id: 6555e57d3e6d9d221c4735be -title: Step 72 +title: Step 78 challengeType: 0 -dashedName: step-72 +dashedName: step-78 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e6cec786da2aadc11ea0.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e6cec786da2aadc11ea0.md index 600c182d47d..093f699b7ed 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e6cec786da2aadc11ea0.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e6cec786da2aadc11ea0.md @@ -1,8 +1,8 @@ --- id: 6555e6cec786da2aadc11ea0 -title: Step 73 +title: Step 79 challengeType: 0 -dashedName: step-73 +dashedName: step-79 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e7acdbae972d3e8e0f5b.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e7acdbae972d3e8e0f5b.md index 711b6c9bb99..6dbb9ac57e6 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e7acdbae972d3e8e0f5b.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e7acdbae972d3e8e0f5b.md @@ -1,8 +1,8 @@ --- id: 6555e7acdbae972d3e8e0f5b -title: Step 74 +title: Step 80 challengeType: 0 -dashedName: step-74 +dashedName: step-80 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e9197bf1d7416bdd76e0.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e9197bf1d7416bdd76e0.md index fb573dd2a90..88078bcce7f 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e9197bf1d7416bdd76e0.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555e9197bf1d7416bdd76e0.md @@ -1,8 +1,8 @@ --- id: 6555e9197bf1d7416bdd76e0 -title: Step 75 +title: Step 81 challengeType: 0 -dashedName: step-75 +dashedName: step-81 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555ebf07ec610585a626f72.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555ebf07ec610585a626f72.md index 16ad5a60569..cdafcc7d105 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555ebf07ec610585a626f72.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6555ebf07ec610585a626f72.md @@ -1,8 +1,8 @@ --- id: 6555ebf07ec610585a626f72 -title: Step 76 +title: Step 82 challengeType: 0 -dashedName: step-76 +dashedName: step-82 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65571e742fbf4532d8f98e90.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65571e742fbf4532d8f98e90.md index 9b18eb34595..ba70aa3c9f7 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65571e742fbf4532d8f98e90.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65571e742fbf4532d8f98e90.md @@ -1,8 +1,8 @@ --- id: 65571e742fbf4532d8f98e90 -title: Step 77 +title: Step 83 challengeType: 0 -dashedName: step-77 +dashedName: step-83 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655720534347cb3f31cdfb3d.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655720534347cb3f31cdfb3d.md index bdcf0368f41..f86755be02a 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655720534347cb3f31cdfb3d.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655720534347cb3f31cdfb3d.md @@ -1,8 +1,8 @@ --- id: 655720534347cb3f31cdfb3d -title: Step 78 +title: Step 84 challengeType: 0 -dashedName: step-78 +dashedName: step-84 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572399a8e16d50bc2c1ff3.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572399a8e16d50bc2c1ff3.md index 5b34cf74125..38d71c04e72 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572399a8e16d50bc2c1ff3.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572399a8e16d50bc2c1ff3.md @@ -1,8 +1,8 @@ --- id: 65572399a8e16d50bc2c1ff3 -title: Step 79 +title: Step 85 challengeType: 0 -dashedName: step-79 +dashedName: step-85 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655724bac464795a0ad91082.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655724bac464795a0ad91082.md index 7a91faa353a..145f8e48d2d 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655724bac464795a0ad91082.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655724bac464795a0ad91082.md @@ -1,8 +1,8 @@ --- id: 655724bac464795a0ad91082 -title: Step 81 +title: Step 87 challengeType: 0 -dashedName: step-81 +dashedName: step-87 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655727b2e1e49d6adf584442.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655727b2e1e49d6adf584442.md index 0c52b15f76c..59e5f3479dc 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655727b2e1e49d6adf584442.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655727b2e1e49d6adf584442.md @@ -1,8 +1,8 @@ --- id: 655727b2e1e49d6adf584442 -title: Step 82 +title: Step 88 challengeType: 0 -dashedName: step-82 +dashedName: step-88 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655729e68e49b277a6b448bd.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655729e68e49b277a6b448bd.md index 89463de79c7..bcc650658ae 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655729e68e49b277a6b448bd.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655729e68e49b277a6b448bd.md @@ -1,8 +1,8 @@ --- id: 655729e68e49b277a6b448bd -title: Step 84 +title: Step 90 challengeType: 0 -dashedName: step-84 +dashedName: step-90 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572bb34a7e488224b937fc.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572bb34a7e488224b937fc.md index 46ea7683731..6a1afd34131 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572bb34a7e488224b937fc.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572bb34a7e488224b937fc.md @@ -1,8 +1,8 @@ --- id: 65572bb34a7e488224b937fc -title: Step 85 +title: Step 91 challengeType: 0 -dashedName: step-85 +dashedName: step-91 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572e5aaf022790fb4a81b1.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572e5aaf022790fb4a81b1.md index c36ee8fb2e9..bb5c6c25fa4 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572e5aaf022790fb4a81b1.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65572e5aaf022790fb4a81b1.md @@ -1,8 +1,8 @@ --- id: 65572e5aaf022790fb4a81b1 -title: Step 86 +title: Step 92 challengeType: 0 -dashedName: step-86 +dashedName: step-92 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655737cd004591b0271d6826.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655737cd004591b0271d6826.md index 4321e007d42..35c4f59112e 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655737cd004591b0271d6826.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655737cd004591b0271d6826.md @@ -1,8 +1,8 @@ --- id: 655737cd004591b0271d6826 -title: Step 87 +title: Step 93 challengeType: 0 -dashedName: step-87 +dashedName: step-93 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65573a97c59ddbbf028ca95e.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65573a97c59ddbbf028ca95e.md index 6d30f821849..d8e0ad93386 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65573a97c59ddbbf028ca95e.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65573a97c59ddbbf028ca95e.md @@ -1,8 +1,8 @@ --- id: 65573a97c59ddbbf028ca95e -title: Step 88 +title: Step 94 challengeType: 0 -dashedName: step-88 +dashedName: step-94 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65573d0abe4d38cd6fa13f44.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65573d0abe4d38cd6fa13f44.md index 79261a5d6d1..18557cba927 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65573d0abe4d38cd6fa13f44.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65573d0abe4d38cd6fa13f44.md @@ -1,8 +1,8 @@ --- id: 65573d0abe4d38cd6fa13f44 -title: Step 89 +title: Step 95 challengeType: 0 -dashedName: step-89 +dashedName: step-95 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6557421eb6a7a0f0500e3106.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6557421eb6a7a0f0500e3106.md index 1fc1a8b74bb..a101c2c0d4d 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6557421eb6a7a0f0500e3106.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6557421eb6a7a0f0500e3106.md @@ -1,8 +1,8 @@ --- id: 6557421eb6a7a0f0500e3106 -title: Step 80 +title: Step 86 challengeType: 0 -dashedName: step-80 +dashedName: step-86 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b49333d9f265bc1512152.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b49333d9f265bc1512152.md index 39bd90f2933..6187db3b0e4 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b49333d9f265bc1512152.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b49333d9f265bc1512152.md @@ -1,8 +1,8 @@ --- id: 655b49333d9f265bc1512152 -title: Step 90 +title: Step 96 challengeType: 0 -dashedName: step-90 +dashedName: step-96 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4bbff1dbf66cb2ed4dac.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4bbff1dbf66cb2ed4dac.md index a1a4fc41f8c..061a369a9d3 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4bbff1dbf66cb2ed4dac.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4bbff1dbf66cb2ed4dac.md @@ -1,8 +1,8 @@ --- id: 655b4bbff1dbf66cb2ed4dac -title: Step 91 +title: Step 97 challengeType: 0 -dashedName: step-91 +dashedName: step-97 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4c8f636d9675953a0388.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4c8f636d9675953a0388.md index c06f31aea50..87b348f66bd 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4c8f636d9675953a0388.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4c8f636d9675953a0388.md @@ -1,8 +1,8 @@ --- id: 655b4c8f636d9675953a0388 -title: Step 92 +title: Step 98 challengeType: 0 -dashedName: step-92 +dashedName: step-98 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4dad1d38ff7cdd65cbfe.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4dad1d38ff7cdd65cbfe.md index 672d419afe0..2c5926da92f 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4dad1d38ff7cdd65cbfe.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/655b4dad1d38ff7cdd65cbfe.md @@ -1,8 +1,8 @@ --- id: 655b4dad1d38ff7cdd65cbfe -title: Step 93 +title: Step 99 challengeType: 0 -dashedName: step-93 +dashedName: step-99 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/656472ed8f552d2f2b3f7883.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/656472ed8f552d2f2b3f7883.md index c90807eb236..481a91c82b8 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/656472ed8f552d2f2b3f7883.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/656472ed8f552d2f2b3f7883.md @@ -1,8 +1,8 @@ --- id: 656472ed8f552d2f2b3f7883 -title: Step 33 +title: Step 39 challengeType: 0 -dashedName: step-33 +dashedName: step-39 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6567055f59d39f07d1c542dc.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6567055f59d39f07d1c542dc.md index ca685f50ff1..29e25cdc4c6 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6567055f59d39f07d1c542dc.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/6567055f59d39f07d1c542dc.md @@ -1,8 +1,8 @@ --- id: 6567055f59d39f07d1c542dc -title: Step 19 +title: Step 25 challengeType: 0 -dashedName: step-19 +dashedName: step-25 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65671421254eeb489875cdd8.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65671421254eeb489875cdd8.md index 0b08662f438..dab7973dac4 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65671421254eeb489875cdd8.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65671421254eeb489875cdd8.md @@ -1,8 +1,8 @@ --- id: 65671421254eeb489875cdd8 -title: Step 58 +title: Step 64 challengeType: 0 -dashedName: step-58 +dashedName: step-64 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65672136535209761a5cf02b.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65672136535209761a5cf02b.md index 8c397c35dbe..25541abaa05 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65672136535209761a5cf02b.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65672136535209761a5cf02b.md @@ -1,8 +1,8 @@ --- id: 65672136535209761a5cf02b -title: Step 39 +title: Step 45 challengeType: 0 -dashedName: step-39 +dashedName: step-45 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65672adafbaa37a6cef886f7.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65672adafbaa37a6cef886f7.md index 0cc1ff99f88..6192911f13b 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65672adafbaa37a6cef886f7.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65672adafbaa37a6cef886f7.md @@ -1,8 +1,8 @@ --- id: 65672adafbaa37a6cef886f7 -title: Step 83 +title: Step 89 challengeType: 0 -dashedName: step-83 +dashedName: step-89 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/657b2b0b6a48071a6db28e7a.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/657b2b0b6a48071a6db28e7a.md index 934df44dd2e..38b7a115d3d 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/657b2b0b6a48071a6db28e7a.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/657b2b0b6a48071a6db28e7a.md @@ -1,8 +1,8 @@ --- id: 657b2b0b6a48071a6db28e7a -title: Step 13 +title: Step 19 challengeType: 0 -dashedName: step-13 +dashedName: step-19 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/659b0093d7db5a1a1122b7bd.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/659b0093d7db5a1a1122b7bd.md index 740ce10c66b..faa26b7ce43 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/659b0093d7db5a1a1122b7bd.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/659b0093d7db5a1a1122b7bd.md @@ -1,8 +1,8 @@ --- id: 659b0093d7db5a1a1122b7bd -title: Step 45 +title: Step 51 challengeType: 0 -dashedName: step-45 +dashedName: step-51 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a608b7e7c75a04ccf0c23c.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a608b7e7c75a04ccf0c23c.md index fac8a35202c..25554837365 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a608b7e7c75a04ccf0c23c.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a608b7e7c75a04ccf0c23c.md @@ -1,8 +1,8 @@ --- id: 65a608b7e7c75a04ccf0c23c -title: Step 22 +title: Step 28 challengeType: 0 -dashedName: step-22 +dashedName: step-28 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a6098a3405f206312e28f5.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a6098a3405f206312e28f5.md index b38e1bf5e9b..38973c57540 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a6098a3405f206312e28f5.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a6098a3405f206312e28f5.md @@ -1,8 +1,8 @@ --- id: 65a6098a3405f206312e28f5 -title: Step 23 +title: Step 29 challengeType: 0 -dashedName: step-23 +dashedName: step-29 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a609f6e23f3b06c608fb57.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a609f6e23f3b06c608fb57.md index ea322701701..b716f51d6a2 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a609f6e23f3b06c608fb57.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a609f6e23f3b06c608fb57.md @@ -1,8 +1,8 @@ --- id: 65a609f6e23f3b06c608fb57 -title: Step 24 +title: Step 30 challengeType: 0 -dashedName: step-24 +dashedName: step-30 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a60aa3efd8fa079c2d1537.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a60aa3efd8fa079c2d1537.md index b5ce8e65211..5780b2eccc7 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a60aa3efd8fa079c2d1537.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a60aa3efd8fa079c2d1537.md @@ -1,8 +1,8 @@ --- id: 65a60aa3efd8fa079c2d1537 -title: Step 25 +title: Step 31 challengeType: 0 -dashedName: step-25 +dashedName: step-31 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a60b0b8b4f96085ac23463.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a60b0b8b4f96085ac23463.md index c0383cfbecf..36810e478c8 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a60b0b8b4f96085ac23463.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65a60b0b8b4f96085ac23463.md @@ -1,8 +1,8 @@ --- id: 65a60b0b8b4f96085ac23463 -title: Step 26 +title: Step 32 challengeType: 0 -dashedName: step-26 +dashedName: step-32 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65c64fe6c770a22db893e931.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65c64fe6c770a22db893e931.md index 0b6d0062ec0..7cef55e88d5 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65c64fe6c770a22db893e931.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65c64fe6c770a22db893e931.md @@ -1,8 +1,8 @@ --- id: 65c64fe6c770a22db893e931 -title: Step 21 +title: Step 27 challengeType: 0 -dashedName: step-21 +dashedName: step-27 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65c6532520cf4f323329b2c6.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65c6532520cf4f323329b2c6.md index a573d4109e4..2b57f128eee 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65c6532520cf4f323329b2c6.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65c6532520cf4f323329b2c6.md @@ -1,8 +1,8 @@ --- id: 65c6532520cf4f323329b2c6 -title: Step 28 +title: Step 34 challengeType: 0 -dashedName: step-28 +dashedName: step-34 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65cf1f2cd796c06057bf3f3c.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65cf1f2cd796c06057bf3f3c.md index 53722f346b7..fce6a067431 100644 --- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65cf1f2cd796c06057bf3f3c.md +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65cf1f2cd796c06057bf3f3c.md @@ -1,8 +1,8 @@ --- id: 65cf1f2cd796c06057bf3f3c -title: Step 27 +title: Step 33 challengeType: 0 -dashedName: step-27 +dashedName: step-33 --- # --description-- diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660ae3eeef9ad289bece426b.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660ae3eeef9ad289bece426b.md new file mode 100644 index 00000000000..26024d48085 --- /dev/null +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660ae3eeef9ad289bece426b.md @@ -0,0 +1,640 @@ +--- +id: 660ae3eeef9ad289bece426b +title: Step 11 +challengeType: 0 +dashedName: step-11 +--- + +# --description-- + +In the previous projects, you used regular functions. But in the rest of the projects, you will be working with arrow functions. The next few steps will focus on teaching you the basics of arrow functions. + +An arrow function is an anonymous function expression and a shorter way to write functions. Anonymous means that the function does not have a name. Arrow functions are always anonymous. + +Here is the basic syntax: + +```js +() => {} +``` + +To create a named arrow function, you can assign the function to a variable: + +```js +const exampleFunction = () => { + // code goes here +} +``` + +Create a new named arrow function called `printGreeting`. Inside the body of that function use the `console.log()` method to print the string `"Hello there!"`. + +# --hints-- + +You should have a function called `printGreeting`. + +```js +assert.isFunction(printGreeting); +``` + +You should use arrow syntax to create the `printGreeting` function. + +```js +assert.match(code, /(let|const)\s+printGreeting\s*=\s*\(.*\)\s*=>\s*{\s*[\s\S]*}\s*;?/) +``` + +Your `printGreeting` function should include a `console.log('Hello there!')`. + +```js +assert.match(printGreeting.toString(), /console\.log\(['"]Hello\s+there!['"]\)/); +``` + +# --seed-- + +## --seed-contents-- + +```html + + + + + + + + + + Learn Basic String and Array Methods by Building a Music Player App + + + + +
+
+
+
+
+
+
+

freeCodeCamp

+
+
+
+
+
+
+
+ song cover art +
+
+
+

+

+
+
+ + + + + +
+
+
+
+
+
+
+
+
+
+

Playlist

+
+
+
+
+
+ +
+
+ + + +``` + +```css +:root { + /* colors */ + --primary-color: #dfdfe2; + --secondary-color: #ffffff; + --app-background-color: #4d4d62; + --background-color: #1b1b32; + --foreground-color: #3b3b4f; + --highlight-color: #f1be32; + + /* font sizes */ + --root-font-size: 16px; + font-size: var(--root-font-size); + + /* font-families */ + --font-headline: "Roboto Mono", monospace; + --font-family: "Lato", sans-serif; +} + +*, +*::after, +*::before { + box-sizing: border-box; +} + +body { + background-color: var(--app-background-color); + color: var(--primary-color); + font-family: var(--font-family); +} + +h1 { + font-size: 1.125rem; + line-height: 1.6; +} + +h2 { + font-size: var(--root-font-size); +} + +ul { + margin: 0; +} + +.container { + margin-top: 10px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + row-gap: 5px; +} + +.player, +.playlist { + width: 450px; + background-color: var(--background-color); + border: 3px solid var(--foreground-color); +} + +.player { + height: 260px; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +.player-bar, +.playlist-bar { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 5px; + width: 100%; + height: 30px; + background-color: var(--foreground-color); +} + +.parallel-lines { + display: flex; + flex-wrap: wrap; + row-gap: 6px; + padding: 0 5px; +} + +.parallel-lines > div { + height: 2px; + width: 100%; + min-width: 75px; + background-color: var(--highlight-color); +} + +.fcc-title, +.playlist-title { + color: var(--secondary-color); + margin: 0 10px; + font-family: var(--font-headline); +} + +.player-content { + display: flex; + background-color: var(--foreground-color); + width: 430px; + height: 200px; + column-gap: 13px; + align-items: center; + justify-content: center; +} + +#player-album-art { + background-color: var(--secondary-color); + border: 6px solid var(--background-color); +} + +#player-album-art img { + width: 150px; + display: block; +} + +.player-display { + display: flex; + flex-direction: column; + row-gap: 20px; + padding: 14px; + background-color: var(--background-color); + height: 153px; + width: 226px; +} + +.player-display-song-artist { + height: 80px; +} + +.player-buttons svg { + fill: var(--primary-color); +} + +.playing > svg { + fill: var(--highlight-color); +} + +.player-buttons { + display: flex; + justify-content: space-around; +} + +button { + background: transparent; + border: none; + color: var(--primary-color); + cursor: pointer; + font-size: var(--root-font-size); + outline-color: var(--highlight-color); + text-align: center; +} + +.playlist-song { + outline-color: var(--highlight-color); +} + +.playlist li:not(:last-child) { + border-bottom: 1px solid var(--background-color); +} + +button:focus, +.playlist-song:focus { + outline-style: dashed; + outline-width: 2px; +} + +/* Playlist */ +.playlist { + height: auto; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +#playlist-songs { + width: 430px; + height: 100%; + background-color: var(--foreground-color); + display: flex; + flex-direction: column; + row-gap: 8px; + padding: 8px 9px; + visibility: visible; + justify-content: start; + list-style: none; +} + +.playlist-song { + display: flex; + height: 55px; + justify-content: space-between; + align-items: center; + padding: 5px; +} + +[aria-current="true"] { + background-color: var(--background-color); +} + +[aria-current="true"] p { + color: var(--highlight-color); +} + +.playlist-song-info { + height: 100%; + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-around; + column-gap: 7px; + padding: 5px 0; + font-family: var(--font-family); +} + +#player-song-title, +#player-song-artist { + margin: 0; +} + +#player-song-artist { + color: var(--highlight-color); + font-size: 0.75rem; +} + +#player-song-title { + font-size: 1.125rem; +} + +.playlist-song-title { + font-size: 0.85rem; + width: 241px; + text-align: left; +} + +.playlist-song-artist { + font-size: 0.725rem; + width: 80px; +} + +.playlist-song-duration { + font-size: 0.725rem; + margin: auto; + font-family: var(--font-headline); + width: 30px; +} + +.playlist-song-delete { + padding: 0; + width: 20px; + height: 20px; +} + +.playlist-song-delete, +.playlist-song-delete { + fill: var(--foreground-color); +} + +.playlist-song-delete:hover circle, +.playlist-song-delete:focus circle { + fill: #ff0000; +} + +@media (max-width: 700px) { + .player, + .playlist { + width: 300px; + } + + .player { + height: 340px; + } + + #playlist-songs { + height: 280px; + padding: 5px 6px; + overflow-y: scroll; + overflow-x: hidden; + scrollbar-color: var(--background-color) var(--secondary-color); + scrollbar-width: thin; + } + + #playlist-songs::-webkit-scrollbar { + width: 5px; + } + + #playlist-songs::-webkit-scrollbar-track { + background: var(--background-color); + } + + #playlist-songs::-webkit-scrollbar-thumb { + background: var(--secondary-color); + } + + h1 { + font-size: 0.813rem; + } + + h2 { + font-size: 0.75rem; + } + + .player-bar, + .playlist-bar, + .player-content, + #playlist-songs { + width: 280px; + } + + .playlist-song { + justify-content: space-between; + } + + .playlist-song-title { + width: 140px; + } + + .playlist-song-artist { + width: 40px; + } + + .playlist-song-duration > button { + padding: 0; + } + + .player-content { + display: inline; + position: relative; + justify-items: center; + height: 100%; + } + + #player-album-art { + z-index: -100; + height: 280px; + box-shadow: none; + background: #000; + } + + #player-album-art img { + width: 100%; + opacity: 0.6; + } + + .player-display-song-artist { + padding: 0 10px; + } + + .player-display-song-artist > p { + white-space: pre-wrap; + } + + .player-display { + position: absolute; + width: 100%; + z-index: 1000; + background-color: transparent; + top: 0; + height: 280px; + justify-content: space-between; + text-align: center; + } +} +``` + +```js +const playlistSongs = document.getElementById("playlist-songs"); +const playButton = document.getElementById("play"); +const pauseButton = document.getElementById("pause"); +const nextButton = document.getElementById("next"); +const previousButton = document.getElementById("previous"); +const shuffleButton = document.getElementById("shuffle"); + +const allSongs = [ + { + id: 0, + title: "Scratching The Surface", + artist: "Quincy Larson", + duration: "4:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/scratching-the-surface.mp3", + }, + { + id: 1, + title: "Can't Stay Down", + artist: "Quincy Larson", + duration: "4:15", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stay-down.mp3", + }, + { + id: 2, + title: "Still Learning", + artist: "Quincy Larson", + duration: "3:51", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/still-learning.mp3", + }, + { + id: 3, + title: "Cruising for a Musing", + artist: "Quincy Larson", + duration: "3:34", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cruising-for-a-musing.mp3", + }, + { + id: 4, + title: "Never Not Favored", + artist: "Quincy Larson", + duration: "3:35", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/never-not-favored.mp3", + }, + { + id: 5, + title: "From the Ground Up", + artist: "Quincy Larson", + duration: "3:12", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/from-the-ground-up.mp3", + }, + { + id: 6, + title: "Walking on Air", + artist: "Quincy Larson", + duration: "3:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/walking-on-air.mp3", + }, + { + id: 7, + title: "Can't Stop Me. Can't Even Slow Me Down.", + artist: "Quincy Larson", + duration: "3:52", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stop-me-cant-even-slow-me-down.mp3", + }, + { + id: 8, + title: "The Surest Way Out is Through", + artist: "Quincy Larson", + duration: "3:10", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/the-surest-way-out-is-through.mp3", + }, + { + id: 9, + title: "Chasing That Feeling", + artist: "Quincy Larson", + duration: "2:43", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/chasing-that-feeling.mp3", + }, +]; + +const audio = new Audio(); +let userData = { + songs: [...allSongs], + currentSong: null, + songCurrentTime: 0, +}; + +--fcc-editable-region-- + +--fcc-editable-region-- +``` diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660ae8ad1475698da3c3c37d.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660ae8ad1475698da3c3c37d.md new file mode 100644 index 00000000000..f03874ffebc --- /dev/null +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660ae8ad1475698da3c3c37d.md @@ -0,0 +1,625 @@ +--- +id: 660ae8ad1475698da3c3c37d +title: Step 12 +challengeType: 0 +dashedName: step-12 +--- + +# --description-- + +To call a named arrow function expression, you can reference the function by its name. + +```js +exampleArrowFunction(); +``` + +Below your `printGreeting` function definition, call the function. Open up the console to see the output. + +# --hints-- + +You should call your `printGreeting` function. + +```js +assert.match(code, /printGreeting\(\);?/); +``` + +Your `printGreeting` function call should be below the `printGreeting` function definition. + +```js +assert.isBelow(code.indexOf("const printGreeting = () => {"), code.indexOf("printGreeting()")); +``` + +# --seed-- + +## --seed-contents-- + +```html + + + + + + + + + + Learn Basic String and Array Methods by Building a Music Player App + + + + +
+
+
+
+
+
+
+

freeCodeCamp

+
+
+
+
+
+
+
+ song cover art +
+
+
+

+

+
+
+ + + + + +
+
+
+
+
+
+
+
+
+
+

Playlist

+
+
+
+
+
+ +
+
+ + + +``` + +```css +:root { + /* colors */ + --primary-color: #dfdfe2; + --secondary-color: #ffffff; + --app-background-color: #4d4d62; + --background-color: #1b1b32; + --foreground-color: #3b3b4f; + --highlight-color: #f1be32; + + /* font sizes */ + --root-font-size: 16px; + font-size: var(--root-font-size); + + /* font-families */ + --font-headline: "Roboto Mono", monospace; + --font-family: "Lato", sans-serif; +} + +*, +*::after, +*::before { + box-sizing: border-box; +} + +body { + background-color: var(--app-background-color); + color: var(--primary-color); + font-family: var(--font-family); +} + +h1 { + font-size: 1.125rem; + line-height: 1.6; +} + +h2 { + font-size: var(--root-font-size); +} + +ul { + margin: 0; +} + +.container { + margin-top: 10px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + row-gap: 5px; +} + +.player, +.playlist { + width: 450px; + background-color: var(--background-color); + border: 3px solid var(--foreground-color); +} + +.player { + height: 260px; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +.player-bar, +.playlist-bar { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 5px; + width: 100%; + height: 30px; + background-color: var(--foreground-color); +} + +.parallel-lines { + display: flex; + flex-wrap: wrap; + row-gap: 6px; + padding: 0 5px; +} + +.parallel-lines > div { + height: 2px; + width: 100%; + min-width: 75px; + background-color: var(--highlight-color); +} + +.fcc-title, +.playlist-title { + color: var(--secondary-color); + margin: 0 10px; + font-family: var(--font-headline); +} + +.player-content { + display: flex; + background-color: var(--foreground-color); + width: 430px; + height: 200px; + column-gap: 13px; + align-items: center; + justify-content: center; +} + +#player-album-art { + background-color: var(--secondary-color); + border: 6px solid var(--background-color); +} + +#player-album-art img { + width: 150px; + display: block; +} + +.player-display { + display: flex; + flex-direction: column; + row-gap: 20px; + padding: 14px; + background-color: var(--background-color); + height: 153px; + width: 226px; +} + +.player-display-song-artist { + height: 80px; +} + +.player-buttons svg { + fill: var(--primary-color); +} + +.playing > svg { + fill: var(--highlight-color); +} + +.player-buttons { + display: flex; + justify-content: space-around; +} + +button { + background: transparent; + border: none; + color: var(--primary-color); + cursor: pointer; + font-size: var(--root-font-size); + outline-color: var(--highlight-color); + text-align: center; +} + +.playlist-song { + outline-color: var(--highlight-color); +} + +.playlist li:not(:last-child) { + border-bottom: 1px solid var(--background-color); +} + +button:focus, +.playlist-song:focus { + outline-style: dashed; + outline-width: 2px; +} + +/* Playlist */ +.playlist { + height: auto; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +#playlist-songs { + width: 430px; + height: 100%; + background-color: var(--foreground-color); + display: flex; + flex-direction: column; + row-gap: 8px; + padding: 8px 9px; + visibility: visible; + justify-content: start; + list-style: none; +} + +.playlist-song { + display: flex; + height: 55px; + justify-content: space-between; + align-items: center; + padding: 5px; +} + +[aria-current="true"] { + background-color: var(--background-color); +} + +[aria-current="true"] p { + color: var(--highlight-color); +} + +.playlist-song-info { + height: 100%; + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-around; + column-gap: 7px; + padding: 5px 0; + font-family: var(--font-family); +} + +#player-song-title, +#player-song-artist { + margin: 0; +} + +#player-song-artist { + color: var(--highlight-color); + font-size: 0.75rem; +} + +#player-song-title { + font-size: 1.125rem; +} + +.playlist-song-title { + font-size: 0.85rem; + width: 241px; + text-align: left; +} + +.playlist-song-artist { + font-size: 0.725rem; + width: 80px; +} + +.playlist-song-duration { + font-size: 0.725rem; + margin: auto; + font-family: var(--font-headline); + width: 30px; +} + +.playlist-song-delete { + padding: 0; + width: 20px; + height: 20px; +} + +.playlist-song-delete, +.playlist-song-delete { + fill: var(--foreground-color); +} + +.playlist-song-delete:hover circle, +.playlist-song-delete:focus circle { + fill: #ff0000; +} + +@media (max-width: 700px) { + .player, + .playlist { + width: 300px; + } + + .player { + height: 340px; + } + + #playlist-songs { + height: 280px; + padding: 5px 6px; + overflow-y: scroll; + overflow-x: hidden; + scrollbar-color: var(--background-color) var(--secondary-color); + scrollbar-width: thin; + } + + #playlist-songs::-webkit-scrollbar { + width: 5px; + } + + #playlist-songs::-webkit-scrollbar-track { + background: var(--background-color); + } + + #playlist-songs::-webkit-scrollbar-thumb { + background: var(--secondary-color); + } + + h1 { + font-size: 0.813rem; + } + + h2 { + font-size: 0.75rem; + } + + .player-bar, + .playlist-bar, + .player-content, + #playlist-songs { + width: 280px; + } + + .playlist-song { + justify-content: space-between; + } + + .playlist-song-title { + width: 140px; + } + + .playlist-song-artist { + width: 40px; + } + + .playlist-song-duration > button { + padding: 0; + } + + .player-content { + display: inline; + position: relative; + justify-items: center; + height: 100%; + } + + #player-album-art { + z-index: -100; + height: 280px; + box-shadow: none; + background: #000; + } + + #player-album-art img { + width: 100%; + opacity: 0.6; + } + + .player-display-song-artist { + padding: 0 10px; + } + + .player-display-song-artist > p { + white-space: pre-wrap; + } + + .player-display { + position: absolute; + width: 100%; + z-index: 1000; + background-color: transparent; + top: 0; + height: 280px; + justify-content: space-between; + text-align: center; + } +} +``` + +```js +const playlistSongs = document.getElementById("playlist-songs"); +const playButton = document.getElementById("play"); +const pauseButton = document.getElementById("pause"); +const nextButton = document.getElementById("next"); +const previousButton = document.getElementById("previous"); +const shuffleButton = document.getElementById("shuffle"); + +const allSongs = [ + { + id: 0, + title: "Scratching The Surface", + artist: "Quincy Larson", + duration: "4:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/scratching-the-surface.mp3", + }, + { + id: 1, + title: "Can't Stay Down", + artist: "Quincy Larson", + duration: "4:15", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stay-down.mp3", + }, + { + id: 2, + title: "Still Learning", + artist: "Quincy Larson", + duration: "3:51", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/still-learning.mp3", + }, + { + id: 3, + title: "Cruising for a Musing", + artist: "Quincy Larson", + duration: "3:34", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cruising-for-a-musing.mp3", + }, + { + id: 4, + title: "Never Not Favored", + artist: "Quincy Larson", + duration: "3:35", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/never-not-favored.mp3", + }, + { + id: 5, + title: "From the Ground Up", + artist: "Quincy Larson", + duration: "3:12", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/from-the-ground-up.mp3", + }, + { + id: 6, + title: "Walking on Air", + artist: "Quincy Larson", + duration: "3:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/walking-on-air.mp3", + }, + { + id: 7, + title: "Can't Stop Me. Can't Even Slow Me Down.", + artist: "Quincy Larson", + duration: "3:52", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stop-me-cant-even-slow-me-down.mp3", + }, + { + id: 8, + title: "The Surest Way Out is Through", + artist: "Quincy Larson", + duration: "3:10", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/the-surest-way-out-is-through.mp3", + }, + { + id: 9, + title: "Chasing That Feeling", + artist: "Quincy Larson", + duration: "2:43", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/chasing-that-feeling.mp3", + }, +]; + +const audio = new Audio(); +let userData = { + songs: [...allSongs], + currentSong: null, + songCurrentTime: 0, +}; + +--fcc-editable-region-- +const printGreeting = () => { + console.log('Hello there!'); +} + +--fcc-editable-region-- +``` diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660aea8782242e8f4bcc42d8.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660aea8782242e8f4bcc42d8.md new file mode 100644 index 00000000000..cd74e38d4ce --- /dev/null +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660aea8782242e8f4bcc42d8.md @@ -0,0 +1,677 @@ +--- +id: 660aea8782242e8f4bcc42d8 +title: Step 13 +challengeType: 0 +dashedName: step-13 +--- + +# --description-- + +Just like regular functions, arrow functions can accept multiple parameters. + +Here is an example of a named arrow function with one parameter: + +```js +const greet = (name) => { + console.log(`Hello, ${name}!`); +}; +``` + +If the function only has one parameter, you can omit the parentheses around the parameter list like this: + +```js +const greet = name => { + console.log(`Hello, ${name}!`); +}; +``` + +Create a new named arrow function called `printMessage` that has one parameter called `org`. Inside the body of that function, add a console statement. Inside that console statement, add the template literal `${org} is awesome!`. + +Below your `printMessage` function, call the function and pass in the string `"freeCodeCamp"` as an argument. + +Open up the console to see the result. + +# --hints-- + +You should have a `printMessage` function. + +```js +assert.isFunction(printMessage); +``` + +You should use arrow function syntax. + +```js +assert.match(code, /(let|const)\s+printMessage\s*=\s*?\(?.*?\)?\s*=>\s*{\s*[\s\S]*}\s*;?/); +``` + +Your `printMessage` function should have a parameter called `org`. + +```js +assert.match(code, /(let|const)\s+printMessage\s*=\s*?\(?org?\)?\s*=>\s*{\s*[\s\S]*}\s*;?/) + +``` + +Your `printMessage` function should have a console statement. + +```js +assert.match(printMessage.toString(),/console\.log\(/); +``` + +Your console statement should include the template literal `${org} is awesome!`. + +```js +assert.match(code, /console\.log\(\s*`[^`]*\${org} is awesome![^`]*`\s*\)/); +``` + +You should call the `printMessage` function and pass in the string `"freeCodeCamp"`. + +```js +assert.match(code,/printMessage\(\s*["']freeCodeCamp["']\s*\)/); +``` + +Your function call should be below your `printMessage` function definition. + +```js +const functionCall = code.indexOf("printMessage("); +const functionDefinition = code.indexOf("printMessage ="); + +assert.isBelow(functionDefinition, functionCall); +``` + +# --seed-- + +## --seed-contents-- + +```html + + + + + + + + + + Learn Basic String and Array Methods by Building a Music Player App + + + + +
+
+
+
+
+
+
+

freeCodeCamp

+
+
+
+
+
+
+
+ song cover art +
+
+
+

+

+
+
+ + + + + +
+
+
+
+
+
+
+
+
+
+

Playlist

+
+
+
+
+
+ +
+
+ + + +``` + +```css +:root { + /* colors */ + --primary-color: #dfdfe2; + --secondary-color: #ffffff; + --app-background-color: #4d4d62; + --background-color: #1b1b32; + --foreground-color: #3b3b4f; + --highlight-color: #f1be32; + + /* font sizes */ + --root-font-size: 16px; + font-size: var(--root-font-size); + + /* font-families */ + --font-headline: "Roboto Mono", monospace; + --font-family: "Lato", sans-serif; +} + +*, +*::after, +*::before { + box-sizing: border-box; +} + +body { + background-color: var(--app-background-color); + color: var(--primary-color); + font-family: var(--font-family); +} + +h1 { + font-size: 1.125rem; + line-height: 1.6; +} + +h2 { + font-size: var(--root-font-size); +} + +ul { + margin: 0; +} + +.container { + margin-top: 10px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + row-gap: 5px; +} + +.player, +.playlist { + width: 450px; + background-color: var(--background-color); + border: 3px solid var(--foreground-color); +} + +.player { + height: 260px; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +.player-bar, +.playlist-bar { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 5px; + width: 100%; + height: 30px; + background-color: var(--foreground-color); +} + +.parallel-lines { + display: flex; + flex-wrap: wrap; + row-gap: 6px; + padding: 0 5px; +} + +.parallel-lines > div { + height: 2px; + width: 100%; + min-width: 75px; + background-color: var(--highlight-color); +} + +.fcc-title, +.playlist-title { + color: var(--secondary-color); + margin: 0 10px; + font-family: var(--font-headline); +} + +.player-content { + display: flex; + background-color: var(--foreground-color); + width: 430px; + height: 200px; + column-gap: 13px; + align-items: center; + justify-content: center; +} + +#player-album-art { + background-color: var(--secondary-color); + border: 6px solid var(--background-color); +} + +#player-album-art img { + width: 150px; + display: block; +} + +.player-display { + display: flex; + flex-direction: column; + row-gap: 20px; + padding: 14px; + background-color: var(--background-color); + height: 153px; + width: 226px; +} + +.player-display-song-artist { + height: 80px; +} + +.player-buttons svg { + fill: var(--primary-color); +} + +.playing > svg { + fill: var(--highlight-color); +} + +.player-buttons { + display: flex; + justify-content: space-around; +} + +button { + background: transparent; + border: none; + color: var(--primary-color); + cursor: pointer; + font-size: var(--root-font-size); + outline-color: var(--highlight-color); + text-align: center; +} + +.playlist-song { + outline-color: var(--highlight-color); +} + +.playlist li:not(:last-child) { + border-bottom: 1px solid var(--background-color); +} + +button:focus, +.playlist-song:focus { + outline-style: dashed; + outline-width: 2px; +} + +/* Playlist */ +.playlist { + height: auto; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +#playlist-songs { + width: 430px; + height: 100%; + background-color: var(--foreground-color); + display: flex; + flex-direction: column; + row-gap: 8px; + padding: 8px 9px; + visibility: visible; + justify-content: start; + list-style: none; +} + +.playlist-song { + display: flex; + height: 55px; + justify-content: space-between; + align-items: center; + padding: 5px; +} + +[aria-current="true"] { + background-color: var(--background-color); +} + +[aria-current="true"] p { + color: var(--highlight-color); +} + +.playlist-song-info { + height: 100%; + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-around; + column-gap: 7px; + padding: 5px 0; + font-family: var(--font-family); +} + +#player-song-title, +#player-song-artist { + margin: 0; +} + +#player-song-artist { + color: var(--highlight-color); + font-size: 0.75rem; +} + +#player-song-title { + font-size: 1.125rem; +} + +.playlist-song-title { + font-size: 0.85rem; + width: 241px; + text-align: left; +} + +.playlist-song-artist { + font-size: 0.725rem; + width: 80px; +} + +.playlist-song-duration { + font-size: 0.725rem; + margin: auto; + font-family: var(--font-headline); + width: 30px; +} + +.playlist-song-delete { + padding: 0; + width: 20px; + height: 20px; +} + +.playlist-song-delete, +.playlist-song-delete { + fill: var(--foreground-color); +} + +.playlist-song-delete:hover circle, +.playlist-song-delete:focus circle { + fill: #ff0000; +} + +@media (max-width: 700px) { + .player, + .playlist { + width: 300px; + } + + .player { + height: 340px; + } + + #playlist-songs { + height: 280px; + padding: 5px 6px; + overflow-y: scroll; + overflow-x: hidden; + scrollbar-color: var(--background-color) var(--secondary-color); + scrollbar-width: thin; + } + + #playlist-songs::-webkit-scrollbar { + width: 5px; + } + + #playlist-songs::-webkit-scrollbar-track { + background: var(--background-color); + } + + #playlist-songs::-webkit-scrollbar-thumb { + background: var(--secondary-color); + } + + h1 { + font-size: 0.813rem; + } + + h2 { + font-size: 0.75rem; + } + + .player-bar, + .playlist-bar, + .player-content, + #playlist-songs { + width: 280px; + } + + .playlist-song { + justify-content: space-between; + } + + .playlist-song-title { + width: 140px; + } + + .playlist-song-artist { + width: 40px; + } + + .playlist-song-duration > button { + padding: 0; + } + + .player-content { + display: inline; + position: relative; + justify-items: center; + height: 100%; + } + + #player-album-art { + z-index: -100; + height: 280px; + box-shadow: none; + background: #000; + } + + #player-album-art img { + width: 100%; + opacity: 0.6; + } + + .player-display-song-artist { + padding: 0 10px; + } + + .player-display-song-artist > p { + white-space: pre-wrap; + } + + .player-display { + position: absolute; + width: 100%; + z-index: 1000; + background-color: transparent; + top: 0; + height: 280px; + justify-content: space-between; + text-align: center; + } +} +``` + +```js +const playlistSongs = document.getElementById("playlist-songs"); +const playButton = document.getElementById("play"); +const pauseButton = document.getElementById("pause"); +const nextButton = document.getElementById("next"); +const previousButton = document.getElementById("previous"); +const shuffleButton = document.getElementById("shuffle"); + +const allSongs = [ + { + id: 0, + title: "Scratching The Surface", + artist: "Quincy Larson", + duration: "4:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/scratching-the-surface.mp3", + }, + { + id: 1, + title: "Can't Stay Down", + artist: "Quincy Larson", + duration: "4:15", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stay-down.mp3", + }, + { + id: 2, + title: "Still Learning", + artist: "Quincy Larson", + duration: "3:51", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/still-learning.mp3", + }, + { + id: 3, + title: "Cruising for a Musing", + artist: "Quincy Larson", + duration: "3:34", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cruising-for-a-musing.mp3", + }, + { + id: 4, + title: "Never Not Favored", + artist: "Quincy Larson", + duration: "3:35", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/never-not-favored.mp3", + }, + { + id: 5, + title: "From the Ground Up", + artist: "Quincy Larson", + duration: "3:12", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/from-the-ground-up.mp3", + }, + { + id: 6, + title: "Walking on Air", + artist: "Quincy Larson", + duration: "3:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/walking-on-air.mp3", + }, + { + id: 7, + title: "Can't Stop Me. Can't Even Slow Me Down.", + artist: "Quincy Larson", + duration: "3:52", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stop-me-cant-even-slow-me-down.mp3", + }, + { + id: 8, + title: "The Surest Way Out is Through", + artist: "Quincy Larson", + duration: "3:10", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/the-surest-way-out-is-through.mp3", + }, + { + id: 9, + title: "Chasing That Feeling", + artist: "Quincy Larson", + duration: "2:43", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/chasing-that-feeling.mp3", + }, +]; + +const audio = new Audio(); +let userData = { + songs: [...allSongs], + currentSong: null, + songCurrentTime: 0, +}; + +const printGreeting = () => { + console.log('Hello there!'); +} + +printGreeting(); +--fcc-editable-region-- + +--fcc-editable-region-- +``` diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660aef1d5bd6c092f1931830.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660aef1d5bd6c092f1931830.md new file mode 100644 index 00000000000..f4197152f74 --- /dev/null +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660aef1d5bd6c092f1931830.md @@ -0,0 +1,662 @@ +--- +id: 660aef1d5bd6c092f1931830 +title: Step 14 +challengeType: 0 +dashedName: step-14 +--- + +# --description-- + +Just like regular functions, arrow functions can return values. + +Here is an example of an arrow function returning the result of multiplying two numbers: + +```js +const multiplyTwoNumbers = (num1, num2) => { + return num1 * num2; +} + +// Output: 12 +console.log(multiplyTwoNumbers(3, 4)); +``` + +Create a new variable called `addTwoNumbers` and assign it an arrow function. This arrow function should take two parameters called `num1` and `num2`. Inside the body of the function, return the expression of adding `num1` and `num2`. + +Below the `addTwoNumbers` function, add a console statement. Inside that console statement, call the `addTwoNumbers` function and pass in the numbers `3` and `4` as arguments. + +Open up the console to see the output. + +# --hints-- + +You should have a function called `addTwoNumbers`. + +```js +assert.isFunction(addTwoNumbers); +``` + +Your `addTwoNumbers` function should use arrow function syntax. + +```js +assert.match(code, /(let|const)\s+addTwoNumbers\s*=\s*?\(?.*?\)?\s*=>\s*{\s*[\s\S]*}\s*;?/); +``` + +Your `addTwoNumbers` function should have two parameters called `num1` and `num2`. + +```js +assert.match(addTwoNumbers.toString(), /\(num1,\s*num2\)/); +``` + +Your `addTwoNumbers` function should return the expression of adding `num1` and `num2`. + +```js +assert.match(addTwoNumbers.toString(), /return\s+num1\s*\+\s*num2/); +``` + +You should have a `console.log(addTwoNumbers(3, 4));` statement. + +```js +assert.match(code, /console\.log\(addTwoNumbers\(3,\s*4\)\);?/); +``` + +# --seed-- + +## --seed-contents-- + +```html + + + + + + + + + + Learn Basic String and Array Methods by Building a Music Player App + + + + +
+
+
+
+
+
+
+

freeCodeCamp

+
+
+
+
+
+
+
+ song cover art +
+
+
+

+

+
+
+ + + + + +
+
+
+
+
+
+
+
+
+
+

Playlist

+
+
+
+
+
+ +
+
+ + + +``` + +```css +:root { + /* colors */ + --primary-color: #dfdfe2; + --secondary-color: #ffffff; + --app-background-color: #4d4d62; + --background-color: #1b1b32; + --foreground-color: #3b3b4f; + --highlight-color: #f1be32; + + /* font sizes */ + --root-font-size: 16px; + font-size: var(--root-font-size); + + /* font-families */ + --font-headline: "Roboto Mono", monospace; + --font-family: "Lato", sans-serif; +} + +*, +*::after, +*::before { + box-sizing: border-box; +} + +body { + background-color: var(--app-background-color); + color: var(--primary-color); + font-family: var(--font-family); +} + +h1 { + font-size: 1.125rem; + line-height: 1.6; +} + +h2 { + font-size: var(--root-font-size); +} + +ul { + margin: 0; +} + +.container { + margin-top: 10px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + row-gap: 5px; +} + +.player, +.playlist { + width: 450px; + background-color: var(--background-color); + border: 3px solid var(--foreground-color); +} + +.player { + height: 260px; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +.player-bar, +.playlist-bar { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 5px; + width: 100%; + height: 30px; + background-color: var(--foreground-color); +} + +.parallel-lines { + display: flex; + flex-wrap: wrap; + row-gap: 6px; + padding: 0 5px; +} + +.parallel-lines > div { + height: 2px; + width: 100%; + min-width: 75px; + background-color: var(--highlight-color); +} + +.fcc-title, +.playlist-title { + color: var(--secondary-color); + margin: 0 10px; + font-family: var(--font-headline); +} + +.player-content { + display: flex; + background-color: var(--foreground-color); + width: 430px; + height: 200px; + column-gap: 13px; + align-items: center; + justify-content: center; +} + +#player-album-art { + background-color: var(--secondary-color); + border: 6px solid var(--background-color); +} + +#player-album-art img { + width: 150px; + display: block; +} + +.player-display { + display: flex; + flex-direction: column; + row-gap: 20px; + padding: 14px; + background-color: var(--background-color); + height: 153px; + width: 226px; +} + +.player-display-song-artist { + height: 80px; +} + +.player-buttons svg { + fill: var(--primary-color); +} + +.playing > svg { + fill: var(--highlight-color); +} + +.player-buttons { + display: flex; + justify-content: space-around; +} + +button { + background: transparent; + border: none; + color: var(--primary-color); + cursor: pointer; + font-size: var(--root-font-size); + outline-color: var(--highlight-color); + text-align: center; +} + +.playlist-song { + outline-color: var(--highlight-color); +} + +.playlist li:not(:last-child) { + border-bottom: 1px solid var(--background-color); +} + +button:focus, +.playlist-song:focus { + outline-style: dashed; + outline-width: 2px; +} + +/* Playlist */ +.playlist { + height: auto; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +#playlist-songs { + width: 430px; + height: 100%; + background-color: var(--foreground-color); + display: flex; + flex-direction: column; + row-gap: 8px; + padding: 8px 9px; + visibility: visible; + justify-content: start; + list-style: none; +} + +.playlist-song { + display: flex; + height: 55px; + justify-content: space-between; + align-items: center; + padding: 5px; +} + +[aria-current="true"] { + background-color: var(--background-color); +} + +[aria-current="true"] p { + color: var(--highlight-color); +} + +.playlist-song-info { + height: 100%; + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-around; + column-gap: 7px; + padding: 5px 0; + font-family: var(--font-family); +} + +#player-song-title, +#player-song-artist { + margin: 0; +} + +#player-song-artist { + color: var(--highlight-color); + font-size: 0.75rem; +} + +#player-song-title { + font-size: 1.125rem; +} + +.playlist-song-title { + font-size: 0.85rem; + width: 241px; + text-align: left; +} + +.playlist-song-artist { + font-size: 0.725rem; + width: 80px; +} + +.playlist-song-duration { + font-size: 0.725rem; + margin: auto; + font-family: var(--font-headline); + width: 30px; +} + +.playlist-song-delete { + padding: 0; + width: 20px; + height: 20px; +} + +.playlist-song-delete, +.playlist-song-delete { + fill: var(--foreground-color); +} + +.playlist-song-delete:hover circle, +.playlist-song-delete:focus circle { + fill: #ff0000; +} + +@media (max-width: 700px) { + .player, + .playlist { + width: 300px; + } + + .player { + height: 340px; + } + + #playlist-songs { + height: 280px; + padding: 5px 6px; + overflow-y: scroll; + overflow-x: hidden; + scrollbar-color: var(--background-color) var(--secondary-color); + scrollbar-width: thin; + } + + #playlist-songs::-webkit-scrollbar { + width: 5px; + } + + #playlist-songs::-webkit-scrollbar-track { + background: var(--background-color); + } + + #playlist-songs::-webkit-scrollbar-thumb { + background: var(--secondary-color); + } + + h1 { + font-size: 0.813rem; + } + + h2 { + font-size: 0.75rem; + } + + .player-bar, + .playlist-bar, + .player-content, + #playlist-songs { + width: 280px; + } + + .playlist-song { + justify-content: space-between; + } + + .playlist-song-title { + width: 140px; + } + + .playlist-song-artist { + width: 40px; + } + + .playlist-song-duration > button { + padding: 0; + } + + .player-content { + display: inline; + position: relative; + justify-items: center; + height: 100%; + } + + #player-album-art { + z-index: -100; + height: 280px; + box-shadow: none; + background: #000; + } + + #player-album-art img { + width: 100%; + opacity: 0.6; + } + + .player-display-song-artist { + padding: 0 10px; + } + + .player-display-song-artist > p { + white-space: pre-wrap; + } + + .player-display { + position: absolute; + width: 100%; + z-index: 1000; + background-color: transparent; + top: 0; + height: 280px; + justify-content: space-between; + text-align: center; + } +} +``` + +```js +const playlistSongs = document.getElementById("playlist-songs"); +const playButton = document.getElementById("play"); +const pauseButton = document.getElementById("pause"); +const nextButton = document.getElementById("next"); +const previousButton = document.getElementById("previous"); +const shuffleButton = document.getElementById("shuffle"); + +const allSongs = [ + { + id: 0, + title: "Scratching The Surface", + artist: "Quincy Larson", + duration: "4:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/scratching-the-surface.mp3", + }, + { + id: 1, + title: "Can't Stay Down", + artist: "Quincy Larson", + duration: "4:15", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stay-down.mp3", + }, + { + id: 2, + title: "Still Learning", + artist: "Quincy Larson", + duration: "3:51", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/still-learning.mp3", + }, + { + id: 3, + title: "Cruising for a Musing", + artist: "Quincy Larson", + duration: "3:34", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cruising-for-a-musing.mp3", + }, + { + id: 4, + title: "Never Not Favored", + artist: "Quincy Larson", + duration: "3:35", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/never-not-favored.mp3", + }, + { + id: 5, + title: "From the Ground Up", + artist: "Quincy Larson", + duration: "3:12", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/from-the-ground-up.mp3", + }, + { + id: 6, + title: "Walking on Air", + artist: "Quincy Larson", + duration: "3:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/walking-on-air.mp3", + }, + { + id: 7, + title: "Can't Stop Me. Can't Even Slow Me Down.", + artist: "Quincy Larson", + duration: "3:52", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stop-me-cant-even-slow-me-down.mp3", + }, + { + id: 8, + title: "The Surest Way Out is Through", + artist: "Quincy Larson", + duration: "3:10", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/the-surest-way-out-is-through.mp3", + }, + { + id: 9, + title: "Chasing That Feeling", + artist: "Quincy Larson", + duration: "2:43", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/chasing-that-feeling.mp3", + }, +]; + +const audio = new Audio(); +let userData = { + songs: [...allSongs], + currentSong: null, + songCurrentTime: 0, +}; + +const printGreeting = () => { + console.log('Hello there!'); +} + +printGreeting(); + +const printMessage = org => { + console.log(`${org} is awesome!`); +} + +printMessage('freeCodeCamp'); +--fcc-editable-region-- + +--fcc-editable-region-- +``` diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660af2b86c0fca95f7570fc5.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660af2b86c0fca95f7570fc5.md new file mode 100644 index 00000000000..5bd43dcb657 --- /dev/null +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660af2b86c0fca95f7570fc5.md @@ -0,0 +1,642 @@ +--- +id: 660af2b86c0fca95f7570fc5 +title: Step 15 +challengeType: 0 +dashedName: step-15 +--- + +# --description-- + +If the arrow function is returning a simple expression, you can omit the `return` keyword and the curly braces `{}`. This is called an implicit return. + +```js +const multiplyTwoNumbers = (num1, num2) => num1 * num2; +``` + +If your arrow function has multiple lines of code in the function body, then you need to use the `return` keyword and the curly braces `{}`. + +```js +const getTax = (price) => { + const taxRate = 0.08; + const tax = price * taxRate; + return tax; +}; +``` + +Refactor, or update, your `addTwoNumbers` function to remove the `return` keyword and the curly braces `{}`. Your `addTwoNumbers` function should instead use an implicit return. + +Open up the console to make sure that you are still getting the correct output. + +# --hints-- + +Your refactored `addTwoNumbers` function should use an implicit return. + +```js +assert.match(code, /(let|const)\s+addTwoNumbers\s*=\s*\(\s*num1\s*,\s*num2\s*\)\s*=>\s*num1\s*\+\s*num2\s*;?/); +``` + +# --seed-- + +## --seed-contents-- + +```html + + + + + + + + + + Learn Basic String and Array Methods by Building a Music Player App + + + + +
+
+
+
+
+
+
+

freeCodeCamp

+
+
+
+
+
+
+
+ song cover art +
+
+
+

+

+
+
+ + + + + +
+
+
+
+
+
+
+
+
+
+

Playlist

+
+
+
+
+
+ +
+
+ + + +``` + +```css +:root { + /* colors */ + --primary-color: #dfdfe2; + --secondary-color: #ffffff; + --app-background-color: #4d4d62; + --background-color: #1b1b32; + --foreground-color: #3b3b4f; + --highlight-color: #f1be32; + + /* font sizes */ + --root-font-size: 16px; + font-size: var(--root-font-size); + + /* font-families */ + --font-headline: "Roboto Mono", monospace; + --font-family: "Lato", sans-serif; +} + +*, +*::after, +*::before { + box-sizing: border-box; +} + +body { + background-color: var(--app-background-color); + color: var(--primary-color); + font-family: var(--font-family); +} + +h1 { + font-size: 1.125rem; + line-height: 1.6; +} + +h2 { + font-size: var(--root-font-size); +} + +ul { + margin: 0; +} + +.container { + margin-top: 10px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + row-gap: 5px; +} + +.player, +.playlist { + width: 450px; + background-color: var(--background-color); + border: 3px solid var(--foreground-color); +} + +.player { + height: 260px; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +.player-bar, +.playlist-bar { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 5px; + width: 100%; + height: 30px; + background-color: var(--foreground-color); +} + +.parallel-lines { + display: flex; + flex-wrap: wrap; + row-gap: 6px; + padding: 0 5px; +} + +.parallel-lines > div { + height: 2px; + width: 100%; + min-width: 75px; + background-color: var(--highlight-color); +} + +.fcc-title, +.playlist-title { + color: var(--secondary-color); + margin: 0 10px; + font-family: var(--font-headline); +} + +.player-content { + display: flex; + background-color: var(--foreground-color); + width: 430px; + height: 200px; + column-gap: 13px; + align-items: center; + justify-content: center; +} + +#player-album-art { + background-color: var(--secondary-color); + border: 6px solid var(--background-color); +} + +#player-album-art img { + width: 150px; + display: block; +} + +.player-display { + display: flex; + flex-direction: column; + row-gap: 20px; + padding: 14px; + background-color: var(--background-color); + height: 153px; + width: 226px; +} + +.player-display-song-artist { + height: 80px; +} + +.player-buttons svg { + fill: var(--primary-color); +} + +.playing > svg { + fill: var(--highlight-color); +} + +.player-buttons { + display: flex; + justify-content: space-around; +} + +button { + background: transparent; + border: none; + color: var(--primary-color); + cursor: pointer; + font-size: var(--root-font-size); + outline-color: var(--highlight-color); + text-align: center; +} + +.playlist-song { + outline-color: var(--highlight-color); +} + +.playlist li:not(:last-child) { + border-bottom: 1px solid var(--background-color); +} + +button:focus, +.playlist-song:focus { + outline-style: dashed; + outline-width: 2px; +} + +/* Playlist */ +.playlist { + height: auto; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +#playlist-songs { + width: 430px; + height: 100%; + background-color: var(--foreground-color); + display: flex; + flex-direction: column; + row-gap: 8px; + padding: 8px 9px; + visibility: visible; + justify-content: start; + list-style: none; +} + +.playlist-song { + display: flex; + height: 55px; + justify-content: space-between; + align-items: center; + padding: 5px; +} + +[aria-current="true"] { + background-color: var(--background-color); +} + +[aria-current="true"] p { + color: var(--highlight-color); +} + +.playlist-song-info { + height: 100%; + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-around; + column-gap: 7px; + padding: 5px 0; + font-family: var(--font-family); +} + +#player-song-title, +#player-song-artist { + margin: 0; +} + +#player-song-artist { + color: var(--highlight-color); + font-size: 0.75rem; +} + +#player-song-title { + font-size: 1.125rem; +} + +.playlist-song-title { + font-size: 0.85rem; + width: 241px; + text-align: left; +} + +.playlist-song-artist { + font-size: 0.725rem; + width: 80px; +} + +.playlist-song-duration { + font-size: 0.725rem; + margin: auto; + font-family: var(--font-headline); + width: 30px; +} + +.playlist-song-delete { + padding: 0; + width: 20px; + height: 20px; +} + +.playlist-song-delete, +.playlist-song-delete { + fill: var(--foreground-color); +} + +.playlist-song-delete:hover circle, +.playlist-song-delete:focus circle { + fill: #ff0000; +} + +@media (max-width: 700px) { + .player, + .playlist { + width: 300px; + } + + .player { + height: 340px; + } + + #playlist-songs { + height: 280px; + padding: 5px 6px; + overflow-y: scroll; + overflow-x: hidden; + scrollbar-color: var(--background-color) var(--secondary-color); + scrollbar-width: thin; + } + + #playlist-songs::-webkit-scrollbar { + width: 5px; + } + + #playlist-songs::-webkit-scrollbar-track { + background: var(--background-color); + } + + #playlist-songs::-webkit-scrollbar-thumb { + background: var(--secondary-color); + } + + h1 { + font-size: 0.813rem; + } + + h2 { + font-size: 0.75rem; + } + + .player-bar, + .playlist-bar, + .player-content, + #playlist-songs { + width: 280px; + } + + .playlist-song { + justify-content: space-between; + } + + .playlist-song-title { + width: 140px; + } + + .playlist-song-artist { + width: 40px; + } + + .playlist-song-duration > button { + padding: 0; + } + + .player-content { + display: inline; + position: relative; + justify-items: center; + height: 100%; + } + + #player-album-art { + z-index: -100; + height: 280px; + box-shadow: none; + background: #000; + } + + #player-album-art img { + width: 100%; + opacity: 0.6; + } + + .player-display-song-artist { + padding: 0 10px; + } + + .player-display-song-artist > p { + white-space: pre-wrap; + } + + .player-display { + position: absolute; + width: 100%; + z-index: 1000; + background-color: transparent; + top: 0; + height: 280px; + justify-content: space-between; + text-align: center; + } +} +``` + +```js +const playlistSongs = document.getElementById("playlist-songs"); +const playButton = document.getElementById("play"); +const pauseButton = document.getElementById("pause"); +const nextButton = document.getElementById("next"); +const previousButton = document.getElementById("previous"); +const shuffleButton = document.getElementById("shuffle"); + +const allSongs = [ + { + id: 0, + title: "Scratching The Surface", + artist: "Quincy Larson", + duration: "4:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/scratching-the-surface.mp3", + }, + { + id: 1, + title: "Can't Stay Down", + artist: "Quincy Larson", + duration: "4:15", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stay-down.mp3", + }, + { + id: 2, + title: "Still Learning", + artist: "Quincy Larson", + duration: "3:51", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/still-learning.mp3", + }, + { + id: 3, + title: "Cruising for a Musing", + artist: "Quincy Larson", + duration: "3:34", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cruising-for-a-musing.mp3", + }, + { + id: 4, + title: "Never Not Favored", + artist: "Quincy Larson", + duration: "3:35", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/never-not-favored.mp3", + }, + { + id: 5, + title: "From the Ground Up", + artist: "Quincy Larson", + duration: "3:12", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/from-the-ground-up.mp3", + }, + { + id: 6, + title: "Walking on Air", + artist: "Quincy Larson", + duration: "3:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/walking-on-air.mp3", + }, + { + id: 7, + title: "Can't Stop Me. Can't Even Slow Me Down.", + artist: "Quincy Larson", + duration: "3:52", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stop-me-cant-even-slow-me-down.mp3", + }, + { + id: 8, + title: "The Surest Way Out is Through", + artist: "Quincy Larson", + duration: "3:10", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/the-surest-way-out-is-through.mp3", + }, + { + id: 9, + title: "Chasing That Feeling", + artist: "Quincy Larson", + duration: "2:43", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/chasing-that-feeling.mp3", + }, +]; + +const audio = new Audio(); +let userData = { + songs: [...allSongs], + currentSong: null, + songCurrentTime: 0, +}; + +const printGreeting = () => { + console.log('Hello there!'); +} + +printGreeting(); + +const printMessage = org => { + console.log(`${org} is awesome!`); +} + +printMessage('freeCodeCamp'); +--fcc-editable-region-- +const addTwoNumbers = (num1, num2) => { + return num1 + num2 +} +--fcc-editable-region-- +console.log(addTwoNumbers(3,4)); +``` diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660af462d18730978fdf5c50.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660af462d18730978fdf5c50.md new file mode 100644 index 00000000000..262109b8339 --- /dev/null +++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/660af462d18730978fdf5c50.md @@ -0,0 +1,655 @@ +--- +id: 660af462d18730978fdf5c50 +title: Step 16 +challengeType: 0 +dashedName: step-16 +--- + +# --description-- + +Now it is time to apply what you have learned about arrow functions to your music player project. + +Start by removing the `printGreeting`, `printMessage`, and `addTwoNumbers` functions. Also, remove all of the console statements and function calls. + +# --hints-- + +You should not have a `printGreeting` function. + +```js +assert.notMatch(code, /const printGreeting = () => {/); +``` + +You should not have a `printMessage` function. + +```js +assert.notMatch(code, /const printMessage = org => {/); +``` + +You should not have an `addTwoNumbers` function. + +```js +assert.notMatch(code, /const addTwoNumbers = \(num1, num2\) => num1 \+ num2/); +``` + +You should not have a `printGreeting();` function call. + +```js +assert.notMatch(code, /printGreeting\(\);?/); +``` + +You should not have a `printMessage('freeCodeCamp');` function call. + +```js +assert.notMatch(code, /printMessage\('freeCodeCamp'\);?/); +``` + +You should not have a `console.log(addTwoNumbers(3,4));` console statement. + +```js +assert.notMatch(code, /console\.log\(addTwoNumbers\(3,4\)\);?/); +``` + +# --seed-- + +## --seed-contents-- + +```html + + + + + + + + + + Learn Basic String and Array Methods by Building a Music Player App + + + + +
+
+
+
+
+
+
+

freeCodeCamp

+
+
+
+
+
+
+
+ song cover art +
+
+
+

+

+
+
+ + + + + +
+
+
+
+
+
+
+
+
+
+

Playlist

+
+
+
+
+
+ +
+
+ + + +``` + +```css +:root { + /* colors */ + --primary-color: #dfdfe2; + --secondary-color: #ffffff; + --app-background-color: #4d4d62; + --background-color: #1b1b32; + --foreground-color: #3b3b4f; + --highlight-color: #f1be32; + + /* font sizes */ + --root-font-size: 16px; + font-size: var(--root-font-size); + + /* font-families */ + --font-headline: "Roboto Mono", monospace; + --font-family: "Lato", sans-serif; +} + +*, +*::after, +*::before { + box-sizing: border-box; +} + +body { + background-color: var(--app-background-color); + color: var(--primary-color); + font-family: var(--font-family); +} + +h1 { + font-size: 1.125rem; + line-height: 1.6; +} + +h2 { + font-size: var(--root-font-size); +} + +ul { + margin: 0; +} + +.container { + margin-top: 10px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + row-gap: 5px; +} + +.player, +.playlist { + width: 450px; + background-color: var(--background-color); + border: 3px solid var(--foreground-color); +} + +.player { + height: 260px; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +.player-bar, +.playlist-bar { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 5px; + width: 100%; + height: 30px; + background-color: var(--foreground-color); +} + +.parallel-lines { + display: flex; + flex-wrap: wrap; + row-gap: 6px; + padding: 0 5px; +} + +.parallel-lines > div { + height: 2px; + width: 100%; + min-width: 75px; + background-color: var(--highlight-color); +} + +.fcc-title, +.playlist-title { + color: var(--secondary-color); + margin: 0 10px; + font-family: var(--font-headline); +} + +.player-content { + display: flex; + background-color: var(--foreground-color); + width: 430px; + height: 200px; + column-gap: 13px; + align-items: center; + justify-content: center; +} + +#player-album-art { + background-color: var(--secondary-color); + border: 6px solid var(--background-color); +} + +#player-album-art img { + width: 150px; + display: block; +} + +.player-display { + display: flex; + flex-direction: column; + row-gap: 20px; + padding: 14px; + background-color: var(--background-color); + height: 153px; + width: 226px; +} + +.player-display-song-artist { + height: 80px; +} + +.player-buttons svg { + fill: var(--primary-color); +} + +.playing > svg { + fill: var(--highlight-color); +} + +.player-buttons { + display: flex; + justify-content: space-around; +} + +button { + background: transparent; + border: none; + color: var(--primary-color); + cursor: pointer; + font-size: var(--root-font-size); + outline-color: var(--highlight-color); + text-align: center; +} + +.playlist-song { + outline-color: var(--highlight-color); +} + +.playlist li:not(:last-child) { + border-bottom: 1px solid var(--background-color); +} + +button:focus, +.playlist-song:focus { + outline-style: dashed; + outline-width: 2px; +} + +/* Playlist */ +.playlist { + height: auto; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + row-gap: 10px; +} + +#playlist-songs { + width: 430px; + height: 100%; + background-color: var(--foreground-color); + display: flex; + flex-direction: column; + row-gap: 8px; + padding: 8px 9px; + visibility: visible; + justify-content: start; + list-style: none; +} + +.playlist-song { + display: flex; + height: 55px; + justify-content: space-between; + align-items: center; + padding: 5px; +} + +[aria-current="true"] { + background-color: var(--background-color); +} + +[aria-current="true"] p { + color: var(--highlight-color); +} + +.playlist-song-info { + height: 100%; + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-around; + column-gap: 7px; + padding: 5px 0; + font-family: var(--font-family); +} + +#player-song-title, +#player-song-artist { + margin: 0; +} + +#player-song-artist { + color: var(--highlight-color); + font-size: 0.75rem; +} + +#player-song-title { + font-size: 1.125rem; +} + +.playlist-song-title { + font-size: 0.85rem; + width: 241px; + text-align: left; +} + +.playlist-song-artist { + font-size: 0.725rem; + width: 80px; +} + +.playlist-song-duration { + font-size: 0.725rem; + margin: auto; + font-family: var(--font-headline); + width: 30px; +} + +.playlist-song-delete { + padding: 0; + width: 20px; + height: 20px; +} + +.playlist-song-delete, +.playlist-song-delete { + fill: var(--foreground-color); +} + +.playlist-song-delete:hover circle, +.playlist-song-delete:focus circle { + fill: #ff0000; +} + +@media (max-width: 700px) { + .player, + .playlist { + width: 300px; + } + + .player { + height: 340px; + } + + #playlist-songs { + height: 280px; + padding: 5px 6px; + overflow-y: scroll; + overflow-x: hidden; + scrollbar-color: var(--background-color) var(--secondary-color); + scrollbar-width: thin; + } + + #playlist-songs::-webkit-scrollbar { + width: 5px; + } + + #playlist-songs::-webkit-scrollbar-track { + background: var(--background-color); + } + + #playlist-songs::-webkit-scrollbar-thumb { + background: var(--secondary-color); + } + + h1 { + font-size: 0.813rem; + } + + h2 { + font-size: 0.75rem; + } + + .player-bar, + .playlist-bar, + .player-content, + #playlist-songs { + width: 280px; + } + + .playlist-song { + justify-content: space-between; + } + + .playlist-song-title { + width: 140px; + } + + .playlist-song-artist { + width: 40px; + } + + .playlist-song-duration > button { + padding: 0; + } + + .player-content { + display: inline; + position: relative; + justify-items: center; + height: 100%; + } + + #player-album-art { + z-index: -100; + height: 280px; + box-shadow: none; + background: #000; + } + + #player-album-art img { + width: 100%; + opacity: 0.6; + } + + .player-display-song-artist { + padding: 0 10px; + } + + .player-display-song-artist > p { + white-space: pre-wrap; + } + + .player-display { + position: absolute; + width: 100%; + z-index: 1000; + background-color: transparent; + top: 0; + height: 280px; + justify-content: space-between; + text-align: center; + } +} +``` + +```js +const playlistSongs = document.getElementById("playlist-songs"); +const playButton = document.getElementById("play"); +const pauseButton = document.getElementById("pause"); +const nextButton = document.getElementById("next"); +const previousButton = document.getElementById("previous"); +const shuffleButton = document.getElementById("shuffle"); + +const allSongs = [ + { + id: 0, + title: "Scratching The Surface", + artist: "Quincy Larson", + duration: "4:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/scratching-the-surface.mp3", + }, + { + id: 1, + title: "Can't Stay Down", + artist: "Quincy Larson", + duration: "4:15", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stay-down.mp3", + }, + { + id: 2, + title: "Still Learning", + artist: "Quincy Larson", + duration: "3:51", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/still-learning.mp3", + }, + { + id: 3, + title: "Cruising for a Musing", + artist: "Quincy Larson", + duration: "3:34", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cruising-for-a-musing.mp3", + }, + { + id: 4, + title: "Never Not Favored", + artist: "Quincy Larson", + duration: "3:35", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/never-not-favored.mp3", + }, + { + id: 5, + title: "From the Ground Up", + artist: "Quincy Larson", + duration: "3:12", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/from-the-ground-up.mp3", + }, + { + id: 6, + title: "Walking on Air", + artist: "Quincy Larson", + duration: "3:25", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/walking-on-air.mp3", + }, + { + id: 7, + title: "Can't Stop Me. Can't Even Slow Me Down.", + artist: "Quincy Larson", + duration: "3:52", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/cant-stop-me-cant-even-slow-me-down.mp3", + }, + { + id: 8, + title: "The Surest Way Out is Through", + artist: "Quincy Larson", + duration: "3:10", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/the-surest-way-out-is-through.mp3", + }, + { + id: 9, + title: "Chasing That Feeling", + artist: "Quincy Larson", + duration: "2:43", + src: "https://s3.amazonaws.com/org.freecodecamp.mp3-player-project/chasing-that-feeling.mp3", + }, +]; + +const audio = new Audio(); +let userData = { + songs: [...allSongs], + currentSong: null, + songCurrentTime: 0, +}; +--fcc-editable-region-- +const printGreeting = () => { + console.log('Hello there!'); +} + +printGreeting(); + +const printMessage = org => { + console.log(`${org} is awesome!`); +} + +printMessage('freeCodeCamp'); + +const addTwoNumbers = (num1, num2) => num1 + num2 + +console.log(addTwoNumbers(3,4)); +--fcc-editable-region-- +```