Book Image

Vuex Quick Start Guide

By : Andrea Koutifaris
Book Image

Vuex Quick Start Guide

By: Andrea Koutifaris

Overview of this book

State management preserves the state of controls in a user interface. Vuex is a state management tool for Vue.js that makes the architecture easier to understand, maintain and evolve. This book is the easiest way to get started with Vuex to improve your Vue.js application architecture and overall user experience. Our book begins by explaining the problem that Vuex solves, and how it helps your applications. You will learn about the Vuex core concepts, including the Vuex store, changing application state, carrying out asynchronous operations and persisting state changes, all with an eye to scalability. You will learn how to test Vuex elements and Vue components with the Karma and Jasmine testing frameworks. You will see this in the context of a testing first approach, following the fundamentals of Test Driven Development. TDD will help you to identify which components need testing and how to test them. You will build a full Vuex application by creating the application components and services, and persist the state. Vuex comes with a plugin system that allows programmers to extend Vuex features. You will learn about some of the most powerful plugins, and make use of the built-in logger plugin. You write a custom Google Analytics plugin to send actions to its analytics API, and an Undo/Redo plugin.
Table of Contents (8 chapters)

What this book covers

Chapter 1, Rethinking User Interfaces with Flux, Vue, and Vuex, introduces the concepts of Flux architecture and the small differences in Vuex implementation.

Chapter 2, Implementing Flux Architecture with Vuex, teaches the core concepts of Vuex, and we learn how we can use them with small executable examples.

Chapter 3, Setting Up Development and Test Environment, shows how to use webpack and npm to prepare our environment for developing and testing a Vue/Vuex application.

Chapter 4, Coding the EveryNote App Using Vuex State Management, explains how to develop an application to take notes, using all the concepts from Vuex we've just learned. In addition, we use karma to test all the components of the application.

Chapter 5, Debugging Vuex Applications, says that even by testing every component, sometimes debugging is necessary. We will understand how to use Chrome Developer tools and vue-devtools to debug our applications.

Chapter 6, Using the Vuex Plugin System, enriches the EveryNote app with some useful Vuex plugins, including two custom plugins developed from scratch.