Vuex Plugin 101 (Full Ver.)

Transcript

1. VUEX PLUGIN 101
   CHO
   

   View Slide

2. VUE PLUGIN
   USERS
   

   View Slide

3. VUEX PLUGIN
   USERS
   .. , . .
   

   View Slide

4. VUEX
   PLUGIN
   DEVELOPER
   

   View Slide

5. EASY TO
   MAKE
   

   View Slide

6. Logger
   https://codesandbox.io/s/887m806p5l
   

   View Slide

7. subscribe
   

   View Slide

8. https://3kqr0kjm95.codesandbox.io/
   

   View Slide

9. State
   Snapshot
   1
   State
   Snapshot
   2
   State
   Snapshot
   3
   State
   Snapshot
   4
   State
   Snapshot
   5
   Versions
   
   Current
   Version Redo
   replaceState(state: Object)
   Undo
   

   View Slide

10. Other Implementations
    

    View Slide

11. subscribe
    After
    State
    Changed
    

    View Slide

12. subscribeAction
    subscribe
    Ver. 2.5.0+
    

    View Slide

13. Avoid Duplicate API Requests
    
    

    View Slide

14. http://reactivex.io/documentation/operators/debounce.html
    

    View Slide

15. View Slide

16. View Slide

17. https://p4yvo81lq.codesandbox.io/
    

    View Slide

18. VUEX PLUGIN ≠ ASPECT
    

    View Slide

19. subscribeAction
    subscribe
    Nonstop
    

    View Slide

20. Vuex Plugin
    Subscriber
    Set
    Changes
    Window
    Listener
    Listening to
    Changes
    vuex-shared-mutations
    Vuex State
    
    Vuex State
    
    Subscribing To
    Changes
    Set
    Changes
    Tab 1 Tab 2
    Local
    Storage
    

    View Slide

21. https://davestewart.github.io/vuex-pathify/
    

    View Slide

22. https://github.com/vuex-orm/vuex-orm
    

    View Slide

23. Check
    More
    

    View Slide

24. View Slide