Use the demo app built in the class and create a new component ExampleComponent
.
Use the following code as the starter code in the ExampleComponent
:
import React from 'react';
class ExampleToggle extends React.Component {
state = {
// ************************************************************************************ | |
// https://www.codewars.com/kata/the-hashtag-generator | |
// The marketing team is spending way too much time typing in hashtags. | |
// Let's help them with our own Hashtag Generator! | |
// Here's the deal: | |
// It must start with a hashtag (#). | |
// All words must have their first letter capitalized. | |
// If the final result is longer than 140 chars it must return false. |
// ************************************************************************************ | |
// https://www.codewars.com/kata/camelcase-to-underscore/train/javascript | |
// You wrote all your unit test names in camelCase. But some of your colleagues have | |
// troubles reading these long test names. So you make a compromise to switch to | |
// underscore separation. To make these changes fast you wrote a class to translate | |
// a camelCase name into an underscore separated name. | |
// Implement the ToUnderscore() method. | |
// Example: |
// we can declare multiple objects and give them different values for the same properties, | |
// which means we have to repeat the same process for every next person | |
// Class - template for creating objects of new custom type | |
// In simple English, create just one object and be able to reuse it as a blueprint for all the others | |
// -------------------------------------------------------- | |
// To create a class all we need is a class keyword followed by an identifier (a name we gave to the class) | |
// and a block of code in between the curly {} braces. |
// declaring objects: | |
// as objects literals: | |
const product = {name:'iphone', price: 799.99} | |
// console.log(product); | |
// using the keyword new: | |
const book = new Object(); | |
book.title = 'ana karenina'; | |
book.author = 'leo tolstoy'; | |
// console.log(book); |
// ************************************************************************************ | |
// https://www.codewars.com/kata/good-vs-evil | |
// Description | |
// Middle Earth is about to go to war. The forces of good will have many battles with | |
// the forces of evil. Different races will certainly be involved. Each race has a | |
// certain worth when battling against others. On the side of good we have the following | |
// races, with their associated worth: | |
// Hobbits: 1 | |
// Men: 2 |
const unsorted = [1, 4, 2, 11, 42]; | |
console.log(unsorted); | |
const sorted = unsorted.slice() | |
console.log(sorted.sort()); | |
const sorted1 = unsorted.slice().sort((a, b) => a - b); | |
console.log(sorted1); | |
const sorted2 = unsorted.slice().sort((a, b) => b - a); | |
console.log(sorted2); |
import React from 'react'; | |
class ExampleComponent extends React.Component { | |
state = { | |
didClick: true | |
}; | |
handleClick = () => { | |
if (this.state.didClick) { | |
this.setState({ didClick: false }); |