fix(challenges): Typo errors (#39)

Author: Nirajn2311

challenges/01-responsive-web-design/basic-css.json

@@ -4555,21 +4555,21 @@
       "tests": [
         {
           "text":
-            "<code>penguin</code> class should declar the <code>--penguin-skin</code> variable and assign it to <code>gray</code>.",
+            "<code>penguin</code> class should declare the <code>--penguin-skin</code> variable and assign it to <code>gray</code>.",
           "testString":
-            "assert(code.match(/.penguin\\s*?{[\\s\\S]*--penguin-skin\\s*?:\\s*?gray\\s*?;[\\s\\S]*}/gi), '<code>penguin</code> class should declar the <code>--penguin-skin</code> variable and assign it to <code>gray</code>.');"
+            "assert(code.match(/.penguin\\s*?{[\\s\\S]*--penguin-skin\\s*?:\\s*?gray\\s*?;[\\s\\S]*}/gi), '<code>penguin</code> class should declare the <code>--penguin-skin</code> variable and assign it to <code>gray</code>.');"
         },
         {
           "text":
-            "<code>penguin</code> class should declar the <code>--penguin-skin</code> variable and assign it to <code>white</code>.",
+            "<code>penguin</code> class should declare the <code>--penguin-skin</code> variable and assign it to <code>white</code>.",
           "testString":
-            "assert(code.match(/.penguin\\s*?{[\\s\\S]*--penguin-belly\\s*?:\\s*?white\\s*?;[\\s\\S]*}/gi), '<code>penguin</code> class should declar the <code>--penguin-skin</code> variable and assign it to <code>white</code>.');"
+            "assert(code.match(/.penguin\\s*?{[\\s\\S]*--penguin-belly\\s*?:\\s*?white\\s*?;[\\s\\S]*}/gi), '<code>penguin</code> class should declare the <code>--penguin-skin</code> variable and assign it to <code>white</code>.');"
         },
         {
           "text":
-            "<code>penguin</code> class should declar the <code>--penguin-skin</code> variable and assign it to <code>orange</code>.",
+            "<code>penguin</code> class should declare the <code>--penguin-skin</code> variable and assign it to <code>orange</code>.",
           "testString":
-            "assert(code.match(/.penguin\\s*?{[\\s\\S]*--penguin-beak\\s*?:\\s*?orange\\s*?;[\\s\\S]*}/gi), '<code>penguin</code> class should declar the <code>--penguin-skin</code> variable and assign it to <code>orange</code>.');"
+            "assert(code.match(/.penguin\\s*?{[\\s\\S]*--penguin-beak\\s*?:\\s*?orange\\s*?;[\\s\\S]*}/gi), '<code>penguin</code> class should declare the <code>--penguin-skin</code> variable and assign it to <code>orange</code>.');"
         }
       ],
       "solutions": [],
@@ -4803,9 +4803,9 @@
       "tests": [
         {
           "text":
-            "<code>penguin</code> class should declar the <code>--penguin-skin</code> variable and assign it to <code>gray</code>.",
+            "<code>penguin</code> class should declare the <code>--penguin-skin</code> variable and assign it to <code>gray</code>.",
           "testString":
-            "assert(code.match(/.penguin\\s*?{[\\s\\S]*--penguin-skin\\s*?:\\s*?gray\\s*?;[\\s\\S]*}/gi), '<code>penguin</code> class should declar the <code>--penguin-skin</code> variable and assign it to <code>gray</code>.');"
+            "assert(code.match(/.penguin\\s*?{[\\s\\S]*--penguin-skin\\s*?:\\s*?gray\\s*?;[\\s\\S]*}/gi), '<code>penguin</code> class should declare the <code>--penguin-skin</code> variable and assign it to <code>gray</code>.');"
         }
       ],
       "solutions": [],
@@ -5036,15 +5036,15 @@
       "tests": [
         {
           "text":
-            "Apply the <code>--penguin-skin</code> variable to the <code>background</code> property of the <code>pengiun-top</code> class.",
+            "Apply the <code>--penguin-skin</code> variable to the <code>background</code> property of the <code>penguin-top</code> class.",
           "testString":
-            "assert(code.match(/.penguin-top\\s*?{[\\s\\S]*background\\s*?:\\s*?var\\s*?\\(\\s*?--penguin-skin\\s*?\\)\\s*?;[\\s\\S]*}[\\s\\S]*.penguin-bottom\\s{/gi), 'Apply the <code>--penguin-skin</code> variable to the <code>background</code> property of the <code>pengiun-top</code> class.');"
+            "assert(code.match(/.penguin-top\\s*?{[\\s\\S]*background\\s*?:\\s*?var\\s*?\\(\\s*?--penguin-skin\\s*?\\)\\s*?;[\\s\\S]*}[\\s\\S]*.penguin-bottom\\s{/gi), 'Apply the <code>--penguin-skin</code> variable to the <code>background</code> property of the <code>penguin-top</code> class.');"
         },
         {
           "text":
-            "Apply the <code>--penguin-skin</code> variable to the <code>background</code> property of the <code>pengiun-bottom</code> class.",
+            "Apply the <code>--penguin-skin</code> variable to the <code>background</code> property of the <code>penguin-bottom</code> class.",
           "testString":
-            "assert(code.match(/.penguin-bottom\\s*?{[\\s\\S]*background\\s*?:\\s*?var\\s*?\\(\\s*?--penguin-skin\\s*?\\)\\s*?;[\\s\\S]*}[\\s\\S]*.right-hand\\s{/gi), 'Apply the <code>--penguin-skin</code> variable to the <code>background</code> property of the <code>pengiun-bottom</code> class.');"
+            "assert(code.match(/.penguin-bottom\\s*?{[\\s\\S]*background\\s*?:\\s*?var\\s*?\\(\\s*?--penguin-skin\\s*?\\)\\s*?;[\\s\\S]*}[\\s\\S]*.right-hand\\s{/gi), 'Apply the <code>--penguin-skin</code> variable to the <code>background</code> property of the <code>penguin-bottom</code> class.');"
         },
         {
           "text":
@@ -5303,13 +5303,13 @@
           "text":
             "Apply the fallback value of <code>black</code> to the <code>background</code> property of the <code>penguin-top</code> class.",
           "testString":
-            "assert(code.match(/.penguin-top\\s*?{[\\s\\S]*background\\s*?:\\s*?var\\(\\s*?--pengiun-skin\\s*?,\\s*?black\\s*?\\)\\s*?;[\\s\\S]*}[\\s\\S]*.penguin-bottom\\s{/gi), 'Apply the fallback value of <code>black</code> to the <code>background</code> property of the <code>penguin-top</code> class.');"
+            "assert(code.match(/.penguin-top\\s*?{[\\s\\S]*background\\s*?:\\s*?var\\(\\s*?--penguin-skin\\s*?,\\s*?black\\s*?\\)\\s*?;[\\s\\S]*}[\\s\\S]*.penguin-bottom\\s{/gi), 'Apply the fallback value of <code>black</code> to the <code>background</code> property of the <code>penguin-top</code> class.');"
         },
         {
           "text":
             "Apply the fallback value of <code>black</code> to the <code>background</code> property of the <code>penguin-bottom</code> class.",
           "testString":
-            "assert(code.match(/.penguin-bottom\\s*?{[\\s\\S]*background\\s*?:\\s*?var\\(\\s*?--pengiun-skin\\s*?,\\s*?black\\s*?\\)\\s*?;[\\s\\S]*}/gi), 'Apply the fallback value of <code>black</code> to the <code>background</code> property of the <code>penguin-bottom</code> class.');"
+            "assert(code.match(/.penguin-bottom\\s*?{[\\s\\S]*background\\s*?:\\s*?var\\(\\s*?--penguin-skin\\s*?,\\s*?black\\s*?\\)\\s*?;[\\s\\S]*}/gi), 'Apply the fallback value of <code>black</code> to the <code>background</code> property of the <code>penguin-bottom</code> class.');"
         }
       ],
       "solutions": [],
@@ -5341,7 +5341,7 @@
             "    left: 25%;",
             "  ",
             "    /* change code below */",
-            "    background: var(--pengiun-skin);",
+            "    background: var(--penguin-skin);",
             "    /* change code above */",
             "  ",
             "    width: 50%;",
@@ -5354,7 +5354,7 @@
             "    left: 23.5%;",
             "  ",
             "    /* change code below */",
-            "    background: var(--pengiun-skin);",
+            "    background: var(--penguin-skin);",
             "    /* change code above */",
             "  ",
             "    width: 53%;",

challenges/02-javascript-algorithms-and-data-structures/basic-javascript.json

@@ -4106,9 +4106,9 @@
       "title": "Practice comparing different values",
       "description": [
         "In the last two challenges, we learned about the equality operator (<code>==</code>) and the strict equality operator (<code>===</code>). Let's do a quick review and practice using these operators some more.",
-        "If the values being compared are not of the same type, the equality operator will perform a type conversion, and then evaluate the values. However, the strict equalty operator will compare both the data type and value as-is, without converting one type to the other.",
+        "If the values being compared are not of the same type, the equality operator will perform a type conversion, and then evaluate the values. However, the strict equality operator will compare both the data type and value as-is, without converting one type to the other.",
         "<strong>Examples</strong>",
-        "<blockquote>3 == '3'  // returns true because JavaScript performs type converstion from string to number<br>3 === '3' // returns false because the types are different and type conversion is not performed</blockquote>",
+        "<blockquote>3 == '3'  // returns true because JavaScript performs type conversion from string to number<br>3 === '3' // returns false because the types are different and type conversion is not performed</blockquote>",
         "<strong>Note</strong><br>In JavaScript, you can determine the type of a variable or a value with the <code>typeof</code> operator, as follows:",
         "<blockquote>typeof 3   // returns 'number'<br>typeof '3' // returns 'string'</blockquote>",
         "<hr>",

challenges/03-front-end-libraries/react.json

@@ -3168,10 +3168,10 @@
       "title": "Render with an If/Else Condition",
       "releasedOn": "December 25, 2017",
       "description": [
-        "Another application of using JavaScript to control your rendered view is to tie the elements that are rendered to a condition. When the condition is true, one view renders, when it's false, it's a different view. You can do this with a standard <code>if/else</code> statement in the <code>render()</code> method of a React component.",
+        "Another application of using JavaScript to control your rendered view is to tie the elements that are rendered to a condition. When the condition is true, one view renders. When it's false, it's a different view. You can do this with a standard <code>if/else</code> statement in the <code>render()</code> method of a React component.",
         "<hr>",
         "MyComponent contains a <code>boolean</code> in its state which tracks whether you want to display some element in the UI or not. The <code>button</code> toggles the state of this value. Currently, it renders the same UI every time. Rewrite the <code>render()</code> method with an <code>if/else</code> statement so that if <code>display</code> is <code>true</code>, you return the current markup. Otherwise, return the markup without the <code>h1</code> element.",
-        "<strong>Note:</strong>&nbsp;You must write an <code>if/else</code> to pass the tests, use of the ternary operator will not pass here."
+        "<strong>Note:</strong>&nbsp;You must write an <code>if/else</code> to pass the tests. Use of the ternary operator will not pass here."
       ],
       "files": {
         "indexjsx": {