diff --git a/part1/src/App.js b/part1/src/App.js index 29e1e36..edc4436 100644 --- a/part1/src/App.js +++ b/part1/src/App.js @@ -1,70 +1,46 @@ -const Header = (props) => { +import { useState } from 'react' + +const Display = ({ counter }) => { return ( -
- {props.part.name} {props.part.exercises} -
- > - ) -} - -const Content = (props) => { - return ( - <> -- Number of exercises {total} -
- > + ) } const App = () => { - const title = 'Half Stack application development' - const part1 = { - name: 'Fundamentals of React', - exercises: 10 + const [counter, setCounter] = useState(0) + console.log('rendering with counter value', counter) + const increaseByOne = () => { + console.log('increasing, value before', counter) + setCounter(counter + 1) } - const part2 = { - name: 'Using props to pass data', - exercises: 7 + + const decreaseByOne = () => { + console.log('decreasing, value before', counter) + setCounter(counter - 1) } - const part3 = { - name: 'State of a component', - exercises: 14 - } - const parts = [part1, part2, part3] - const course = { - course: title, - parts: parts + + const setToZero = () => { + console.log('resetting to zero, value before', counter) + setCounter(0) } return (