Lightning Talk - Enhancing Vue and Vuex for Complex Application State

Transcript

1. VueConf US - 2018 New Orleans VueConf US - 2018 New Orleans – Lightning Talks Enhancing f o r Complex Application State PATRICK SEDA - @pxtrick VUE VUE AND VUEX VUEX
2. WHO? @pxtrick PATRICK SEDA MOBILE & WEB ARCHITECT
3. APPLICATION ARCHITECTURE
4. @pxtrick Actions Mutations Getters Component Component Component APP ARCHITECTURE UI State VUEX Backend API SERVICES
5. @pxtrick Actions Mutations Getters Component Component APP ARCHITECTURE UI State VUEX Component Component SERVICES Backend API
6. @pxtrick Actions Mutations Getters Component Component Component APP ARCHITECTURE UI State VUEX SERVICES Backend API
7. @pxtrick Actions Mutations Getters Component APP ARCHITECTURE UI State VUEX Component Component Component Component SERVICES Backend API
8. FINITE STATE MACHINE
9. @pxtrick FINITE STATE MACHINE WHAT DOES This Little Thingy DO?
10. @pxtrick FINITE STATE MACHINE OFF FAST MEDIUM SLOW
11. @pxtrick FINITE STATE MACHINE OFF FAST MEDIUM SLOW Pull Chain Pull Chain Pull Chain Pull Chain
12. @pxtrick FINITE STATE MACHINE FSM - States - Events / Transitions - Start State APP 1. APP EVENT ‘X’ HAPPENS 2. HEY FSM, GIVE ME THE STATE TO WHICH ‘X’ TRANSITIONS! 3. APPLY THE NEW STATE Static View: Dynamic View:
13. @pxtrick Actions Mutations Getters / Triggers Component Component Component UI states Event Router FSM FINITE STATE MACHINE VUEX Store FSM
14. @pxtrick PATRICK SEDA Cheers! speakerdeck.com/pxtrick