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

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

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
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
980
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
700

Other Decks in Technology

See All in Technology
技術的負債の泥沼から組織を救う3つの転換点
Avatar for nwiizo nwiizo
8
2.5k
【SLO】"多様な期待値" と向き合ってみた
Avatar for kaita z63d
2
310
vLLM Community Meetup Tokyo #3 オープニングトーク
Avatar for jpishikawa jpishikawa
0
150
Claude Codeが爆速進化してプラグイン追従がつらいので半自動化した話 ver.2
Avatar for ryu rfdnxbro
0
210
「ストレッチゾーンに挑戦し続ける」ことって難しくないですか？ メンバーの持続的成長を支えるEMの環境設計
Avatar for SansanTech sansantech
PRO
3
330
Exadata Database Service on Dedicated Infrastructure(ExaDB-D) UI スクリーン・キャプチャ集
Avatar for oracle4engineer oracle4engineer
PRO
7
7.1k
AI時代にエンジニアはどう成長すれば良いのか？
Avatar for Recruit recruitengineers
PRO
1
140
マルチロールEMが実践する「組織のレジリエンス」を高めるための組織構造と人材配置戦略
Avatar for coconala_engineer coconala_engineer
3
440
オンプレとGoogle Cloudを安全に繋ぐための、セキュア通信の勘所
Avatar for Yuta Ozaki waiwai2111
3
1.1k
Claude Cowork Plugins を読む - Skills駆動型業務エージェント設計の実像と構造
Avatar for 西岡 賢一郎 (Kenichiro Nishioka) knishioka
0
270
Shifting from MCP to Skills / ベストプラクティスの変遷を辿る
Avatar for Okuto Oyama yamanoku
2
330
Introduction to Sansan for Engineers / エンジニア向け会社紹介
Avatar for Sansan, Inc. sansan33
PRO
6
72k

Featured

See All Featured
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
Avatar for Katarina Dahlin katarinadahlin
PRO
1
3.5k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
304
21k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
333
24k
HDC tutorial
Avatar for Michiel Stock michielstock
1
500
Building Applications with DynamoDB
Avatar for Matt Wood mza
96
6.9k
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
Avatar for Christian Goodrich cargoodrich
3
120
The Curious Case for Waylosing
Avatar for Cassini Nazir cassininazir
0
260
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
39
3.1k
The SEO Collaboration Effect
Avatar for Kristina Bergwall kristinabergwall1
0
380
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
183
10k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.4k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k

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