React
HTML
<div id="app"></div>
CSS
body {
background: #20262E;
padding: 20px;
font-family: Helvetica;
}
#app {
background: #fff;
border-radius: 4px;
padding: 20px;
transition: all 0.2s;
}
li {
margin: 8px 0;
}
h2 {
font-weight: bold;
margin-bottom: 15px;
}
.done {
color: rgba(0, 0, 0, 0.3);
text-decoration: line-through;
}
input {
margin-right: 5px;
}
React
function Hello() {
const [value, setValue] = React.useState("");
function handleChange(event) {
let value = event.target.value;
setTimeout(() => setValue(value), 100);
}
return (
<div>
Type here:
<input value={value} onChange={handleChange}/>
</div>
);
}
ReactDOM.render(
<Hello/>,
document.getElementById('app')
);