Vuex patterns
why actions matter
FILIPA LACERDA
Senior Frontend Engineer, Release and Verify,
GitLab
@filipalacerda
gitlab.com/filipa
Vuex patterns
why actions matter
ALL THINGS DATA
@filipalacerda
Vuejs Amsterdam 2019
MULTIPLE SOURCES OF DATA
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
- Vuex won't magically save you
- Flux
- Vuex pattern
@filipalacerda
Vuejs Amsterdam 2019
Although Vuex helps us deal with shared state management, it also comes with the cost of more concepts and boilerplate. It's a trade-off between short term and long term productivity.
@filipalacerda
Vuejs Amsterdam 2019
It's a trade-off between short term and long term productivity
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
The Merge request widget
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
API
Title Text
@filipalacerda
Vuejs Amsterdam 2019
FLUX LIKE
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
State management
@filipalacerda
Vuejs Amsterdam 2019
your entire team will write code the same way
@filipalacerda
Vuejs Amsterdam 2019
WHY FLUX?
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
BOILERPLATE
@filipalacerda
Vuejs Amsterdam 2019
WHAT is happening
WHEN is happening
WHY is happening
@filipalacerda
Vuejs Amsterdam 2019
what is flux?
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
unidirectional dataflow
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
none
@filipalacerda
Vuejs Amsterdam 2019
Dispatcher
Store
@filipalacerda
Vuejs Amsterdam 2019
"action creators"
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
@filipalacerda
Vuejs Amsterdam 2019
one pattern, making it easier for anyone to maintain the code
@filipalacerda
Vuejs Amsterdam 2019
All data in the application follows the same lifecycle pattern
@filipalacerda
Vuejs Amsterdam 2019
Actions are contained and human-friendly
@filipalacerda
Vuejs Amsterdam 2019
Unit tests are easier
@filipalacerda
Vuejs Amsterdam 2019
Thank you!
@filipalacerda
gitlab.com/filipa
@filipalacerda
Vuejs Amsterdam 2019
vuejs-amsterdam
By Filipa Lacerda
