중앙 집중화 된 상태관리패턴 라이브러리.
특정한 관계가 정의되기 어려운 컴포넌트들 끼리 데이터를 주고받을 때 한곳에서 처리 하도록 도와준다.

중앙 집중화 되서 데이터를 관리 하는곳을 **Store** 라고 한다. Store 를 통해서 어떤 곳의 컴포넌트에도
데이터를 전달 할 수 있다.

Apply 를 통해서 영화의 정보를 받아 오는데 Search 와 영화 리스트들은 **형제 관계**다.
형제 요소들은 데이터 교환이 아주 **제한적**이다. 따라서 이를 **Vuex** 로 해결 해 볼 것이다.

특정한 폴더에 들어있는 index.js 파일을 가지고 올때는 경로상 index.js 를 생략 해 줄수 있다.
따라서 폴더에서 가장 기본적으로 사용하는 파일의 이름 index.js 로 하는것을 권장한다.

$ npm i vuex@next

store 폴더를 만들어주고 index.js 파일 생성.
//**store/index.js**
import { createStore } from 'vuex'
import movie from './movie'
import about from './about'

export default createStore ({
  modules: {
// 이후에 movie 와 제작자에 관한 about 모듈을 만들어 줄 것이다.
    movie,
    about
  }
})

//**main.js** 에서 index.js 를 생략 해 준다.
import { createApp } from 'vue'
import App from './App.vue'
//특정한 폴더에 들어있는 index.js 파일을 가지고 올때는 경로상 index.js 를 생략 해 줄수 있다.
// import router from './routes/index.js'
// import store from './store/index.js'
import router from './routes'
import store from './store'

// use 는 현재 프로젝트에 특정한 plugin을 연결할 때 사용한다.
createApp(App)
  .use(router)
  .use(store)
  .mount('#app')

store/movie.js