[Vue.js] Vuex 시작하기

Vuex란?
다양하고 복잡한 컴포넌트들을 효율적으로 관리하는 라이브러리
Vuex는 어플리케이션에서 컴포넌트의 개수가 많아지면 컴포넌트 간에 데이터 전달이 어려워지기 때문에 필요하다.

Flux?
MVC패턴의 복잡한 데이터 흐름을 해결 할 수 있는 새로 나온 패턴으로 데이터의 흐름이 여러개로 갈리지 않고, 단방향으로만 처리된다.

 

Vuex 설치 및 등록하기

npm i vuex@3.6.2

npm 방식으로 설치를 해준다. 

 

https://vuex.vuejs.org/installation.html

Installation | Vuex

공식문서이다. CDN방식도 있다!

 

나는 npm 방식으로 설치했고 성공적으로 설치가 되었다면,

 

package.json파일에 dependencies에 vuex가 입력이 되어 있을 것이다.

 

다음으로는 src 폴더 밑에 파일.js파일을 생성해준다.

import Vue from "vue";
import Vuex from 'vuex'

Vue.use(Vuex);

export const store = new Vuex.Store({
    
})

그 다음 main.js에 가서 위의 파일을 임포트 해주고, vue 생성자에 컴포넌트를 추가해준다.

 

시작 준비는 끝