Creating a simple Vuex application

We will start a fresh new application to learn the basics of Vuex. Let's get started.

Let's first create a new application:

$ vue init webpack vuex-tutorial

The preceding code snippet will ask you few questions about the application setup. You can choose what you want to keep. I will go with the following configuration:

After the installation, navigate to the project directory:

$ cd vuex-tutorial

The next thing to do is to run the following command:

$ npm install

After that, run the following command:

$ npm run dev

The preceding command will spin up your server and open a port in localhost:8080.

Installing Vuex

The next step is to install vuex. To do that, run the following command:

$ npm install --save vuex

Setting up Vuex

Now, let's create a store folder to manage the vuex in our application. 

Creating a store file

In the src directory, create a store folder and store.js file. Then, add the following to the store.js file:

import Vue from 'vue'
import Vuex from 'vuex'
...