Prollock

<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

Prollock

ES5 Challenge: Regular Expressions

A Pen by Pia Rollock on CodePen.

License.

Prollock

Code Refactor Challenge: Ternary Operator

A Pen by Pia Rollock on CodePen.

License.

Prollock

Code Challenge: React Components and Object Destructuring

A Pen by Pia Rollock on CodePen.

License.

Prollock

<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

Prollock

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

<br />
<hr />

<p>In the JS section of this Codepen is a React class component called App that is rendered to the view. 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> Add a fourth country to the list stored in App's state. </li>
  <li><strong>Challenge 2:</strong> Cause the continent to show up next to each country name in the view, as in: "Laos - Asia"</li>

Prollock

Code Challenge: JSX and State

A Pen by Pia Rollock on CodePen.

License.

Prollock

Code Challenge: Reduce

A Pen by Pia Rollock on CodePen.

License.

Prollock

<input type="text" onkeyup="fixLength()" />

<hr />

<p>This Code Challenge is intended to give you more practice with event listeners, as well as introduce you to the concept of string methods and give you practice with researching and using built-in JavaScript methods.</p>
<p>You will only need to update the code in the JS section of this Codepen to complete this challenge.</p>

<h3>Code Challenge</h3>
<ul>
  <li>

Prollock

Code Challenge: CSS Selectors & Specificity

A Pen by Pia Rollock on CodePen.

License.