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.2k
1

Lightning Talk - Enhancing Vue and Vuex for Complex Application State

Avatar for Patrick Seda

Patrick Seda

March 28, 2018

More Decks by Patrick Seda

See All by Patrick Seda
The API of Your Company Culture
Avatar for Patrick Seda pxtrick
3
990
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.2k
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
710

Other Decks in Technology

See All in Technology
Kaggle未経験社員をメダリストに育てる「AIドラゴン桜」
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
660
Claude code Orchestra
Avatar for Taisei Ozaki ozakiomumkj
2
650
AIが変えた"品質の守り方"
Avatar for kkakizaki kkakizaki
13
5.4k
Anthropic AIネイティブ・スタートアップ構築のプレイブック を理解する
Avatar for 長津孝輔 nagatsu
0
220
地元にいないローカルオーガナイザーの立ち回り
Avatar for uvb_76 uvb_76
1
350
電子辞書Brainをネットに繋げてみた(自力編)
Avatar for らすぴー raspython3
0
320
AIガバナンス実践 - 生成AIコネクタのデータ漏洩リスクと実務対策
Avatar for 西岡 賢一郎 (Kenichiro Nishioka) knishioka
0
140
Javaコミュニティをもっと楽しむための9箇条
Avatar for Sugiyama Takaaki takasyou
0
570
Fabric-cicd によるAzure DevOps デプロイ
Avatar for Ryoma Nagata ryomaru0825
0
140
イベントストーミングとKiroの仕様駆動開発で実現する要件の認識合わせプロセス
Avatar for syobochim syobochim
7
960
AI-DLCを活用した高品質・安全なAI駆動開発実践 / AI Driven Development
Avatar for 吉田真吾 yoshidashingo
1
250
組織の中で自分を経営する技術
Avatar for shoota shoota
0
220

Featured

See All Featured
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
21k
The Mindset for Success: Future Career Progression
Avatar for Greg Gifford greggifford
PRO
0
340
Technical Leadership for Architectural Decision Making
Avatar for Kenny Baas-Schwegler baasie
3
380
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
Avatar for Helen Beal helenjbeal
1
210
Designing Powerful Visuals for Engaging Learning
Avatar for Mike Taylor tmiket
1
380
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3.4k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
13
1.2k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
57
6.9k
Writing Fast Ruby
Avatar for Erik Berlin sferik
630
63k
What’s in a name? Adding method to the madness
Avatar for The Alliance productmarketing
PRO
24
4.1k
Reality Check: Gamification 10 Years Later
Avatar for Sebastian Deterding codingconduct
0
2.2k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
Avatar for Tech SEO Connect techseoconnect
PRO
0
170

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