Check out a free preview of the full Vuex for Intermediate Vue 2 Developers course

The "Move into a Vuex Store Exercise" Lesson is part of the full, Vuex for Intermediate Vue 2 Developers course featured in this preview video. Here's what you'd learn in this lesson:

Students are instructed to move a Vuex store into a separate single file store component and link it to the main.js file.

Preview
Close

Transcript from the "Move into a Vuex Store Exercise" Lesson

[00:00:00]
>> So for the first exercise in which we're moving to a single file components, we're gonna essentially take our vuex store and move it into a separate, single file component. One thing to know as we move through this exercise is that the GitHub repo for frontend masters has various folders within it with with the exercises.

[00:00:22]
So you may notice that vuex-sfc is a subfolder within that, it's actually a submodule. So I have a separate repo in which that lives which is this link, but it is submoduled and I'll show you what I mean by that. So here I am actually checked into my frontend masters vuex repo and you can see that there are various folders within it.

[00:00:46]
From your perspective, you don't really have to think about submodules but you can see that the vuex-sfc is there so I can easily just cd into that directory and I'm automatically checked into step-0. And so what you're trying to do is that the store has nothing in it and if you go here there is store specific code in the component.

[00:01:12]
So you'll see cons.store in vending machine admin.view, we're moving that code into the store and then linking the Store App in main.js.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now