InAvision76

<h1>Instructions</h2>
<p>Below is a pared-down demonstration of React and Redux working together. It has the essential elements you need to connect/subscribe a React component to the Redux store for data, to dispatch actions, and to update the store's state using a reducer.</p>
<p><strong>Challenge 1: Fix the existing code</strong></p>
<p>When you enter a name and a course and hit the "Add Instructor" button, it should update the instructors list in the view. However, it isn't working right now, and lucky you, you get to debug it. Note: This is more of a React review challenge than a Redux one. </p>
<ol>
  <li>Why is the <strong>instructorsList</strong> component not rendering? Fix this first so that you can see the list. Hint: It's a small but important typographical error.</li>
  <li>In the AddInstructor component, the event handler has not been bound correctly. Can you fix it? There are two different and acceptable ways to do this. Refer to <a href="https://codepen.io/minae/pen/KJMYEO" target="_blank">this

InAvision76

Code Challenge: Convert HTML to React

A Pen by Sean Lawless on CodePen.

License.

InAvision76

Code Challenge: Toggling Modals

A Pen by Sean Lawless on CodePen.

License.

InAvision76

ES5 Challenge: Regular Expressions

A Pen by Sean Lawless on CodePen.

License.

InAvision76

Code Refactor Challenge: Ternary Operator

A Pen by Sean Lawless on CodePen.

License.

InAvision76

Code Challenge: Spread Syntax

A Pen by Sean Lawless on CodePen.

License.

InAvision76

Code Challenge: React Router Params

A Pen by Sean Lawless on CodePen.

License.

InAvision76

<div id="root"></div>

<hr />
<p>
  By now, you have learned about different component types, including function components and class components. In the JS section of this Codepen is an example of a class component named Welcome. 
</p>
<p>
  <strong>Challenge 1:</strong> Inside the JS section, create a class component named <strong>App</strong>. Inside its render() method, have it return the <strong>Welcome</strong> component. In the <strong>ReactDOM.render()</strong> method, change Welcome to App. 
</>
<p>

InAvision76

Code Challenge: React Components and Object Destructuring

A Pen by Sean Lawless on CodePen.

License.

InAvision76

<div id="root"></div>

<br />
<hr />

<p>In the JS section of this Codepen is a React class component called App that contains some information about an upcoming party in its state. For the following challenges, you will only need to edit code in the JS section, not the HTML or CSS.</p>

<ul>
  <li><strong>Challenge 1</strong>: Between the div tags at lines 18 and 20 of the JS section, render a component named <strong>&lt;Party&gt;</strong> and pass the partyType, entertainment, and venue properties from the state.</li>
  <li><strong>Challenge 2</strong>: Create/define a new React component named Party. In it, have it return a div that contains h3 tags surrounding the words Party Time!, followed by two paragraph elements that use the passed-in props. The first paragraph element will say: This _____ party will be held at ______ with a maximum capacity of ____. The second paragraph element will say: Featured entertainment: ______! The blanks will be filled in using props. See the screenshot in the learning port