This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from "react"; | |
import "./TodoApp.css"; | |
export default function TodoApp() { | |
const [todo, setTodo] = React.useState(""); | |
const [todos, setTodos] = React.useState([]); | |
const handleChange = e => { | |
setTodo(e.target.value); | |
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useState } from "react"; | |
function useInput(initialValue) { | |
const [state, setState] = useState(initialValue); | |
const handleChange = e => { | |
setState(e.target.value); | |
}; | |
const reset = () => { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from "react"; | |
import useInput from "./hooks/useInput"; | |
import "./TodoApp.css"; | |
export default function TodoApp() { | |
const [todo, setTodo, resetTodo] = useInput(""); | |
const [todos, setTodos] = React.useState([]); | |
const addTodo = () => { | |
setTodos([ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React, { useState } from "react"; | |
function useArray(initialList) { | |
const [list, setList] = useState(initialList); | |
return { | |
list, | |
addItem: newItemText => { | |
setList([ | |
...list, |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from "react"; | |
import useInput from "./hooks/useInput"; | |
import "./TodoApp.css"; | |
import useArray from "./hooks/useArray"; | |
export default function TodoApp() { | |
const [todo, setTodo, resetTodo] = useInput(""); | |
const todos = useArray([]); | |
const onSubmit = e => { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Hello World</title> | |
<meta charset="UTF-8" /> | |
</head> | |
<body> | |
<div id="root"></div> | |
<script type="text/javascript"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Hello World</title> | |
<meta charset="UTF-8" /> | |
</head> | |
<body> | |
<div id="root"></div> | |
<script src="https://unpkg.com/react@16.12.0/umd/react.development.js"></script> |