In Vue.js, it is quite simple to work with components, and share data among them using events and props - especially in small to medium projects. When an application starts growing, managing components state might become tedious and overwhelming. This is where Vuex comes to our rescue.

Vuex is a state management pattern and official library for Vue.js applications. It serves as a centralized store for all the components in an application, with rules ensuring that the state can only be mutated in a predictable fashion.

By the end of the workshop, attendees will be able to develop elegant, debuggable, maintainable, and organized applications using a centralized store. No prior experience with Vuex is needed.

We will answer the common question, “When should I use Vuex?” and work on real-world features.

The workshop is divided into eight modules. Each module consists of one part theory and one part of exercises where we get our hands on Vuex and practice what we learn.

Topics

• Understanding State Management Patterns
• What is Vuex and what problems does it solve
• Core concepts including Mutations, Actions, and Getters
• Modularising the store
• Composing Vuex assets using Higher-Order Functions
• Implementing Vuex pseudo-cache
• Best practices, common gotchas, and application architecture

Who is this for

This workshop is ideal for web developers who know the basics of Vue.js and are looking to manage application data without the headache of prop drilling.

Pre-requisites

• Experience with the basics of Vue.js
• Experience building full scale apps that could benefit from a central store