chore: update lang tags on code blocks

curriculum/challenges/english/01-responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element.english.md

@@ -90,7 +90,7 @@ tests:
 ## Solution
 <section id='solution'>
 
-```js
+```html
 <style>
   .injected-text {
     margin-bottom: -25px;

curriculum/challenges/english/01-responsive-web-design/basic-css/adjust-the-margin-of-an-element.english.md

@@ -85,7 +85,7 @@ tests:
 ## Solution
 <section id='solution'>
 
-```js
+```html
 <style>
   .injected-text {
     margin-bottom: -25px;

curriculum/challenges/english/01-responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable.english.md

@@ -7,6 +7,7 @@ forumTopicId: 301084
 ---
 
 ## Description
+
 <section id='description'>
 When using your variable as a CSS property value, you can attach a fallback value that your browser will revert to if the given variable is invalid.
 <strong>Note:</strong> This fallback is not used to increase browser compatibility, and it will not work on IE browsers. Rather, it is used so that the browser has a color to display if it cannot find your variable.
@@ -18,14 +19,17 @@ background: var(--penguin-skin, black);
 
 This will set background to black if your variable wasn't set.
 Note that this can be useful for debugging.
+
 </section>
 
 ## Instructions
+
 <section id='instructions'>
 It looks like there is a problem with the variables supplied to the <code>.penguin-top</code> and <code>.penguin-bottom</code> classes. Rather than fix the typo, add a fallback value of <code>black</code> to the <code>background</code> property of the <code>.penguin-top</code> and <code>.penguin-bottom</code> classes.
 </section>
 
 ## Tests
+
 <section id='tests'>
 
 ```yml
@@ -34,12 +38,12 @@ tests:
     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));
   - text: The fallback value of <code>black</code> should be used in <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));
-
 ```
 
 </section>
 
 ## Challenge Seed
+
 <section id='challengeSeed'>
 
 <div id='html-seed'>
@@ -219,7 +223,7 @@ tests:
   }
 
   body {
-    background:#c6faf1;
+    background: #c6faf1;
   }
 
   .penguin * {
@@ -253,16 +257,21 @@ tests:
 
 </div>
 
-
-
 </section>
 
 ## Solution
+
 <section id='solution'>
 
-
+```html
-```js
+<style>
-var code = ".penguin-top {background: var(--pengiun-skin, black);} .penguin-bottom {background: var(--pengiun-skin, black);}"
+  .penguin-top {
+    background: var(--pengiun-skin, black);
+  }
+  .penguin-bottom {
+    background: var(--pengiun-skin, black);
+  }
+</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/basic-css/change-a-variable-for-a-specific-area.english.md

@@ -249,8 +249,10 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".penguin {--penguin-belly: white;}"
+<style>
+.penguin {--penguin-belly: white;}
+</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/basic-css/create-a-custom-css-variable.english.md

@@ -249,8 +249,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".penguin {--penguin-skin: gray;}"
+<style>.penguin {--penguin-skin: gray;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/basic-css/inherit-css-variables.english.md

@@ -249,8 +249,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ":root {--penguin-belly: pink;}"
+<style>:root {--penguin-belly: pink;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/basic-css/prioritize-one-style-over-another.english.md

@@ -60,7 +60,7 @@ tests:
 ## Solution
 <section id='solution'>
 
-```js
+```html
 <style>
   body {
     background-color: black;

curriculum/challenges/english/01-responsive-web-design/basic-css/size-your-images.english.md

@@ -104,7 +104,7 @@ tests:
 ## Solution
 <section id='solution'>
 
-```js
+```html
 <link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
 <style>
   .red-text {

curriculum/challenges/english/01-responsive-web-design/basic-css/use-a-custom-css-variable.english.md

@@ -269,8 +269,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".penguin-top {background: var(--penguin-skin);} .penguin-bottom {background: var(--penguin-skin);} .right-hand {background: var(--penguin-skin);} .left-hand {background: var(--penguin-skin);}"
+<style>.penguin-top {background: var(--penguin-skin);} .penguin-bottom {background: var(--penguin-skin);} .right-hand {background: var(--penguin-skin);} .left-hand {background: var(--penguin-skin);}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/basic-css/use-a-media-query-to-change-a-variable.english.md

@@ -277,8 +277,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = "@media (max-width: 350px) {:root {--penguin-size: 200px; --penguin-skin: black;}}"
+<style>@media (max-width: 350px) {:root {--penguin-size: 200px; --penguin-skin: black;}}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once.english.md

@@ -251,8 +251,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".penguin {--penguin-skin: gray; --penguin-belly: white; --penguin-beak: orange;}"
+<style>.penguin {--penguin-skin: gray; --penguin-belly: white; --penguin-beak: orange;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/basic-css/use-rgb-to-mix-colors.english.md

@@ -82,7 +82,7 @@ tests:
 ## Solution
 <section id='solution'>
 
-```js
+```html
 <style>
   .red-text {
     color: rgb(255, 0, 0);

curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/delete-html-elements.english.md

@@ -56,8 +56,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = "<h2>CatPhotoApp</h2><p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>"
+<h2>CatPhotoApp</h2><p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/uncomment-html.english.md

@@ -60,7 +60,7 @@ tests:
 ## Solution
 <section id='solution'>
 
-```js
+```html
 <h1>Hello World</h1>
 
 <h2>CatPhotoApp</h2>

curriculum/challenges/english/01-responsive-web-design/css-grid/add-columns-with-grid-template-columns.english.md

@@ -82,8 +82,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {grid-template-columns: 100px 100px 100px;}"
+<style>.container {grid-template-columns: 100px 100px 100px;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/add-gaps-faster-with-grid-gap.english.md

@@ -74,8 +74,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {grid-gap: 10px 20px;}"
+<style>.container {grid-gap: 10px 20px;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/add-rows-with-grid-template-rows.english.md

@@ -73,8 +73,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {grid-template-rows: 50px 50px;}"
+<style>.container {grid-template-rows: 50px 50px;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items.english.md

@@ -76,8 +76,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {justify-items: center;}"
+<style>.container {justify-items: center;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/align-all-items-vertically-using-align-items.english.md

@@ -76,8 +76,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {align-items: end;}"
+<style>.container {align-items: end;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self.english.md

@@ -83,8 +83,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".item2 {justify-self: center;}"
+<style>.item2 {justify-self: center;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/align-an-item-vertically-using-align-self.english.md

@@ -80,8 +80,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".item3 {align-self: end;}"
+<style>.item3 {align-self: end;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap.english.md

@@ -81,8 +81,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {grid-column-gap: 20px;}"
+<style>.container {grid-column-gap: 20px;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap.english.md

@@ -75,8 +75,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {grid-row-gap: 5px;}"
+<style>.container {grid-row-gap: 5px;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit.english.md

@@ -95,8 +95,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {grid-template-columns: repeat( auto-fill, minmax(60px, 1fr));} .container2 {grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));}"
+<style>.container {grid-template-columns: repeat( auto-fill, minmax(60px, 1fr));} .container2 {grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/create-grids-within-grids.english.md

@@ -107,8 +107,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".item3 {grid-template-columns: auto 1fr; display: grid;}"
+<style>.item3 {grid-template-columns: auto 1fr; display: grid;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/create-your-first-css-grid.english.md

@@ -72,8 +72,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {display: grid;}"
+<style>.container {display: grid;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/limit-item-size-using-the-minmax-function.english.md

@@ -82,8 +82,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {grid-template-columns: repeat(3, minmax(90px, 1fr));}"
+<style>.container {grid-template-columns: repeat(3, minmax(90px, 1fr));}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property.english.md

@@ -91,8 +91,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".item5 {grid-area: footer;}"
+<style>.item5 {grid-area: footer;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function.english.md

@@ -96,8 +96,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {grid-template-columns: repeat(3, 1fr);}"
+<style>.container {grid-template-columns: repeat(3, 1fr);}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows.english.md

@@ -84,8 +84,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".container {grid-template-columns: 1fr 100px 2fr;}"
+<style>.container {grid-template-columns: 1fr 100px 2fr;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template.english.md

@@ -91,8 +91,8 @@ tests:
 <section id='solution'>
 
 
-```js
+```html
-var code = ".item5 {grid-area: 3/1/4/4;}"
+<style>.item5 {grid-area: 3/1/4/4;}</style>
 ```
 
 </section>

curriculum/challenges/english/01-responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage.english.md

@@ -49,7 +49,7 @@ tests: []
 ## Solution
 <section id='solution'>
 
-```js
+```html
 // solution required
 ```
 

curriculum/challenges/english/01-responsive-web-design/responsive-web-design-projects/build-a-product-landing-page.english.md

@@ -53,7 +53,7 @@ tests: []
 ## Solution
 <section id='solution'>
 
-```js
+```html
 // solution required
 ```
 

curriculum/challenges/english/01-responsive-web-design/responsive-web-design-projects/build-a-survey-form.english.md

@@ -54,7 +54,7 @@ tests: []
 ## Solution
 <section id='solution'>
 
-```js
+```html
 // solution required
 ```
 

curriculum/challenges/english/01-responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page.english.md

@@ -53,7 +53,7 @@ tests: []
 ## Solution
 <section id='solution'>
 
-```js
+```html
 // solution required
 ```
 

curriculum/challenges/english/01-responsive-web-design/responsive-web-design-projects/build-a-tribute-page.english.md

@@ -47,7 +47,7 @@ tests: []
 ## Solution
 <section id='solution'>
 
-```js
+```html
 // solution required
 ```
 

curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-react.english.md

@@ -82,7 +82,7 @@ const connect = ReactRedux.connect;
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 
 const store = Redux.createStore(
   (state = '__INITIAL__STATE__', action) => state
@@ -107,7 +107,7 @@ ReactDOM.render(<AppWrapper />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const addMessage = (message) => {
   return {
     type: 'ADD',

curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-the-messages-app.english.md

@@ -149,7 +149,7 @@ class AppWrapper extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<AppWrapper />, document.getElementById('root'))
 ```
 
@@ -161,7 +161,7 @@ ReactDOM.render(<AppWrapper />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 // Redux:
 const ADD = 'ADD';
 

curriculum/challenges/english/03-front-end-libraries/react-and-redux/extract-local-state-into-redux.english.md

@@ -154,7 +154,7 @@ class AppWrapper extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<AppWrapper />, document.getElementById('root'))
 ```
 
@@ -166,7 +166,7 @@ ReactDOM.render(<AppWrapper />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 // Redux:
 const ADD = 'ADD';
 

curriculum/challenges/english/03-front-end-libraries/react-and-redux/extract-state-logic-to-redux.english.md

@@ -59,7 +59,7 @@ tests:
 <section id='solution'>
 
 
-```js
+```jsx
 const ADD = 'ADD';
 
 const addMessage = (message) => {

curriculum/challenges/english/03-front-end-libraries/react-and-redux/getting-started-with-react-redux.english.md

@@ -56,7 +56,7 @@ class DisplayMessages extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<DisplayMessages />, document.getElementById('root'))
 ```
 
@@ -68,7 +68,7 @@ ReactDOM.render(<DisplayMessages />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class DisplayMessages extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react-and-redux/manage-state-locally-first.english.md

@@ -77,7 +77,7 @@ class DisplayMessages extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<DisplayMessages />, document.getElementById('root'))
 ```
 
@@ -89,7 +89,7 @@ ReactDOM.render(<DisplayMessages />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class DisplayMessages extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react-and-redux/map-dispatch-to-props.english.md

@@ -71,7 +71,7 @@ const addMessage = (message) => {
 <section id='solution'>
 
 
-```js
+```jsx
 const addMessage = (message) => {
   return {
     type: 'ADD',

curriculum/challenges/english/03-front-end-libraries/react-and-redux/map-state-to-props.english.md

@@ -58,7 +58,7 @@ const state = [];
 <section id='solution'>
 
 
-```js
+```jsx
 const state = [];
 
 // Change code below this line

curriculum/challenges/english/03-front-end-libraries/react-and-redux/moving-forward-from-here.english.md

@@ -72,7 +72,7 @@ ReactDOM.render(
 <section id='solution'>
 
 
-```js
+```jsx
 console.log('Now I know React and Redux!');
 ```
 

curriculum/challenges/english/03-front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react.english.md

@@ -137,7 +137,7 @@ class AppWrapper extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<AppWrapper />, document.getElementById('root'))
 ```
 
@@ -149,7 +149,7 @@ ReactDOM.render(<AppWrapper />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 // Redux:
 const ADD = 'ADD';
 

curriculum/challenges/english/03-front-end-libraries/react/access-props-using-this.props.english.md

@@ -85,7 +85,7 @@ class ResetPassword extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<ResetPassword />, document.getElementById('root'))
 ```
 
@@ -97,7 +97,7 @@ ReactDOM.render(<ResetPassword />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class ReturnTempPassword extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/add-comments-in-jsx.english.md

@@ -56,7 +56,7 @@ const JSX = (
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(JSX, document.getElementById('root'))
 ```
 
@@ -68,7 +68,7 @@ ReactDOM.render(JSX, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const JSX = (
 <div>
   <h1>This is a block of JSX</h1>

curriculum/challenges/english/03-front-end-libraries/react/add-event-listeners.english.md

@@ -85,7 +85,7 @@ class MyComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'))
 ```
 
@@ -97,7 +97,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/add-inline-styles-in-react.english.md

@@ -66,7 +66,7 @@ class Colorful extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<Colorful />, document.getElementById('root'))
 ```
 
@@ -78,7 +78,7 @@ ReactDOM.render(<Colorful />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const styles = {
   color: "purple",
   fontSize: 40,

curriculum/challenges/english/03-front-end-libraries/react/bind-this-to-a-class-method.english.md

@@ -76,7 +76,7 @@ class MyComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'))
 ```
 
@@ -88,7 +88,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/change-inline-css-conditionally-based-on-component-state.english.md

@@ -82,7 +82,7 @@ class GateKeeper extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<GateKeeper />, document.getElementById('root'))
 ```
 
@@ -94,7 +94,7 @@ ReactDOM.render(<GateKeeper />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class GateKeeper extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/compose-react-components.english.md

@@ -132,7 +132,7 @@ class Vegetables extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<TypesOfFood />, document.getElementById('root'))
 ```
 
@@ -144,7 +144,7 @@ ReactDOM.render(<TypesOfFood />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class Fruits extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/create-a-complex-jsx-element.english.md

@@ -76,7 +76,7 @@ tests:
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(JSX, document.getElementById('root'))
 ```
 
@@ -88,7 +88,7 @@ ReactDOM.render(JSX, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const JSX = (
 <div>
   <h1>Hello JSX!</h1>

curriculum/challenges/english/03-front-end-libraries/react/create-a-component-with-composition.english.md

@@ -84,7 +84,7 @@ class ParentComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<ParentComponent />, document.getElementById('root'))
 ```
 
@@ -96,7 +96,7 @@ ReactDOM.render(<ParentComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const ChildComponent = () => {
   return (
     <div>

curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-form.english.md

@@ -152,7 +152,7 @@ class MyForm extends React.Component {
 
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyForm />, document.getElementById('root'));
 ```
 
@@ -164,7 +164,7 @@ ReactDOM.render(<MyForm />, document.getElementById('root'));
 
 <section id='solution'>
 
-```js
+```jsx
 class MyForm extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-input.english.md

@@ -75,7 +75,7 @@ class ControlledInput extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<ControlledInput />, document.getElementById('root'))
 ```
 
@@ -87,7 +87,7 @@ ReactDOM.render(<ControlledInput />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class ControlledInput extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/create-a-react-component.english.md

@@ -76,7 +76,7 @@ class MyComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'))
 ```
 
@@ -88,7 +88,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/create-a-simple-jsx-element.english.md

@@ -51,7 +51,7 @@ const JSX = <div></div>;
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(JSX, document.getElementById('root'))
 ```
 
@@ -63,7 +63,7 @@ ReactDOM.render(JSX, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const JSX = <h1>Hello JSX!</h1>;
 ```
 

curriculum/challenges/english/03-front-end-libraries/react/create-a-stateful-component.english.md

@@ -73,7 +73,7 @@ class StatefulComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<StatefulComponent />, document.getElementById('root'))
 ```
 
@@ -85,7 +85,7 @@ ReactDOM.render(<StatefulComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class StatefulComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/create-a-stateless-functional-component.english.md

@@ -67,7 +67,7 @@ const MyComponent = function() {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'))
 ```
 
@@ -79,7 +79,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const MyComponent = function() {
   // Change code below this line
   return (

curriculum/challenges/english/03-front-end-libraries/react/define-an-html-class-in-jsx.english.md

@@ -52,7 +52,7 @@ const JSX = (
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(JSX, document.getElementById('root'))
 ```
 
@@ -64,7 +64,7 @@ ReactDOM.render(JSX, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const JSX = (
 <div className = 'myDiv'>
   <h1>Add a class to this div</h1>

curriculum/challenges/english/03-front-end-libraries/react/give-sibling-elements-a-unique-key-attribute.english.md

@@ -74,7 +74,7 @@ function Frameworks() {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<Frameworks />, document.getElementById('root'))
 ```
 
@@ -86,7 +86,7 @@ ReactDOM.render(<Frameworks />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const frontEndFrameworks = [
   'React',
   'Angular',

curriculum/challenges/english/03-front-end-libraries/react/introducing-inline-styles.english.md

@@ -62,7 +62,7 @@ class Colorful extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<Colorful />, document.getElementById('root'))
 ```
 
@@ -74,7 +74,7 @@ ReactDOM.render(<Colorful />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class Colorful extends React.Component {
   render() {
     return (

curriculum/challenges/english/03-front-end-libraries/react/learn-about-self-closing-jsx-tags.english.md

@@ -58,7 +58,7 @@ const JSX = (
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(JSX, document.getElementById('root'))
 ```
 
@@ -70,7 +70,7 @@ ReactDOM.render(JSX, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const JSX = (
 <div>
   <h2>Welcome to React!</h2> <br />

curriculum/challenges/english/03-front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate.english.md

@@ -126,7 +126,7 @@ class Controller extends React.Component {
 
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<Controller />, document.getElementById('root'));
 ```
 
@@ -138,7 +138,7 @@ ReactDOM.render(<Controller />, document.getElementById('root'));
 
 <section id='solution'>
 
-```js
+```jsx
 class OnlyEvens extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/override-default-props.english.md

@@ -65,7 +65,7 @@ class ShoppingCart extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<ShoppingCart />, document.getElementById('root'))
 ```
 
@@ -77,7 +77,7 @@ ReactDOM.render(<ShoppingCart />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const Items = (props) => {
   return <h1>Current Quantity of Items in Cart: {props.quantity}</h1>
 }

curriculum/challenges/english/03-front-end-libraries/react/pass-a-callback-as-props.english.md

@@ -104,7 +104,7 @@ class RenderInput extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyApp />, document.getElementById('root'))
 ```
 
@@ -116,7 +116,7 @@ ReactDOM.render(<MyApp />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyApp extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/pass-an-array-as-props.english.md

@@ -97,7 +97,7 @@ class ToDo extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<ToDo />, document.getElementById('root'))
 ```
 
@@ -109,7 +109,7 @@ ReactDOM.render(<ToDo />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const List= (props) => {
   return <p>{props.tasks.join(', ')}</p>
 };

curriculum/challenges/english/03-front-end-libraries/react/pass-props-to-a-stateless-functional-component.english.md

@@ -93,7 +93,7 @@ class Calendar extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<Calendar />, document.getElementById('root'))
 ```
 
@@ -105,7 +105,7 @@ ReactDOM.render(<Calendar />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const CurrentDate = (props) => {
   return (
     <div>

curriculum/challenges/english/03-front-end-libraries/react/pass-state-as-props-to-child-components.english.md

@@ -80,7 +80,7 @@ class Navbar extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyApp />, document.getElementById('root'))
 ```
 
@@ -92,7 +92,7 @@ ReactDOM.render(<MyApp />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyApp extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/render-a-class-component-to-the-dom.english.md

@@ -115,7 +115,7 @@ const Vegetables = () => {
 <section id='solution'>
 
 
-```js
+```jsx
 class TypesOfFood extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/render-conditionally-from-props.english.md

@@ -226,7 +226,7 @@ class GameOfChance extends React.Component {
 
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<GameOfChance />, document.getElementById('root'));
 ```
 
@@ -238,7 +238,7 @@ ReactDOM.render(<GameOfChance />, document.getElementById('root'));
 
 <section id='solution'>
 
-```js
+```jsx
 class Results extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/render-html-elements-to-the-dom.english.md

@@ -62,7 +62,7 @@ const JSX = (
 <section id='solution'>
 
 
-```js
+```jsx
 const JSX = (
 <div>
   <h1>Hello World</h1>

curriculum/challenges/english/03-front-end-libraries/react/render-react-on-the-server-with-rendertostring.english.md

@@ -63,7 +63,7 @@ var ReactDOMServer = { renderToString(x) { return null; } };
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<App />, document.getElementById('root'))
 ```
 
@@ -75,7 +75,7 @@ ReactDOM.render(<App />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class App extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/render-state-in-the-user-interface-another-way.english.md

@@ -69,7 +69,7 @@ class MyComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'))
 ```
 
@@ -81,7 +81,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/render-state-in-the-user-interface.english.md

@@ -68,7 +68,7 @@ class MyComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'))
 ```
 
@@ -80,7 +80,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/render-with-an-if-else-condition.english.md

@@ -73,7 +73,7 @@ class MyComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'))
 ```
 
@@ -85,7 +85,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/review-using-props-with-stateless-functional-components.english.md

@@ -76,7 +76,7 @@ var PropTypes = {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<CampSite />, document.getElementById('root'))
 ```
 
@@ -88,7 +88,7 @@ ReactDOM.render(<CampSite />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class CampSite extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/set-state-with-this.setstate.english.md

@@ -79,7 +79,7 @@ class MyComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'))
 ```
 
@@ -91,7 +91,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/use--for-a-more-concise-conditional.english.md

@@ -73,7 +73,7 @@ class MyComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'))
 ```
 
@@ -85,7 +85,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering.english.md

@@ -11,7 +11,7 @@ forumTopicId: 301414
 <section id='description'>
 Before moving on to dynamic rendering techniques, there's one last way to use built-in JavaScript conditionals to render what you want: the <dfn>ternary operator</dfn>. The ternary operator is often utilized as a shortcut for <code>if/else</code> statements in JavaScript. They're not quite as robust as traditional <code>if/else</code> statements, but they are very popular among React developers. One reason for this is because of how JSX is compiled, <code>if/else</code> statements can't be inserted directly into JSX code. You might have noticed this a couple challenges ago &mdash; when an <code>if/else</code> statement was required, it was always <em>outside</em> the <code>return</code> statement. Ternary expressions can be an excellent alternative if you want to implement conditional logic within your JSX. Recall that a ternary operator has three parts, but you can combine several ternary expressions together. Here's the basic syntax:
 
-```js
+```jsx
 condition ? expressionIfTrue : expressionIfFalse;
 ```
 
@@ -200,7 +200,7 @@ class CheckUserAge extends React.Component {
 
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<CheckUserAge />, document.getElementById('root'));
 ```
 
@@ -212,7 +212,7 @@ ReactDOM.render(<CheckUserAge />, document.getElementById('root'));
 
 <section id='solution'>
 
-```js
+```jsx
 const inputStyle = {
   width: 235,
   margin: 5

curriculum/challenges/english/03-front-end-libraries/react/use-advanced-javascript-in-react-render-method.english.md

@@ -205,7 +205,7 @@ class MagicEightBall extends React.Component {
 
 <div id='jsx-teardown'>
 
-```js
+```jsx
 var possibleAnswers = [
   'It is certain',
   'It is decidedly so',
@@ -239,7 +239,7 @@ ReactDOM.render(<MagicEightBall />, document.getElementById('root'));
 
 <section id='solution'>
 
-```js
+```jsx
 const inputStyle = {
   width: 235,
   margin: 5

curriculum/challenges/english/03-front-end-libraries/react/use-array.filter-to-dynamically-filter-an-array.english.md

@@ -157,7 +157,7 @@ class MyComponent extends React.Component {
 
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'));
 ```
 
@@ -169,7 +169,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'));
 
 <section id='solution'>
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/use-array.map-to-dynamically-render-elements.english.md

@@ -152,7 +152,7 @@ class MyToDoList extends React.Component {
 
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyToDoList />, document.getElementById('root'));
 ```
 
@@ -164,7 +164,7 @@ ReactDOM.render(<MyToDoList />, document.getElementById('root'));
 
 <section id='solution'>
 
-```js
+```jsx
 const textAreaStyles = {
   width: 235,
   margin: 5

curriculum/challenges/english/03-front-end-libraries/react/use-default-props.english.md

@@ -53,7 +53,7 @@ const ShoppingCart = (props) => {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<ShoppingCart />, document.getElementById('root'))
 ```
 
@@ -65,7 +65,7 @@ ReactDOM.render(<ShoppingCart />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const ShoppingCart = (props) => {
   return (
     <div>

curriculum/challenges/english/03-front-end-libraries/react/use-proptypes-to-define-the-props-you-expect.english.md

@@ -84,7 +84,7 @@ var PropTypes = {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<ShoppingCart />, document.getElementById('root'))
 ```
 
@@ -96,7 +96,7 @@ ReactDOM.render(<ShoppingCart />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const Items = (props) => {
   return <h1>Current Quantity of Items in Cart: {props.quantity}</h1>
 };

curriculum/challenges/english/03-front-end-libraries/react/use-react-to-render-nested-components.english.md

@@ -89,7 +89,7 @@ class TypesOfFood extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<TypesOfFood />, document.getElementById('root'))
 ```
 
@@ -101,7 +101,7 @@ ReactDOM.render(<TypesOfFood />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 const TypesOfFruit = () => {
   return (
     <div>

curriculum/challenges/english/03-front-end-libraries/react/use-state-to-toggle-an-element.english.md

@@ -11,7 +11,7 @@ forumTopicId: 301421
 <section id='description'>
 Sometimes you might need to know the previous state when updating the state. However, state updates may be asynchronous - this means React may batch multiple <code>setState()</code> calls into a single update. This means you can't rely on the previous value of <code>this.state</code> or <code>this.props</code> when calculating the next value. So, you should not use code like this:
 
-```js
+```jsx
 this.setState({
   counter: this.state.counter + this.props.increment
 });
@@ -19,7 +19,7 @@ this.setState({
 
 Instead, you should pass <code>setState</code> a function that allows you to access state and props. Using a function with <code>setState</code> guarantees you are working with the most current values of state and props. This means that the above should be rewritten as:
 
-```js
+```jsx
 this.setState((state, props) => ({
   counter: state.counter + props.increment
 }));
@@ -27,7 +27,7 @@ this.setState((state, props) => ({
 
 You can also use a form without `props` if you need only the `state`:
 
-```js
+```jsx
 this.setState(state => ({
   counter: state.counter + 1
 }));
@@ -129,7 +129,7 @@ class MyComponent extends React.Component {
 
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'));
 ```
 
@@ -141,7 +141,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'));
 
 <section id='solution'>
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/use-the-lifecycle-method-componentdidmount.english.md

@@ -86,7 +86,7 @@ class MyComponent extends React.Component {
 
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'));
 ```
 
@@ -98,7 +98,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'));
 
 <section id='solution'>
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/use-the-lifecycle-method-componentwillmount.english.md

@@ -68,7 +68,7 @@ class MyComponent extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<MyComponent />, document.getElementById('root'))
 ```
 
@@ -80,7 +80,7 @@ ReactDOM.render(<MyComponent />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class MyComponent extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/react/write-a-react-component-from-scratch.english.md

@@ -54,7 +54,7 @@ tests:
 <section id='solution'>
 
 
-```js
+```jsx
 // Change code below this line
 class MyComponent extends React.Component {
   constructor(props) {

curriculum/challenges/english/03-front-end-libraries/react/write-a-simple-counter.english.md

@@ -75,7 +75,7 @@ class Counter extends React.Component {
 ### After Test
 <div id='jsx-teardown'>
 
-```js
+```jsx
 ReactDOM.render(<Counter />, document.getElementById('root'))
 ```
 
@@ -87,7 +87,7 @@ ReactDOM.render(<Counter />, document.getElementById('root'))
 <section id='solution'>
 
 
-```js
+```jsx
 class Counter extends React.Component {
   constructor(props) {
     super(props);

curriculum/challenges/english/03-front-end-libraries/redux/combine-multiple-reducers.english.md

@@ -48,9 +48,9 @@ tests:
 ## Challenge Seed
 <section id='challengeSeed'>
 
-<div id='jsx-seed'>
+<div id='js-seed'>
 
-```jsx
+```js
 const INCREMENT = 'INCREMENT';
 const DECREMENT = 'DECREMENT';
 

curriculum/challenges/english/03-front-end-libraries/redux/copy-an-object-with-object.assign.english.md

@@ -39,9 +39,9 @@ tests:
 ## Challenge Seed
 <section id='challengeSeed'>
 
-<div id='jsx-seed'>
+<div id='js-seed'>
 
-```jsx
+```js
 const defaultState = {
   user: 'CamperBot',
   status: 'offline',

curriculum/challenges/english/03-front-end-libraries/redux/create-a-redux-store.english.md

@@ -37,9 +37,9 @@ tests:
 ## Challenge Seed
 <section id='challengeSeed'>
 
-<div id='jsx-seed'>
+<div id='js-seed'>
 
-```jsx
+```js
 const reducer = (state = 5) => {
   return state;
 }

curriculum/challenges/english/03-front-end-libraries/redux/define-a-redux-action.english.md

@@ -34,9 +34,9 @@ tests:
 ## Challenge Seed
 <section id='challengeSeed'>
 
-<div id='jsx-seed'>
+<div id='js-seed'>
 
-```jsx
+```js
 // Define an action here:
 
 ```

curriculum/challenges/english/03-front-end-libraries/redux/define-an-action-creator.english.md

@@ -35,9 +35,9 @@ tests:
 ## Challenge Seed
 <section id='challengeSeed'>
 
-<div id='jsx-seed'>
+<div id='js-seed'>
 
-```jsx
+```js
 const action = {
   type: 'LOGIN'
 }

curriculum/challenges/english/03-front-end-libraries/redux/dispatch-an-action-event.english.md

@@ -42,9 +42,9 @@ tests:
 ## Challenge Seed
 <section id='challengeSeed'>
 
-<div id='jsx-seed'>
+<div id='js-seed'>
 
-```jsx
+```js
 const store = Redux.createStore(
   (state = {login: false}) => state
 );

curriculum/challenges/english/03-front-end-libraries/redux/get-state-from-the-redux-store.english.md

@@ -33,9 +33,9 @@ tests:
 ## Challenge Seed
 <section id='challengeSeed'>
 
-<div id='jsx-seed'>
+<div id='js-seed'>
 
-```jsx
+```js
 const store = Redux.createStore(
   (state = 5) => state
 );