{
"name": "React",
"isUpcomingChange": false,
"dashedName": "react",
"helpCategory": "JavaScript",
"template": "${ source || '' }",
"required": [
{
"src": "https://cdnjs.cloudflare.com/ajax/libs/react/16.4.0/umd/react.production.min.js"
},
{
"src": "https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.4.0/umd/react-dom.production.min.js"
},
{
"src": "https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.4.0/umd/react-dom-test-utils.production.min.js"
},
{
"src": "https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.4.0/umd/react-dom-server.browser.production.min.js"
}
],
"challengeOrder": [
{
"id": "587d7dbc367417b2b2512bb1",
"title": "Create a Simple JSX Element"
},
{
"id": "5a24bbe0dba28a8d3cbd4c5d",
"title": "Create a Complex JSX Element"
},
{
"id": "5a24bbe0dba28a8d3cbd4c5e",
"title": "Add Comments in JSX"
},
{
"id": "5a24bbe0dba28a8d3cbd4c5f",
"title": "Render HTML Elements to the DOM"
},
{
"id": "5a24c314108439a4d4036160",
"title": "Define an HTML Class in JSX"
},
{
"id": "5a24c314108439a4d4036161",
"title": "Learn About Self-Closing JSX Tags"
},
{
"id": "5a24c314108439a4d4036162",
"title": "Create a Stateless Functional Component"
},
{
"id": "5a24c314108439a4d4036163",
"title": "Create a React Component"
},
{
"id": "5a24c314108439a4d4036164",
"title": "Create a Component with Composition"
},
{
"id": "5a24c314108439a4d4036165",
"title": "Use React to Render Nested Components"
},
{
"id": "5a24c314108439a4d4036166",
"title": "Compose React Components"
},
{
"id": "5a24c314108439a4d4036167",
"title": "Render a Class Component to the DOM"
},
{
"id": "5a24c314108439a4d4036168",
"title": "Write a React Component from Scratch"
},
{
"id": "5a24c314108439a4d4036169",
"title": "Pass Props to a Stateless Functional Component"
},
{
"id": "5a24c314108439a4d403616a",
"title": "Pass an Array as Props"
},
{
"id": "5a24c314108439a4d403616b",
"title": "Use Default Props"
},
{
"id": "5a24c314108439a4d403616c",
"title": "Override Default Props"
},
{
"id": "5a24c314108439a4d403616d",
"title": "Use PropTypes to Define the Props You Expect"
},
{
"id": "5a24c314108439a4d403616e",
"title": "Access Props Using this.props"
},
{
"id": "5a24c314108439a4d403616f",
"title": "Review Using Props with Stateless Functional Components"
},
{
"id": "5a24c314108439a4d4036170",
"title": "Create a Stateful Component"
},
{
"id": "5a24c314108439a4d4036171",
"title": "Render State in the User Interface"
},
{
"id": "5a24c314108439a4d4036172",
"title": "Render State in the User Interface Another Way"
},
{
"id": "5a24c314108439a4d4036173",
"title": "Set State with this.setState"
},
{
"id": "5a24c314108439a4d4036174",
"title": "Bind 'this' to a Class Method"
},
{
"id": "5a24c314108439a4d4036176",
"title": "Use State to Toggle an Element"
},
{
"id": "5a24c314108439a4d4036177",
"title": "Write a Simple Counter"
},
{
"id": "5a24c314108439a4d4036178",
"title": "Create a Controlled Input"
},
{
"id": "5a24c314108439a4d4036179",
"title": "Create a Controlled Form"
},
{
"id": "5a24c314108439a4d403617a",
"title": "Pass State as Props to Child Components"
},
{
"id": "5a24c314108439a4d403617b",
"title": "Pass a Callback as Props"
},
{
"id": "5a24c314108439a4d403617c",
"title": "Use the Lifecycle Method componentWillMount"
},
{
"id": "5a24c314108439a4d403617d",
"title": "Use the Lifecycle Method componentDidMount"
},
{
"id": "5a24c314108439a4d403617e",
"title": "Add Event Listeners"
},
{
"id": "5a24c314108439a4d4036180",
"title": "Optimize Re-Renders with shouldComponentUpdate"
},
{
"id": "5a24c314108439a4d4036181",
"title": "Introducing Inline Styles"
},
{
"id": "5a24c314108439a4d4036182",
"title": "Add Inline Styles in React"
},
{
"id": "5a24c314108439a4d4036183",
"title": "Use Advanced JavaScript in React Render Method"
},
{
"id": "5a24c314108439a4d4036184",
"title": "Render with an If-Else Condition"
},
{
"id": "5a24c314108439a4d4036185",
"title": "Use && for a More Concise Conditional"
},
{
"id": "5a24c314108439a4d4036187",
"title": "Use a Ternary Expression for Conditional Rendering"
},
{
"id": "5a24c314108439a4d4036188",
"title": "Render Conditionally from Props"
},
{
"id": "5a24c314108439a4d4036189",
"title": "Change Inline CSS Conditionally Based on Component State"
},
{
"id": "5a24c314108439a4d403618a",
"title": "Use Array.map() to Dynamically Render Elements"
},
{
"id": "5a24c314108439a4d403618b",
"title": "Give Sibling Elements a Unique Key Attribute"
},
{
"id": "5a24c314108439a4d403618c",
"title": "Use Array.filter() to Dynamically Filter an Array"
},
{
"id": "5a24c314108439a4d403618d",
"title": "Render React on the Server with renderToString"
}
],
"blockLayout": "legacy-challenge-list"
}