함께 자라기

참고 Vuex Tutorial - The Net Ninja를 보고 정리한 글입니다. Vuex 란? 한마디로 Vue.js에서 모든 상태를 한 곳에서 관리해 주는 친구입니다. 중앙에 Store라는 상태 저장소가 있고, 이 Store는 모든 애플리케이션의 컴포넌트에서 접근이 가능합니다. Vuex를 사용한다면 Vue.js만 사용한다면, 보통 여러 컴포넌트 간의 관계는 위와 같은 트리 구조일 것입니다. 만약 4번 컴포넌트에서 이벤트가 발생해서 다른 컴포넌트들의 상태에 변화를 주어야 한다면, 이벤트는 부모를 타고 올라가 Root 컴포넌트까지 전달된 다음, 다시 props를 통해 다른 하위 컴포넌트들로 전달되어야 하겠죠. 하지만 Vuex를 사용한다면 중앙 저장소인 Store가 있고, 특정 컴포넌트에서 상태를 변경한다..