🤖 Finite State Machines with XSTATE & Svelte 🔴 LIVE Coding & Chill
Let’s take our FINITE STATE MACHINES to the next level, by bringing in `xstate`!
Finite State Machines sound intimidating, but we’re already using straightforward ones for our forms, such as our login form: https://techy.cat/login
No external dependencies either, only a typed `FormState` of `'idle' | 'loading' | 'success' | Error` 😄
But now, we’ll bring in `xstate` and see if we can leverage its extra complexity, to make our Memory Game logic easier to follow. Easier logic flow, would make it easier to add features like persistence, and polish like a “hit-stop” effect whenever we make a mistake!
Try out the Memory Game we made in previous streams here: https://techy.cat/games/memory
Agenda
[ ] What are Finite State Machines? What’s `xstate`??? https://xstate.js.org/
[ ] Seeing is believing! Stately Visualizer & Editor: https://stately.ai/viz/fff72866-9259-...
[ ] What’s our Memory Game again, and why could it benefit from `xstate`?
[ ] Magic VSCode Extension: https://marketplace.visualstudio.com/...
[ ] Let’s implement our `memoryGameMachine`!
[ ] Can we use `delay` to add `hit-stop` to misses?
[ ] Can we also make the move counter more fun?
[ ] Serialise state and persist to `localStorage`!
[ ] Expire persisted state based on game mode!
[ ] Feedback on the browser with `@xstate/inspect` https://xstate.js.org/docs/packages/x...
[ ] Model-based testing?! https://github.com/statelyai/xstate/t...
It's likely we'll be adding / demo-ing stuff in this app, so click around yourself: https://techy.cat
See the code: https://github.com/jmagrippis/techy-cat
No affiliations whatsoever: if I show something, you know you're hearing my unfiltered thoughts 😄
My own website: https://magrippis.com/
Search for `@jmagrippis` to find me on socials like Discord, Instagram & Twitter!
Between the comment section and the socials, let me know *somewhere* what you’d like me to cover next 🙌
Watch video 🤖 Finite State Machines with XSTATE & Svelte 🔴 LIVE Coding & Chill online without registration, duration hours minute second in high quality. This video was added by user Johnny Magrippis 01 January 1970, don't forget to share it with your friends and acquaintances, it has been viewed on our site 1,111 once and liked it 31 people.