Build a Cart Powered By State Machines — Learn With Jason

State machines help us visualize complex UI logic and make our components much more predictable and error resistant. In this episode, Jason creates a state machine using xstate to manage the opening and closing of an animated cart component. - demo: https://deploy-preview-15--swag.netlify.com/ - repo: https://github.com/netlify/swag-site/pull/15 Links: - https://xstate.js.org/viz/?gist=12a349643a70a8b09c7f7841b5168284 - https://xstate.js.org/docs/packages/xstate-react/ - https://en.wikipedia.org/wiki/Finite-state_machine - https://codepen.io/jlengstorf/pen/oNXpeqd - https://gedd.ski/post/state-machines-in-react/ - https://reactjs.org/docs/forwarding-refs.html - https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translate - https://shop.coavacoffee.com/ - https://www.partycorgi.com/ Watch future episodes live at https://www.twitch.tv/jlengstorf Credits: Local Elevator by Kevin MacLeod is licensed under a Creative Commons Attribution license (https://creativecommons.org/licenses/by/4.0/) Source: http://incompetech.com/music/royalty-free/index.html?isrc=USUAN1300012 Artist: http://incompetech.com/ Busybody by Audionautix is licensed under a Creative Commons Attribution license (https://creativecommons.org/licenses/by/4.0/) Artist: http://audionautix.com/ Additional sound effects obtained from https://www.zapsplat.com