정리가 다 되었다면 다음과 같이 폴더를 만들어 줍니다. src ├── modules └── counter ├── action ├── types.js └── index.js └── index.js └── index.js ├── App.js └── index.js 그리고 action/types.js에 reducer에서 사용할 type을 정해줍니다. // modules/counter/action/types.js export const INCREMENTED = "counter/incremented" export const DECREMENTED = "counter/decremented" action/index.js에는 action 함수와 action의 타입을 만듭니다. // modules/counter/actio..
LifeCycle과 Hook이란 LifeCycle이란 컴포넌트의 생명주기를 뜻하고, 이 메서드를 오버라이딩해서 특정 시점에 코드가 실행되도록 설정할 수 있습니다. Hook은 React 버전 16.8에서 추가되었고 class를 사용하지 않고 생명주기를 사용할 수 있게 해줍니다. 이 생명주기를 잘 사용한다면 빠르고 최적화된 웹 페이지를 경험할 수 있습니다. LifeCycle constructor() constructor(props) { super(props) this.state = { count: 0 } } React 컴포넌트의 생성자는 해당 컴포넌트가 생성되기 전에 실행됩니다. 이 메서드를 구현할 때 super(props)를 해주어야 합니다. 그렇지 않으면 this.props가 생성자 내에서 정의되지 않아..