<!--
and end a comment with -->
-Add a comment at the top of your HTML that says Only change code above this line.
+Add a comment at the top of your HTML that says Code below this line should not be changed
## Instructions
@@ -25,7 +25,7 @@ Add a comment at the top of your HTML that says Only change code above thi
tests:
- text: You should start a comment with <!--
at the top of your HTML.
testString: assert(code.match(/^\s*.*this line))\s*.*this line.*\s*-->/gi));
- text: You should close your comment with -->
.
testString: assert(code.match(/-->.*\n+.+/g));
@@ -75,7 +75,7 @@ tests:
```html
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/change-text-inside-an-element-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/change-text-inside-an-element-using-jquery.english.md
index 2d59fe0b45..7552617864 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/change-text-inside-an-element-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/change-text-inside-an-element-using-jquery.english.md
@@ -55,7 +55,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/change-the-css-of-an-element-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/change-the-css-of-an-element-using-jquery.english.md
index 9e4b8c4022..b15b43bcac 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/change-the-css-of-an-element-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/change-the-css-of-an-element-using-jquery.english.md
@@ -53,7 +53,7 @@ tests:
});
-
+
jQuery Playground
@@ -98,7 +98,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/clone-an-element-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/clone-an-element-using-jquery.english.md
index d779df304a..207d8bb346 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/clone-an-element-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/clone-an-element-using-jquery.english.md
@@ -52,7 +52,7 @@ tests:
});
-
+
jQuery Playground
@@ -97,7 +97,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/delete-your-jquery-functions.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/delete-your-jquery-functions.english.md
index d0c55db6b0..ed77fab64f 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/delete-your-jquery-functions.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/delete-your-jquery-functions.english.md
@@ -53,7 +53,7 @@ tests:
});
-
+
jQuery Playground
@@ -94,7 +94,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/disable-an-element-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/disable-an-element-using-jquery.english.md
index 541bae5bee..1bb0f9ad57 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/disable-an-element-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/disable-an-element-using-jquery.english.md
@@ -49,7 +49,7 @@ tests:
});
-
+
jQuery Playground
@@ -92,7 +92,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work.english.md
index ca28a3f128..13b93d6444 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work.english.md
@@ -43,7 +43,7 @@ tests:
```html
-
+
jQuery Playground
@@ -82,7 +82,7 @@ tests:
$(document).ready(function() {
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/remove-an-element-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/remove-an-element-using-jquery.english.md
index 4a84648126..fa33eba8be 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/remove-an-element-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/remove-an-element-using-jquery.english.md
@@ -45,7 +45,7 @@ tests:
});
-
+
jQuery Playground
@@ -88,7 +88,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/remove-classes-from-an-element-with-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/remove-classes-from-an-element-with-jquery.english.md
index 08ae77ab77..1fcf3ac659 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/remove-classes-from-an-element-with-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/remove-classes-from-an-element-with-jquery.english.md
@@ -51,7 +51,7 @@ tests:
});
-
+
jQuery Playground
@@ -95,7 +95,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery.english.md
index e3d1de674b..9fda5f05e2 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery.english.md
@@ -59,7 +59,7 @@ tests:
});
-
+
jQuery Playground
@@ -107,7 +107,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/target-elements-by-class-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/target-elements-by-class-using-jquery.english.md
index 31f19497d6..74b1f9ab92 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/target-elements-by-class-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/target-elements-by-class-using-jquery.english.md
@@ -49,7 +49,7 @@ tests:
});
-
+
jQuery Playground
@@ -91,7 +91,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/target-elements-by-id-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/target-elements-by-id-using-jquery.english.md
index b4252963ec..6b034e9110 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/target-elements-by-id-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/target-elements-by-id-using-jquery.english.md
@@ -52,7 +52,7 @@ tests:
});
-
+
jQuery Playground
@@ -95,7 +95,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/target-even-elements-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/target-even-elements-using-jquery.english.md
index a2a5cc2da6..936f8ccd37 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/target-even-elements-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/target-even-elements-using-jquery.english.md
@@ -58,7 +58,7 @@ tests:
});
-
+
jQuery Playground
@@ -108,7 +108,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery.english.md
index 9c30a1fd02..da541db0a5 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery.english.md
@@ -49,7 +49,7 @@ tests:
});
-
+
jQuery Playground
@@ -90,7 +90,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-children-of-an-element-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-children-of-an-element-using-jquery.english.md
index 2c9eed98ea..bf60e9cfb2 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-children-of-an-element-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-children-of-an-element-using-jquery.english.md
@@ -52,7 +52,7 @@ tests:
});
-
+
jQuery Playground
@@ -99,7 +99,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery.english.md
index 1d63b77255..09dbee2549 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery.english.md
@@ -55,7 +55,7 @@ tests:
});
-
+
@@ -103,7 +103,7 @@ tests:
});
-
+
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors.english.md
index 082ce97302..547d609c5c 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors.english.md
@@ -57,7 +57,7 @@ tests:
});
-
+
jQuery Playground
@@ -100,7 +100,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery.english.md
index d937ee8f3a..4d91f796ed 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery.english.md
@@ -50,7 +50,7 @@ tests:
});
-
+
jQuery Playground
@@ -94,7 +94,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/jquery/use-jquery-to-modify-the-entire-page.english.md b/curriculum/challenges/english/03-front-end-libraries/jquery/use-jquery-to-modify-the-entire-page.english.md
index 7f9f6e46b2..a98dea39f4 100644
--- a/curriculum/challenges/english/03-front-end-libraries/jquery/use-jquery-to-modify-the-entire-page.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/jquery/use-jquery-to-modify-the-entire-page.english.md
@@ -54,7 +54,7 @@ tests:
});
-
+
jQuery Playground
@@ -105,7 +105,7 @@ tests:
});
-
+
jQuery Playground
diff --git a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-react.english.md b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-react.english.md
index a8ad10146b..1bbd913f6c 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-react.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-react.english.md
@@ -72,7 +72,7 @@ class Presentational extends React.Component {
};
const connect = ReactRedux.connect;
-// change code below this line
+// Change code below this line
```
@@ -139,7 +139,7 @@ class Presentational extends React.Component {
};
const connect = ReactRedux.connect;
-// change code below this line
+// Change code below this line
const ConnectedComponent = connect(mapStateToProps, mapDispatchToProps)(Presentational);
diff --git a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-the-messages-app.english.md b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-the-messages-app.english.md
index d7548ff326..47ff92f06b 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-the-messages-app.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-the-messages-app.english.md
@@ -129,7 +129,7 @@ const mapDispatchToProps = (dispatch) => {
const Provider = ReactRedux.Provider;
const connect = ReactRedux.connect;
-// define the Container component here:
+// Define the Container component here:
class AppWrapper extends React.Component {
@@ -137,7 +137,7 @@ class AppWrapper extends React.Component {
super(props);
}
render() {
- // complete the return statement:
+ // Complete the return statement:
return (null);
}
};
@@ -248,7 +248,6 @@ const mapDispatchToProps = (dispatch) => {
const Provider = ReactRedux.Provider;
const connect = ReactRedux.connect;
-// define the Container component here:
const Container = connect(mapStateToProps, mapDispatchToProps)(Presentational);
class AppWrapper extends React.Component {
@@ -256,7 +255,6 @@ class AppWrapper extends React.Component {
super(props);
}
render() {
- // complete the return statement:
return (
diff --git a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/extract-state-logic-to-redux.english.md b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/extract-state-logic-to-redux.english.md
index 974e174713..a85d2443df 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/extract-state-logic-to-redux.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/extract-state-logic-to-redux.english.md
@@ -45,7 +45,7 @@ tests:
```jsx
-// define ADD, addMessage(), messageReducer(), and store here:
+// Define ADD, addMessage(), messageReducer(), and store here:
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/getting-started-with-react-redux.english.md b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/getting-started-with-react-redux.english.md
index dfeaa07d2e..1347791d6e 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/getting-started-with-react-redux.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/getting-started-with-react-redux.english.md
@@ -41,9 +41,9 @@ tests:
```jsx
class DisplayMessages extends React.Component {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
render() {
return
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/manage-state-locally-first.english.md b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/manage-state-locally-first.english.md
index 04107a7540..4001699c16 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/manage-state-locally-first.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/manage-state-locally-first.english.md
@@ -56,15 +56,15 @@ class DisplayMessages extends React.Component {
messages: []
}
}
- // add handleChange() and submitMessage() methods here
+ // Add handleChange() and submitMessage() methods here
render() {
return (
Type in a new Message:
- { /* render an input, button, and ul here */ }
+ { /* Render an input, button, and ul below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/map-dispatch-to-props.english.md b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/map-dispatch-to-props.english.md
index 23ece6dc14..0f07d5a1ba 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/map-dispatch-to-props.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/map-dispatch-to-props.english.md
@@ -57,7 +57,7 @@ const addMessage = (message) => {
}
};
-// change code below this line
+// Change code below this line
```
@@ -79,7 +79,7 @@ const addMessage = (message) => {
}
};
-// change code below this line
+// Change code below this line
const mapDispatchToProps = (dispatch) => {
return {
diff --git a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/map-state-to-props.english.md b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/map-state-to-props.english.md
index 4126a83aae..9980eb5707 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/map-state-to-props.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/map-state-to-props.english.md
@@ -44,7 +44,7 @@ tests:
```jsx
const state = [];
-// change code below this line
+// Change code below this line
```
@@ -61,7 +61,7 @@ const state = [];
```js
const state = [];
-// change code below this line
+// Change code below this line
const mapStateToProps = (state) => {
return {
diff --git a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/moving-forward-from-here.english.md b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/moving-forward-from-here.english.md
index 81ab835b4a..92fd5e410c 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/moving-forward-from-here.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/moving-forward-from-here.english.md
@@ -37,28 +37,28 @@ tests:
```jsx
-// import React from 'react'
-// import ReactDOM from 'react-dom'
-// import { Provider, connect } from 'react-redux'
-// import { createStore, combineReducers, applyMiddleware } from 'redux'
-// import thunk from 'redux-thunk'
+/*
+import React from 'react'
+import ReactDOM from 'react-dom'
+import { Provider, connect } from 'react-redux'
+import { createStore, combineReducers, applyMiddleware } from 'redux'
+import thunk from 'redux-thunk'
-// import rootReducer from './redux/reducers'
-// import App from './components/App'
+import rootReducer from './redux/reducers'
+import App from './components/App'
-// const store = createStore(
-// rootReducer,
-// applyMiddleware(thunk)
-// );
+const store = createStore(
+ rootReducer,
+ applyMiddleware(thunk)
+);
-// ReactDOM.render(
-//
-//
-// ,
-// document.getElementById('root')
-// );
-
-// change code below this line
+ReactDOM.render(
+
+
+ ,
+ document.getElementById('root')
+);
+*/
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react.english.md b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react.english.md
index 2235029a87..89b5b43ed2 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react.english.md
@@ -49,7 +49,7 @@ tests:
```jsx
-// Redux Code:
+// Redux:
const ADD = 'ADD';
const addMessage = (message) => {
@@ -75,7 +75,7 @@ const messageReducer = (state = [], action) => {
const store = Redux.createStore(messageReducer);
-// React Code:
+// React:
class DisplayMessages extends React.Component {
constructor(props) {
@@ -125,9 +125,9 @@ class DisplayMessages extends React.Component {
const Provider = ReactRedux.Provider;
class AppWrapper extends React.Component {
- // render the Provider here
+ // Render the Provider below this line
- // change code above this line
+ // Change code above this line
};
```
@@ -150,7 +150,7 @@ ReactDOM.render( , document.getElementById('root'))
```js
-// Redux Code:
+// Redux:
const ADD = 'ADD';
const addMessage = (message) => {
@@ -174,7 +174,7 @@ const messageReducer = (state = [], action) => {
const store = Redux.createStore(messageReducer);
-// React Code:
+// React:
class DisplayMessages extends React.Component {
constructor(props) {
@@ -224,7 +224,7 @@ class DisplayMessages extends React.Component {
const Provider = ReactRedux.Provider;
class AppWrapper extends React.Component {
- // change code below this line
+ // Change code below this line
render() {
return (
@@ -232,7 +232,7 @@ class AppWrapper extends React.Component {
);
}
- // change code above this line
+ // Change code above this line
};
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/access-props-using-this.props.english.md b/curriculum/challenges/english/03-front-end-libraries/react/access-props-using-this.props.english.md
index a6adbaac88..e86ed9ab53 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/access-props-using-this.props.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/access-props-using-this.props.english.md
@@ -51,9 +51,9 @@ class ReturnTempPassword extends React.Component {
render() {
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
Your temporary password is:
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
@@ -70,9 +70,9 @@ class ResetPassword extends React.Component {
Reset Password
We've generated a new temporary password for you.
Please reset this password from your account settings ASAP.
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
@@ -123,9 +123,9 @@ class ResetPassword extends React.Component {
Reset Password
We've generated a new temporary password for you.
Please reset this password from your account settings ASAP.
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/add-event-listeners.english.md b/curriculum/challenges/english/03-front-end-libraries/react/add-event-listeners.english.md
index db39f40e56..c576155d49 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/add-event-listeners.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/add-event-listeners.english.md
@@ -51,14 +51,14 @@ class MyComponent extends React.Component {
this.handleEnter = this.handleEnter.bind(this);
this.handleKeyPress = this.handleKeyPress.bind(this);
}
- // change code below this line
+ // Change code below this line
componentDidMount() {
}
componentWillUnmount() {
}
- // change code above this line
+ // Change code above this line
handleEnter() {
this.setState((state) => ({
message: state.message + 'You pressed the enter key! '
@@ -107,14 +107,14 @@ class MyComponent extends React.Component {
this.handleKeyPress = this.handleKeyPress.bind(this);
this.handleEnter = this.handleEnter.bind(this); }
componentDidMount() {
- // change code below this line
+ // Change code below this line
document.addEventListener('keydown', this.handleKeyPress);
- // change code above this line
+ // Change code above this line
}
componentWillUnmount() {
- // change code below this line
+ // Change code below this line
document.removeEventListener('keydown', this.handleKeyPress);
- // change code above this line
+ // Change code above this line
}
handleEnter() {
this.setState((state) => ({
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/add-inline-styles-in-react.english.md b/curriculum/challenges/english/03-front-end-libraries/react/add-inline-styles-in-react.english.md
index 99de1833bc..0dcfb13de0 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/add-inline-styles-in-react.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/add-inline-styles-in-react.english.md
@@ -14,7 +14,7 @@ All property value length units (like height
, width
, a
## Instructions
-If you have a large set of styles, you can assign a style object
to a constant to keep your code organized. Uncomment the styles
constant and declare an object
with three style properties and their values. Give the div
a color of "purple"
, a font-size of 40
, and a border of "2px solid purple"
. Then set the style
attribute equal to the styles
constant.
+If you have a large set of styles, you can assign a style object
to a constant to keep your code organized. Initialize a styles
constant and assign an object
with three style properties and their values to it. Give the div
a color of "purple"
, a font-size of 40
, and a border of "2px solid purple"
. Then set the style
attribute equal to the styles
constant.
## Tests
@@ -46,15 +46,15 @@ tests:
```jsx
-// const styles =
-// change code above this line
+
+// Change code above this line
class Colorful extends React.Component {
render() {
- // change code below this line
+ // Change code below this line
return (
Style Me!
);
- // change code above this line
+ // Change code above this line
}
};
@@ -84,14 +84,14 @@ const styles = {
fontSize: 40,
border: "2px solid purple"
};
-// change code above this line
+// Change code above this line
class Colorful extends React.Component {
render() {
- // change code below this line
+ // Change code below this line
return (
Style Me!
- // change code above this line
);
+ // Change code above this line
}
};
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/bind-this-to-a-class-method.english.md b/curriculum/challenges/english/03-front-end-libraries/react/bind-this-to-a-class-method.english.md
index 8e29ff086c..76474eb4fa 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/bind-this-to-a-class-method.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/bind-this-to-a-class-method.english.md
@@ -48,9 +48,9 @@ class MyComponent extends React.Component {
this.state = {
text: "Hello"
};
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
}
handleClick() {
this.setState({
@@ -60,9 +60,9 @@ class MyComponent extends React.Component {
render() {
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
{this.state.text}
);
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/change-inline-css-conditionally-based-on-component-state.english.md b/curriculum/challenges/english/03-front-end-libraries/react/change-inline-css-conditionally-based-on-component-state.english.md
index c70087c378..f0d853eaa9 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/change-inline-css-conditionally-based-on-component-state.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/change-inline-css-conditionally-based-on-component-state.english.md
@@ -59,9 +59,9 @@ class GateKeeper extends React.Component {
let inputStyle = {
border: '1px solid black'
};
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
return (
Don't Type Too Much:
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/compose-react-components.english.md b/curriculum/challenges/english/03-front-end-libraries/react/compose-react-components.english.md
index 39ed995f2c..8bb9ac0a74 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/compose-react-components.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/compose-react-components.english.md
@@ -49,9 +49,9 @@ class Fruits extends React.Component {
return (
Fruits:
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
@@ -65,9 +65,9 @@ class TypesOfFood extends React.Component {
return (
Types of Food:
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
@@ -153,10 +153,10 @@ class Fruits extends React.Component {
return (
Fruits:
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
)
}
@@ -170,9 +170,9 @@ class TypesOfFood extends React.Component {
return (
Types of Food:
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/create-a-complex-jsx-element.english.md b/curriculum/challenges/english/03-front-end-libraries/react/create-a-complex-jsx-element.english.md
index d128b1c52f..8f795b751d 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/create-a-complex-jsx-element.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/create-a-complex-jsx-element.english.md
@@ -66,7 +66,7 @@ tests:
```jsx
-// write your code here
+
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/create-a-component-with-composition.english.md b/curriculum/challenges/english/03-front-end-libraries/react/create-a-component-with-composition.english.md
index d15b8df6b9..e7503ec9c0 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/create-a-component-with-composition.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/create-a-component-with-composition.english.md
@@ -68,10 +68,10 @@ class ParentComponent extends React.Component {
return (
I am the parent
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
@@ -113,9 +113,9 @@ class ParentComponent extends React.Component {
return (
I am the parent
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-form.english.md b/curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-form.english.md
index 36fab329c6..28a24a44f7 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-form.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-form.english.md
@@ -124,22 +124,22 @@ class MyForm extends React.Component {
});
}
handleSubmit(event) {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
}
render() {
return (
- {/* change code below this line */}
+ {/* Change code below this line */}
- {/* change code above this line */}
+ {/* Change code above this line */}
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-input.english.md b/curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-input.english.md
index ba636795d7..0ab8e05a9f 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-input.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-input.english.md
@@ -48,19 +48,19 @@ class ControlledInput extends React.Component {
this.state = {
input: ''
};
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
}
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
render() {
return (
- { /* change code below this line */}
+ { /* Change code below this line */}
- { /* change code above this line */}
+ { /* Change code above this line */}
Controlled Input:
{this.state.input}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/create-a-react-component.english.md b/curriculum/challenges/english/03-front-end-libraries/react/create-a-react-component.english.md
index 9ce563e693..0c2f3c2147 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/create-a-react-component.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/create-a-react-component.english.md
@@ -61,11 +61,11 @@ class MyComponent extends React.Component {
super(props);
}
render() {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
}
};
```
@@ -94,13 +94,13 @@ class MyComponent extends React.Component {
super(props);
}
render() {
- // change code below this line
+ // Change code below this line
return (
Hello React!
);
- // change code above this line
+ // Change code above this line
}
};
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/create-a-stateful-component.english.md b/curriculum/challenges/english/03-front-end-libraries/react/create-a-stateful-component.english.md
index 638d733e9e..a6d610dc95 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/create-a-stateful-component.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/create-a-stateful-component.english.md
@@ -53,8 +53,9 @@ tests:
class StatefulComponent extends React.Component {
constructor(props) {
super(props);
- // initialize state here
+ // Only change code below this line
+ // Only change code above this line
}
render() {
return (
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/create-a-stateless-functional-component.english.md b/curriculum/challenges/english/03-front-end-libraries/react/create-a-stateless-functional-component.english.md
index 82cefd8198..268ae9d016 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/create-a-stateless-functional-component.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/create-a-stateless-functional-component.english.md
@@ -53,11 +53,11 @@ tests:
```jsx
const MyComponent = function() {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
}
```
@@ -81,13 +81,13 @@ ReactDOM.render( , document.getElementById('root'))
```js
const MyComponent = function() {
- // change code below this line
+ // Change code below this line
return (
Demo Solution
);
- // change code above this line
+ // Change code above this line
}
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/give-sibling-elements-a-unique-key-attribute.english.md b/curriculum/challenges/english/03-front-end-libraries/react/give-sibling-elements-a-unique-key-attribute.english.md
index b27a20394d..00b693c86b 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/give-sibling-elements-a-unique-key-attribute.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/give-sibling-elements-a-unique-key-attribute.english.md
@@ -56,7 +56,7 @@ const frontEndFrameworks = [
];
function Frameworks() {
- const renderFrameworks = null; // change code here
+ const renderFrameworks = null; // Change this line
return (
Popular Front End JavaScript Frameworks
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/learn-about-self-closing-jsx-tags.english.md b/curriculum/challenges/english/03-front-end-libraries/react/learn-about-self-closing-jsx-tags.english.md
index 3b751ac1e0..4a8144932b 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/learn-about-self-closing-jsx-tags.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/learn-about-self-closing-jsx-tags.english.md
@@ -44,11 +44,9 @@ tests:
```jsx
const JSX = (
- {/* remove comment and change code below this line
Welcome to React!
Be sure to close all tags!
- remove comment and change code above this line */}
);
@@ -75,11 +73,9 @@ ReactDOM.render(JSX, document.getElementById('root'))
```js
const JSX = (
- {/* change code below this line */}
Welcome to React!
Be sure to close all tags!
- {/* change code above this line */}
);
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate.english.md b/curriculum/challenges/english/03-front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate.english.md
index c5e2fa4461..fbe95d1432 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate.english.md
@@ -84,9 +84,9 @@ class OnlyEvens extends React.Component {
}
shouldComponentUpdate(nextProps, nextState) {
console.log('Should I update?');
- // change code below this line
+ // Change code below this line
return true;
- // change code above this line
+ // Change code above this line
}
componentDidUpdate() {
console.log('Component re-rendered.');
@@ -145,9 +145,9 @@ class OnlyEvens extends React.Component {
}
shouldComponentUpdate(nextProps, nextState) {
console.log('Should I update?');
- // change code below this line
+ // Change code below this line
return nextProps.value % 2 === 0;
- // change code above this line
+ // Change code above this line
}
componentDidUpdate() {
console.log('Component re-rendered.');
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/override-default-props.english.md b/curriculum/challenges/english/03-front-end-libraries/react/override-default-props.english.md
index 4bfe3495e3..4e8d6b3b13 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/override-default-props.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/override-default-props.english.md
@@ -52,9 +52,9 @@ class ShoppingCart extends React.Component {
super(props);
}
render() {
- { /* change code below this line */ }
+ { /* Change code below this line */ }
return
- { /* change code above this line */ }
+ { /* Change code above this line */ }
}
};
```
@@ -91,9 +91,9 @@ class ShoppingCart extends React.Component {
super(props);
}
render() {
- { /* change code below this line */ }
+ { /* Change code below this line */ }
return
- { /* change code above this line */ }
+ { /* Change code above this line */ }
}
};
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/pass-a-callback-as-props.english.md b/curriculum/challenges/english/03-front-end-libraries/react/pass-a-callback-as-props.english.md
index 7f6d11ac64..eb6a997ed6 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/pass-a-callback-as-props.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/pass-a-callback-as-props.english.md
@@ -59,9 +59,9 @@ class MyApp extends React.Component {
render() {
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/pass-an-array-as-props.english.md b/curriculum/challenges/english/03-front-end-libraries/react/pass-an-array-as-props.english.md
index bf82814a5d..e75cdd8720 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/pass-an-array-as-props.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/pass-an-array-as-props.english.md
@@ -66,9 +66,9 @@ tests:
```jsx
const List = (props) => {
- { /* change code below this line */ }
+ { /* Change code below this line */ }
return {}
- { /* change code above this line */ }
+ { /* Change code above this line */ }
};
class ToDo extends React.Component {
@@ -80,11 +80,11 @@ class ToDo extends React.Component {
To Do Lists
Today
- { /* change code below this line */ }
+ { /* Change code below this line */ }
Tomorrow
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/pass-props-to-a-stateless-functional-component.english.md b/curriculum/challenges/english/03-front-end-libraries/react/pass-props-to-a-stateless-functional-component.english.md
index 309767753a..77865229c9 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/pass-props-to-a-stateless-functional-component.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/pass-props-to-a-stateless-functional-component.english.md
@@ -63,9 +63,9 @@ tests:
const CurrentDate = (props) => {
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
The current date is:
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
};
@@ -78,9 +78,9 @@ class Calendar extends React.Component {
return (
What date is it?
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
@@ -109,9 +109,9 @@ ReactDOM.render( , document.getElementById('root'))
const CurrentDate = (props) => {
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
The current date is: {props.date}
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
};
@@ -124,9 +124,9 @@ class Calendar extends React.Component {
return (
What date is it?
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/pass-state-as-props-to-child-components.english.md b/curriculum/challenges/english/03-front-end-libraries/react/pass-state-as-props-to-child-components.english.md
index aeb220c4d9..3f95623d5f 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/pass-state-as-props-to-child-components.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/pass-state-as-props-to-child-components.english.md
@@ -15,7 +15,7 @@ This pattern illustrates some important paradigms in React. The first is uni
## Instructions
-The MyApp
component is stateful and renders a Navbar
component as a child. Pass the name
property in its state
down to the child component, then show the name
in the h1
tag that's part of the Navbar
render method.
+The MyApp
component is stateful and renders a Navbar
component as a child. Pass the name
property in its state
down to the child component, then show the name
in the h1
tag that's part of the Navbar
render method. name
should appear after the text Hello, my name is:
.
## Tests
@@ -50,7 +50,9 @@ class MyApp extends React.Component {
render() {
return (
-
+ {/* Change code below this line */}
+
+ {/* Change code above this line */}
);
}
@@ -63,7 +65,9 @@ class Navbar extends React.Component {
render() {
return (
- Hello, my name is: {/* your code here */}
+ {/* Change code below this line */}
+ Hello, my name is:
+ {/* Change code above this line */}
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/render-a-class-component-to-the-dom.english.md b/curriculum/challenges/english/03-front-end-libraries/react/render-a-class-component-to-the-dom.english.md
index 878027ccd9..e4be436c08 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/render-a-class-component-to-the-dom.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/render-a-class-component-to-the-dom.english.md
@@ -51,15 +51,15 @@ class TypesOfFood extends React.Component {
return (
Types of Food:
- {/* change code below this line */}
+ {/* Change code below this line */}
- {/* change code above this line */}
+ {/* Change code above this line */}
);
}
};
-// change code below this line
+// Change code below this line
```
@@ -124,16 +124,16 @@ class TypesOfFood extends React.Component {
return (
Types of Food:
- {/* change code below this line */}
+ {/* Change code below this line */}
- {/* change code above this line */}
+ {/* Change code above this line */}
);
}
};
-// change code below this line
+// Change code below this line
ReactDOM.render( , document.getElementById('challenge-node'));
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/render-conditionally-from-props.english.md b/curriculum/challenges/english/03-front-end-libraries/react/render-conditionally-from-props.english.md
index e8a5f601ee..43e713c225 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/render-conditionally-from-props.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/render-conditionally-from-props.english.md
@@ -18,7 +18,7 @@ In this challenge, you'll set up a child component to make rendering decisions b
The code editor has two components that are partially defined for you: a parent called GameOfChance
, and a child called Results
. They are used to create a simple game where the user presses a button to see if they win or lose.
First, you'll need a simple expression that randomly returns a different value every time it is run. You can use Math.random()
. This method returns a value between 0
(inclusive) and 1
(exclusive) each time it is called. So for 50/50 odds, use Math.random() >= .5
in your expression. Statistically speaking, this expression will return true
50% of the time, and false
the other 50%. On line 30, replace the comment with this expression to complete the variable declaration.
-Now you have an expression that you can use to make a randomized decision in the code. Next you need to implement this. Render the Results
component as a child of GameOfChance
, and pass in expression
as a prop called fiftyFifty
. In the Results
component, write a ternary expression to render the text "You Win!"
or "You Lose!"
based on the fiftyFifty
prop that's being passed in from GameOfChance
. Finally, make sure the handleClick()
method is correctly counting each turn so the user knows how many times they've played. This also serves to let the user know the component has actually updated in case they win or lose twice in a row.
+Now you have an expression that you can use to make a randomized decision in the code. Next you need to implement this. Render the Results
component as a child of GameOfChance
, and pass in expression
as a prop called fiftyFifty
. In the Results
component, write a ternary expression to render the h1
element with the text "You Win!"
or "You Lose!"
based on the fiftyFifty
prop that's being passed in from GameOfChance
. Finally, make sure the handleClick()
method is correctly counting each turn so the user knows how many times they've played. This also serves to let the user know the component has actually updated in case they win or lose twice in a row.
## Tests
@@ -186,7 +186,9 @@ class Results extends React.Component {
super(props);
}
render() {
- return {/* change code here */}
;
+ {/* Change code below this line */}
+ return ;
+ {/* Change code above this line */}
}
}
@@ -200,17 +202,17 @@ class GameOfChance extends React.Component {
}
handleClick() {
this.setState({
- counter: 0 // change code here
+ counter: 0 // Change this line
});
}
render() {
- const expression = null; // change code here
+ const expression = null; // Change this line
return (
- {/* change code below this line */}
+ {/* Change code below this line */}
- {/* change code above this line */}
+ {/* Change code above this line */}
{'Turn: ' + this.state.counter}
);
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/render-html-elements-to-the-dom.english.md b/curriculum/challenges/english/03-front-end-libraries/react/render-html-elements-to-the-dom.english.md
index c99700fa36..c702cbbe37 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/render-html-elements-to-the-dom.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/render-html-elements-to-the-dom.english.md
@@ -48,7 +48,7 @@ const JSX = (
Lets render this to the DOM
);
-// change code below this line
+// Change code below this line
```
@@ -69,7 +69,7 @@ const JSX = (
Lets render this to the DOM
);
-// change code below this line
+// Change code below this line
ReactDOM.render(JSX, document.getElementById('challenge-node'));
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/render-react-on-the-server-with-rendertostring.english.md b/curriculum/challenges/english/03-front-end-libraries/react/render-react-on-the-server-with-rendertostring.english.md
index 2c210a68f0..f207e79e10 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/render-react-on-the-server-with-rendertostring.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/render-react-on-the-server-with-rendertostring.english.md
@@ -45,7 +45,7 @@ class App extends React.Component {
}
};
-// change code below this line
+// Change code below this line
```
@@ -85,7 +85,7 @@ class App extends React.Component {
}
};
-// change code below this line
+// Change code below this line
ReactDOMServer.renderToString( );
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/render-state-in-the-user-interface-another-way.english.md b/curriculum/challenges/english/03-front-end-libraries/react/render-state-in-the-user-interface-another-way.english.md
index 82a2fc86c3..30b04ea014 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/render-state-in-the-user-interface-another-way.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/render-state-in-the-user-interface-another-way.english.md
@@ -49,14 +49,14 @@ class MyComponent extends React.Component {
}
}
render() {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
@@ -90,14 +90,14 @@ class MyComponent extends React.Component {
}
}
render() {
- // change code below this line
+ // Change code below this line
const name = this.state.name;
- // change code above this line
+ // Change code above this line
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
{name}
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/render-state-in-the-user-interface.english.md b/curriculum/challenges/english/03-front-end-libraries/react/render-state-in-the-user-interface.english.md
index 4160df69fa..e8339d070e 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/render-state-in-the-user-interface.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/render-state-in-the-user-interface.english.md
@@ -53,9 +53,9 @@ class MyComponent extends React.Component {
render() {
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
@@ -91,9 +91,9 @@ class MyComponent extends React.Component {
render() {
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
{this.state.name}
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/render-with-an-if-else-condition.english.md b/curriculum/challenges/english/03-front-end-libraries/react/render-with-an-if-else-condition.english.md
index 096c87d87b..b38b143b9f 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/render-with-an-if-else-condition.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/render-with-an-if-else-condition.english.md
@@ -55,7 +55,7 @@ class MyComponent extends React.Component {
}));
}
render() {
- // change code below this line
+ // Change code below this line
return (
@@ -100,7 +100,7 @@ class MyComponent extends React.Component {
}));
}
render() {
- // change code below this line
+ // Change code below this line
if (this.state.display) {
return (
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/review-using-props-with-stateless-functional-components.english.md b/curriculum/challenges/english/03-front-end-libraries/react/review-using-props-with-stateless-functional-components.english.md
index 434d099fcd..541b44201e 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/review-using-props-with-stateless-functional-components.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/review-using-props-with-stateless-functional-components.english.md
@@ -56,7 +56,7 @@ class CampSite extends React.Component {
);
}
};
-// change code below this line
+// Change code below this line
```
@@ -101,7 +101,7 @@ class CampSite extends React.Component {
);
}
};
-// change code below this line
+// Change code below this line
const Camper = (props) => {
return (
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/set-state-with-this.setstate.english.md b/curriculum/challenges/english/03-front-end-libraries/react/set-state-with-this.setstate.english.md
index fae909c0d9..96d3e8c6bf 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/set-state-with-this.setstate.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/set-state-with-this.setstate.english.md
@@ -58,9 +58,9 @@ class MyComponent extends React.Component {
this.handleClick = this.handleClick.bind(this);
}
handleClick() {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
}
render() {
return (
@@ -101,11 +101,11 @@ class MyComponent extends React.Component {
this.handleClick = this.handleClick.bind(this);
}
handleClick() {
- // change code below this line
+ // Change code below this line
this.setState({
name: 'React Rocks!'
});
- // change code above this line
+ // Change code above this line
}
render() {
return (
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/use--for-a-more-concise-conditional.english.md b/curriculum/challenges/english/03-front-end-libraries/react/use--for-a-more-concise-conditional.english.md
index 4f82ee2bb5..9cd142b0f6 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/use--for-a-more-concise-conditional.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/use--for-a-more-concise-conditional.english.md
@@ -56,7 +56,7 @@ class MyComponent extends React.Component {
}));
}
render() {
- // change code below this line
+ // Change code below this line
return (
@@ -100,7 +100,7 @@ class MyComponent extends React.Component {
}));
}
render() {
- // change code below this line
+ // Change code below this line
return (
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering.english.md b/curriculum/challenges/english/03-front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering.english.md
index 5f4cb77b2f..b63906ffd6 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering.english.md
@@ -154,9 +154,9 @@ const inputStyle = {
class CheckUserAge extends React.Component {
constructor(props) {
super(props);
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
this.submit = this.submit.bind(this);
this.handleChange = this.handleChange.bind(this);
}
@@ -185,7 +185,9 @@ class CheckUserAge extends React.Component {
onChange={this.handleChange}
/>
- {/* change code here */}
+ {/* Change code below this line */}
+
+ {/* Change code above this line */}
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/use-advanced-javascript-in-react-render-method.english.md b/curriculum/challenges/english/03-front-end-libraries/react/use-advanced-javascript-in-react-render-method.english.md
index e8ac73694f..21c80f6829 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/use-advanced-javascript-in-react-render-method.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/use-advanced-javascript-in-react-render-method.english.md
@@ -175,7 +175,7 @@ class MagicEightBall extends React.Component {
'Outlook not so good',
'Very doubtful'
];
- const answer = 'change me!'; // << change code here
+ const answer = 'change me!'; // Change this line
return (
Answer:
- {/* change code below this line */}
+ {/* Change code below this line */}
- {/* change code above this line */}
+ {/* Change code above this line */}
);
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/use-array.filter-to-dynamically-filter-an-array.english.md b/curriculum/challenges/english/03-front-end-libraries/react/use-array.filter-to-dynamically-filter-an-array.english.md
index d49fa0f691..117bedba6e 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/use-array.filter-to-dynamically-filter-an-array.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/use-array.filter-to-dynamically-filter-an-array.english.md
@@ -139,8 +139,8 @@ class MyComponent extends React.Component {
};
}
render() {
- const usersOnline = null; // change code here
- const renderOnline = null; // change code here
+ const usersOnline = null; // Change this line
+ const renderOnline = null; // Change this line
return (
Current Online Users:
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/use-array.map-to-dynamically-render-elements.english.md b/curriculum/challenges/english/03-front-end-libraries/react/use-array.map-to-dynamically-render-elements.english.md
index d7528591a4..aeb5883cd9 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/use-array.map-to-dynamically-render-elements.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/use-array.map-to-dynamically-render-elements.english.md
@@ -109,9 +109,9 @@ const textAreaStyles = {
class MyToDoList extends React.Component {
constructor(props) {
super(props);
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
this.handleSubmit = this.handleSubmit.bind(this);
this.handleChange = this.handleChange.bind(this);
}
@@ -127,7 +127,7 @@ class MyToDoList extends React.Component {
});
}
render() {
- const items = null; // change code here
+ const items = null; // Change this line
return (
)
};
-// change code below this line
+// Change code below this line
```
@@ -74,7 +74,7 @@ const ShoppingCart = (props) => {
)
};
-// change code below this line
+// Change code below this line
ShoppingCart.defaultProps = {
items: 0
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/use-proptypes-to-define-the-props-you-expect.english.md b/curriculum/challenges/english/03-front-end-libraries/react/use-proptypes-to-define-the-props-you-expect.english.md
index d95c26a3fa..30a91a9da3 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/use-proptypes-to-define-the-props-you-expect.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/use-proptypes-to-define-the-props-you-expect.english.md
@@ -49,9 +49,9 @@ const Items = (props) => {
return Current Quantity of Items in Cart: {props.quantity}
};
-// change code below this line
+// Change code below this line
-// change code above this line
+// Change code above this line
Items.defaultProps = {
quantity: 0
@@ -101,11 +101,11 @@ const Items = (props) => {
return Current Quantity of Items in Cart: {props.quantity}
};
-// change code below this line
+// Change code below this line
Items.propTypes = {
quantity: PropTypes.number.isRequired
};
-// change code above this line
+// Change code above this line
Items.defaultProps = {
quantity: 0
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/use-react-to-render-nested-components.english.md b/curriculum/challenges/english/03-front-end-libraries/react/use-react-to-render-nested-components.english.md
index b935e639cb..83521b92b8 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/use-react-to-render-nested-components.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/use-react-to-render-nested-components.english.md
@@ -58,9 +58,9 @@ const TypesOfFruit = () => {
const Fruits = () => {
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
};
@@ -74,9 +74,9 @@ class TypesOfFood extends React.Component {
return (
Types of Food:
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
@@ -119,9 +119,9 @@ const TypesOfFruit = () => {
const Fruits = () => {
return (
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
};
@@ -135,9 +135,9 @@ class TypesOfFood extends React.Component {
return (
Types of Food:
- { /* change code below this line */ }
+ { /* Change code below this line */ }
- { /* change code above this line */ }
+ { /* Change code above this line */ }
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/use-state-to-toggle-an-element.english.md b/curriculum/challenges/english/03-front-end-libraries/react/use-state-to-toggle-an-element.english.md
index d99ba59335..08109c3017 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/use-state-to-toggle-an-element.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/use-state-to-toggle-an-element.english.md
@@ -97,13 +97,13 @@ class MyComponent extends React.Component {
this.state = {
visibility: false
};
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
}
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
render() {
if (this.state.visibility) {
return (
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/use-the-lifecycle-method-componentdidmount.english.md b/curriculum/challenges/english/03-front-end-libraries/react/use-the-lifecycle-method-componentdidmount.english.md
index 1e86dd0aa1..b24877f80b 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/use-the-lifecycle-method-componentdidmount.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/use-the-lifecycle-method-componentdidmount.english.md
@@ -16,7 +16,7 @@ The best practice with React is to place API calls or any calls to your server i
## Instructions
-There is a mock API call in componentDidMount()
. It sets state after 2.5 seconds to simulate calling a server to retrieve data. This example requests the current total active users for a site. In the render method, render the value of activeUsers
in the h1
. Watch what happens in the preview, and feel free to change the timeout to see the different effects.
+There is a mock API call in componentDidMount()
. It sets state after 2.5 seconds to simulate calling a server to retrieve data. This example requests the current total active users for a site. In the render method, render the value of activeUsers
in the h1
after the text Active Users:
. Watch what happens in the preview, and feel free to change the timeout to see the different effects.
## Tests
@@ -71,7 +71,9 @@ class MyComponent extends React.Component {
render() {
return (
- Active Users: {/* change code here */}
+ {/* Change code below this line */}
+ Active Users:
+ {/* Change code below this line */}
);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/use-the-lifecycle-method-componentwillmount.english.md b/curriculum/challenges/english/03-front-end-libraries/react/use-the-lifecycle-method-componentwillmount.english.md
index fd8746556b..ed8c1f2163 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/use-the-lifecycle-method-componentwillmount.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/use-the-lifecycle-method-componentwillmount.english.md
@@ -52,9 +52,9 @@ class MyComponent extends React.Component {
super(props);
}
componentWillMount() {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
}
render() {
return
@@ -86,9 +86,9 @@ class MyComponent extends React.Component {
super(props);
}
componentWillMount() {
- // change code below this line
+ // Change code below this line
console.log('Component is mounting...');
- // change code above this line
+ // Change code above this line
}
render() {
return
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/write-a-react-component-from-scratch.english.md b/curriculum/challenges/english/03-front-end-libraries/react/write-a-react-component-from-scratch.english.md
index 56849094bf..517fe3f053 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/write-a-react-component-from-scratch.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/write-a-react-component-from-scratch.english.md
@@ -40,7 +40,7 @@ tests:
```jsx
-// change code below this line
+// Change code below this line
```
@@ -55,7 +55,7 @@ tests:
```js
-// change code below this line
+// Change code below this line
class MyComponent extends React.Component {
constructor(props) {
super(props);
diff --git a/curriculum/challenges/english/03-front-end-libraries/react/write-a-simple-counter.english.md b/curriculum/challenges/english/03-front-end-libraries/react/write-a-simple-counter.english.md
index 4ea045bed9..1358e30fed 100644
--- a/curriculum/challenges/english/03-front-end-libraries/react/write-a-simple-counter.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/react/write-a-simple-counter.english.md
@@ -49,13 +49,13 @@ class Counter extends React.Component {
this.state = {
count: 0
};
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
}
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
render() {
return (
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/combine-multiple-reducers.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/combine-multiple-reducers.english.md
index 092c6bb390..d0adaefed4 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/combine-multiple-reducers.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/combine-multiple-reducers.english.md
@@ -83,7 +83,7 @@ const authReducer = (state = {authenticated: false}, action) => {
}
};
-const rootReducer = // define the root reducer here
+const rootReducer = // Define the root reducer here
const store = Redux.createStore(rootReducer);
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/copy-an-object-with-object.assign.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/copy-an-object-with-object.assign.english.md
index 0dc72b0733..3432b1efef 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/copy-an-object-with-object.assign.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/copy-an-object-with-object.assign.english.md
@@ -52,7 +52,7 @@ const defaultState = {
const immutableReducer = (state = defaultState, action) => {
switch(action.type) {
case 'ONLINE':
- // don't mutate state here or the tests will fail
+ // Don't mutate state here or the tests will fail
return
default:
return state;
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/create-a-redux-store.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/create-a-redux-store.english.md
index 5b1b8bc9bd..f8eec12781 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/create-a-redux-store.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/create-a-redux-store.english.md
@@ -48,7 +48,6 @@ const reducer = (state = 5) => {
// For example: Redux.createStore()
// Define the store here:
-
```
@@ -66,10 +65,6 @@ const reducer = (state = 5) => {
return state;
}
-// Redux methods are available from a Redux object
-// For example: Redux.createStore()
-// Define the store here:
-
const store = Redux.createStore(reducer);
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/define-an-action-creator.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/define-an-action-creator.english.md
index 9ac5390a95..093c95e9d5 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/define-an-action-creator.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/define-an-action-creator.english.md
@@ -59,7 +59,6 @@ const action = {
const action = {
type: 'LOGIN'
}
-// Define an action creator here:
const actionCreator = () => {
return action;
};
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/dispatch-an-action-event.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/dispatch-an-action-event.english.md
index b79cf5d9f0..ca4294bb41 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/dispatch-an-action-event.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/dispatch-an-action-event.english.md
@@ -80,7 +80,6 @@ const loginAction = () => {
}
};
-// Dispatch the action here:
store.dispatch(loginAction());
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/get-state-from-the-redux-store.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/get-state-from-the-redux-store.english.md
index 6c5a0a4494..32b9839f99 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/get-state-from-the-redux-store.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/get-state-from-the-redux-store.english.md
@@ -40,7 +40,7 @@ const store = Redux.createStore(
(state = 5) => state
);
-// change code below this line
+// Change code below this line
```
@@ -59,7 +59,7 @@ const store = Redux.createStore(
(state = 5) => state
);
-// change code below this line
+// Change code below this line
const currentState = store.getState();
```
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/handle-an-action-in-the-store.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/handle-an-action-in-the-store.english.md
index e52506c01d..6bb5ce68e4 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/handle-an-action-in-the-store.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/handle-an-action-in-the-store.english.md
@@ -46,9 +46,9 @@ const defaultState = {
};
const reducer = (state = defaultState, action) => {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
};
const store = Redux.createStore(reducer);
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/never-mutate-state.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/never-mutate-state.english.md
index 0985cb212d..9536c6677e 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/never-mutate-state.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/never-mutate-state.english.md
@@ -53,14 +53,13 @@ const todos = [
const immutableReducer = (state = todos, action) => {
switch(action.type) {
case ADD_TO_DO:
- // don't mutate state here or the tests will fail
+ // Don't mutate state here or the tests will fail
return
default:
return state;
}
};
-// an example todo argument would be 'Learn React',
const addToDo = (todo) => {
return {
type: ADD_TO_DO,
@@ -84,7 +83,6 @@ const store = Redux.createStore(immutableReducer);
```js
const ADD_TO_DO = 'ADD_TO_DO';
-// A list of strings representing tasks to do:
const todos = [
'Go to the store',
'Clean the house',
@@ -101,7 +99,6 @@ const immutableReducer = (state = todos, action) => {
}
};
-// an example todo argument would be 'Learn React',
const addToDo = (todo) => {
return {
type: ADD_TO_DO,
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/register-a-store-listener.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/register-a-store-listener.english.md
index 7ed3ce2d13..1e96ff2fbd 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/register-a-store-listener.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/register-a-store-listener.english.md
@@ -51,12 +51,12 @@ const reducer = (state = 0, action) => {
const store = Redux.createStore(reducer);
-// global count variable:
+// Global count variable:
let count = 0;
-// change code below this line
+// Change code below this line
-// change code above this line
+// Change code above this line
store.dispatch({type: ADD});
console.log(count);
@@ -98,7 +98,7 @@ const reducer = (state = 0, action) => {
const store = Redux.createStore(reducer);
let count = 0;
-// change code below this line
+// Change code below this line
store.subscribe( () =>
{
@@ -106,7 +106,7 @@ store.subscribe( () =>
}
);
-// change code above this line
+// Change code above this line
store.dispatch({type: ADD});
store.dispatch({type: ADD});
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/remove-an-item-from-an-array.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/remove-an-item-from-an-array.english.md
index fe93479034..a19ccd92c3 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/remove-an-item-from-an-array.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/remove-an-item-from-an-array.english.md
@@ -41,7 +41,7 @@ tests:
const immutableReducer = (state = [0,1,2,3,4,5], action) => {
switch(action.type) {
case 'REMOVE_ITEM':
- // don't mutate state here or the tests will fail
+ // Don't mutate state here or the tests will fail
return
default:
return state;
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/send-action-data-to-the-store.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/send-action-data-to-the-store.english.md
index 238a12e5f9..95dc715173 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/send-action-data-to-the-store.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/send-action-data-to-the-store.english.md
@@ -42,18 +42,18 @@ const ADD_NOTE = 'ADD_NOTE';
const notesReducer = (state = 'Initial State', action) => {
switch(action.type) {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
default:
return state;
}
};
const addNoteText = (note) => {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
};
const store = Redux.createStore(notesReducer);
@@ -78,22 +78,22 @@ const ADD_NOTE = 'ADD_NOTE';
const notesReducer = (state = 'Initial State', action) => {
switch(action.type) {
- // change code below this line
+ // Change code below this line
case ADD_NOTE:
return action.text;
- // change code above this line
+ // Change code above this line
default:
return state;
}
};
const addNoteText = (note) => {
- // change code below this line
+ // Change code below this line
return {
type: ADD_NOTE,
text: note
}
- // change code above this line
+ // Change code above this line
};
const store = Redux.createStore(notesReducer);
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions.english.md
index 690df9e2f6..6656c8b10d 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions.english.md
@@ -50,9 +50,9 @@ const defaultState = {
};
const authReducer = (state = defaultState, action) => {
- // change code below this line
+ // Change code below this line
- // change code above this line
+ // Change code above this line
};
const store = Redux.createStore(authReducer);
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/use-const-for-action-types.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/use-const-for-action-types.english.md
index c105bc0b70..e450b16872 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/use-const-for-action-types.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/use-const-for-action-types.english.md
@@ -49,9 +49,9 @@ tests:
```jsx
-// change code below this line
+// Change code below this line
-// change code above this line
+// Change code above this line
const defaultState = {
authenticated: false
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions.english.md
index ed5f26d1fc..a6bac90242 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions.english.md
@@ -53,13 +53,13 @@ const receivedData = (data) => { return {type: RECEIVED_DATA, users: data.users}
const handleAsync = () => {
return function(dispatch) {
- // dispatch request action here
+ // Dispatch request action here
setTimeout(function() {
let data = {
users: ['Jeff', 'William', 'Alice']
}
- // dispatch received data action here
+ // Dispatch received data action here
}, 2500);
}
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/use-the-spread-operator-on-arrays.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/use-the-spread-operator-on-arrays.english.md
index 098f7887a6..30620cab91 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/use-the-spread-operator-on-arrays.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/use-the-spread-operator-on-arrays.english.md
@@ -45,7 +45,7 @@ tests:
const immutableReducer = (state = ['Do not mutate state!'], action) => {
switch(action.type) {
case 'ADD_TO_DO':
- // don't mutate state here or the tests will fail
+ // Don't mutate state here or the tests will fail
return
default:
return state;
diff --git a/curriculum/challenges/english/03-front-end-libraries/redux/write-a-counter-with-redux.english.md b/curriculum/challenges/english/03-front-end-libraries/redux/write-a-counter-with-redux.english.md
index 77825c413b..1c653c1a7a 100644
--- a/curriculum/challenges/english/03-front-end-libraries/redux/write-a-counter-with-redux.english.md
+++ b/curriculum/challenges/english/03-front-end-libraries/redux/write-a-counter-with-redux.english.md
@@ -44,16 +44,16 @@ tests:
```jsx
-const INCREMENT = null; // define a constant for increment action types
-const DECREMENT = null; // define a constant for decrement action types
+const INCREMENT = null; // Define a constant for increment action types
+const DECREMENT = null; // Define a constant for decrement action types
-const counterReducer = null; // define the counter reducer which will increment or decrement the state based on the action it receives
+const counterReducer = null; // Define the counter reducer which will increment or decrement the state based on the action it receives
-const incAction = null; // define an action creator for incrementing
+const incAction = null; // Define an action creator for incrementing
-const decAction = null; // define an action creator for decrementing
+const decAction = null; // Define an action creator for decrementing
-const store = null; // define the Redux store here, passing in your reducers
+const store = null; // Define the Redux store here, passing in your reducers
```