What would a TodoMVC in LiveView look like?

I’m looking for a front-end framework to implement a tutorial/game. It’d be cool to see how a Liveview implementation compares with the other TodoMVC entries.

The paradigm of functional programming is completely different from object orientated, thus you should not base your decision in the MVC style of it. Also, Elixir works a lot different from other functional langs due to the runtime it uses, the BEAM, where messaging passing between processes is what it shines at, therefore the MVC you are looking for may not be what you will find.

You can try to use Elixir in an MVC style but then you loose all the power of message passing to scale for millions of BEAM processes in a single machine to allow you to scale in a robust way.

The best framework is Phoenix, that by default uses a MVC style that may be or not what you are looking for, and you will see a lot of tutorials on the internet about it.

Maybe you want to start to take a look to:

But be careful to not use LiveView for controlling user actions on the client, that don’t require a round trip to the server, because a lot of excitement about being possible to do so lead to a lot of examples in that direction that due a disservice to LiveView, because this app will be sluggish in the real world, like when commuting by train, bus, etc.

To finish, the power of messaging passing in the BEAM will make it a very good candidate for you to build a game.

Maybe you want to see how to build a game with LiveView by learning from this awesome resources:

or with this book:

An important note:

I strongly dis-encourage to use LiveView to build client side games, except for the bits that are to mutate data, thus business logic, like scores, and/or chat, but never for the game itself. Exceptions will exist for sure, but you should really understand the trasde-offs involved.

1 Like

Thanks! For sure, I’m down with the functional approach. I think the Elm implementation is by far the cleanest and easiest to understand at first glance. But the Elm project is kind of hit or miss, with its maintenance. So I was wondering if there’s an equivalent in the Elixir ecosystem.

And yep, my app wouldn’t require round-trips at all - I’d like it to run entirely in the browser. I’ve also been looking at Prolog and CLIPS that compile to JS or run in-browser.

Then again, it’s really just a tutorial kind of app, so split second server responses wouldn’t be required. Are there any nice Elixir wrappers for JS frameworks like React?

1 Like

I am not aware of any pure Elixir client side framework, and I doubt it exists because Elixir is a server side language and doesn’t support compiling to Javascript in its core, but attempts have been made by others:

The above repo seems to be active any-more.

Saw now another contender on this forum:

You have now a very interesting project on the WebAssembly space:

If Lumen will fit your goals or not it’s up to you to discover. Personally I have not tried it out yet.

2 Likes