DevConf.US 2021

# Background: Not long ago, I decided I want to share my work and ideas with other people. The problem: it was hard to explain or describe them especially to family who aren't technical. Until I heard of Statecharts. Statecharts is based on finite state machines and Automata but adds extra features that make it fun and easy to describe how your code/logic works. It was a big deal to me because I could sketch a Statecharts graph and describe it to anyone. This gave me the motivation to solve problems I encountered in my day job or side projects and sketch them in a notebook so I could always go back and see how I solved them before or share these with friends and family. And then, I heard about XState and XState visualizer. I could literally implement my sketches into codebase without any effort and with the help of XState visualizer I could let anyone interact with my work and see it working online. That was really fun and I want to share with you some of these sketches and open source projects that you can use. # Agenda: - Intro about this talk - Finite State Machines - Statecharts history - XState & XState visualizer intro - Implementing a Stack: guards, actions and context features in Statecharts - Implementing a input field: history and services features in Statecharts - Implementing a debounce mechanism for input: timing feature in Statecharts - Implementing a text-editor: parallel features in Statecharts - Conclusions **Note**: agenda might be slightly changed in the future.