Installing and using the Vuex store in our applications

Now that we know what Vuex is, how to create a store, dispatch mutations, and how to use getters and actions, we can install the store in our applications and use it to finalize their data flow and communication chain.

You can find the applications to work on in the following folders:

• Pomodoro: chapter5/pomodoro
• Shopping list: chapter5/shopping-list2

Do not forget to run npm install on both applications.

Start by installing vuex and define the necessary directory and file structure in both applications.

To install vuex, just run the following:

npm install vuex --save 

After installing vuex, create a subfolder vuex in each of the application's src folders. In this folder, create four files: store.js, mutation_types.js, actions.js, and getters.js.

Prepare the store.js structure:

//store.js 
import Vue from 'vue' 
import Vuex from 'vuex' 
import getters from './getters' 
import actions from './actions' 
import mutations...