Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Lightning Talk - Enhancing Vue and Vuex for Com...

Avatar for Patrick Seda Patrick Seda
March 28, 2018
Technology
1
1.2k

Lightning Talk - Enhancing Vue and Vuex for Complex Application State

Avatar for Patrick Seda

Patrick Seda

March 28, 2018
Tweet

More Decks by Patrick Seda

See All by Patrick Seda
The API of Your Company Culture
Avatar for Patrick Seda pxtrick
3
970
Swift - Beyond Beginner
Avatar for Patrick Seda pxtrick
0
1.3k
Crossing the Chasm of Swift
Avatar for Patrick Seda pxtrick
0
1.4k
Architecting Your Project with a Finite-State Machine
Avatar for Patrick Seda pxtrick
1
2.1k
Your Code is Terrible (I Love It!)
Avatar for Patrick Seda pxtrick
0
1.2k
An Introduction to Location-Based Technologies (for Business & Marketing)
Avatar for Patrick Seda pxtrick
0
600
The Passion of Lazy - Enterprise Mobile App Design Patterns
Avatar for Patrick Seda pxtrick
0
2.2k
10 Tips for Kickass Enterprise Mobile Apps
Avatar for Patrick Seda pxtrick
0
1k
Making Mobile Games (A presentation for the Girl Scouts)
Avatar for Patrick Seda pxtrick
1
700

Other Decks in Technology

See All in Technology
菸酒生在 LINE Taiwan 的後端雙刀流
Avatar for LINE Developers Taiwan line_developers_tw
PRO
0
140
堅牢な認証基盤の実現 TypeScriptで代数的データ型を活用する
Avatar for KAKEHASHI kakehashi
PRO
2
220
Model Mondays S2E01: Advanced Reasoning
Avatar for Nitya Narasimhan, PhD nitya
0
340
DB 醬，嗨！哪泥嘎斯基？
Avatar for LINE Developers Taiwan line_developers_tw
PRO
0
150
“プロダクトを好きになれるか“も QAエンジニア転職の大事な判断基準だと思ったの
Avatar for yuden tomodakengo
0
130
新規プロダクト開発、AIでどう変わった？ #デザインエンジニアMeetup
Avatar for 弁護士ドットコム bengo4com
0
450
Bill One 開発エンジニア 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
4
12k
比起獨自升級 我更喜歡 DevOps 文化 <3
Avatar for LINE Developers Taiwan line_developers_tw
PRO
0
160
New Cache Hierarchy for Container Images and OCI Artifacts in Kubernetes Clusters using Containerd / KubeCon + CloudNativeCon Japan
Avatar for Preferred Networks pfn
PRO
0
150
AI技術トレンド勉強会 #1 MCPの基礎と実務での応用
Avatar for Nisei Kimura nisei_k
1
190
Contract One Engineering Unit 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
6.4k
doda開発 生成AI元年宣言！自家製AIエージェントから始める生産性改革 / doda Development Declaration of the First Year of Generated AI! Productivity Reforms Starting with Home-grown AI Agents
Avatar for techtekt techtekt
0
140

Featured

See All Featured
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
299
51k
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
47
2.8k
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
63
7.8k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
52
7.6k
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
337
57k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
4
130
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
8
780
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
139
7k
Faster Mobile Websites
Avatar for Dean Hume deanohume
307
31k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
411
22k
Dealing with People You Can't Stand - Big Design 2015
Avatar for Cassini Nazir cassininazir
367
26k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
329
21k

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