[vuex] State
1. 단일 상태 트리 (Single State Tree) Vuex는 단일 상태 트리(single state tree)를 사용합니다. 즉 이말은, 하나의 객체가 모든 어플리케이션의 state를 포함하고 이 객체가 하나의 원본 소스(single source of truth)입니다. 하나의 어플리케이션은 하나의 store만 가진다는 것을 의미합니다. 단일 상태 트리는 특정 state를 바로 찾을 수 있게 만들고, 현재 앱의 state의 스냅샷을 가져올 수 있어 디버깅을 간편하게 만듭니다. 2. Vuex의 state를 Vue 컴포넌트에 가져오기 Vuex의 store를 Vue 컴포넌트에서 사용할 수 있는 가장 간단한 방법은 computed 속성을 사용하는 것입니다. // Counter 컴포넌트를 만듭니다 cons..
[React.JS] State와 Lifecycle
State와 Liftcycle State의 필요성시계 컴포넌트를 만들어 봅시다. 시계 컴포넌트를 만들려면, 매초마다 화면을 갱신해야 시간이 흐르는 것처럼 보이겠죠? function Clock(props) { return ( {props.date.toLocaleTimeString()} ); } function tick() { ReactDOM.render( , document.getElementById('root') ); } setInterval(tick, 1000); CodePen으로 예제 확인하기 화면을 다시 그려주는 방법으로, setInterval()를 사용하여 ReactDOM.render()을 매초 호출하여 화면을 갱신하였습니다. 매초 화면을 갱신하는 기능은 Clock 컴포넌트 안에서 구현하는 것이 ..