state를 바꾼다는 것은 화면에 출력할 것 중 변경되는 것이 있다는 것을 의미한다. 그래서 state를 바꾸게되면, render() 함수가 자동으로 호출되어 바뀐 부분만 재빠르게 변경된다. 하지만, 첫번째와 같이 쓰면 state가 변경되지 않고 rerender하지 않는다. 두번째 방법으로 써야 state를 변경하고, render()함수를 호출 하여 원하는 글자를 바꿀 수 있다. this.state.value = 1 // X this.setState({value:1}); // O 가끔 this.state에 있는 값을 참조하여 값을 바꾸는 경우가 있는데, 보통의 경우라면 아래와 같이 쓸 수 있다. plus = () => { this.setState({value: this.state.value + 1}); ..

어떤 프로그래밍 언어든 직접 해보지 않으면, 내가 배운것이 다가 아니라는 것을 계속 깨닫게 된다. React 공홈을 통해 배운 것을 하나로 뭉쳐서 뭘 만들 수 있을까 고민해보다가 state, component 등을 한눈에 볼 수 있는 stop watch로 정했다. 무엇을 구현할지는 아래와 같이 정했다. 1. Start, Stop 버튼 클릭시 stopwatch 실행, 중단 2. Records 버튼 클릭시 현재 시간 기록 3. Reset 버튼 클릭시 전체 초기화 (시간, records 기록 모두 초기화) 1. html 에 넣을 component를 먼저 구현 2. render 부분에 어떤 것을 넣을지 고민해서 시간을 표시하는 Indicator 부분과 버튼부분, records 부분으로 나누었다. (그리고, 상태..