I am writing a game of Risk (you know the board game) and I need a UI, xstate already powers the actor model that runs the UI and Server in a beautiful logical chart that fires up the http server, then SSE, sends messages to browser actors which then sends things through the xstate actor model on the front end.
Then we add polymers new html rendering fantastic thing, lit-html and hey presto a state driven UI that is sharing the same paradigms as the server (so much so that Actors front-end and backend all live in the same directory). It's functional style is so flexible and I can react to a multitude of events, redrawing only what I need to. It's super fast and surprisingly Dom driven. The only compiling is done because I like typescript, but even the front end of that uses esmodules. It's akin to traveling back in time then fast forwarding on an alternative timeline where react had never existed.
I would highly recommend this stack, I can't emphasize this enough. Try the ummm.. LXS™️ stack especially in isomorphic development.
Top comments (2)
I've toyed with xstate and I really like it. I think state charts have to be the future of software design. But I've struggled to implement it. Do you have any good tutorials you would recommend? The official docs don't answer all my questions (at least not in a way I understand).
Like anything I have ever tried to learn, I struggled the first 2 times to impliment something and gave up, I was always getting stuck on a few things.
I didn't get any help from tutorials, actually I'm largely borrowing snippets from the docs until they work. The big thing was the Actor model and actors section. Google have a fantastic video of how they implimented a UI with xstate and actors API in the docs, helped me make something useful, plus there is a repo to look over from the vid.