Elmish on the server — Introducing Elmish.Bridge

My first contact with F# was an accident. I stumbled upon a thread on 4chan where some people were hyping it and other were dismissing them on a not very polite manner. Your everyday 4chan.

I decided to give it a chance and it was awful. I had no experience with something functional, so it was a uphill fight with the type system. But I enjoyed when stuff worked. That made me study it more and now I love it.

But Elmish? That was love on the first sight. Never was a front-end developer or even web developer, but the architecture made everything so easy and sensible that I wanted to port every other project I did before to it.

Not long after I discovered it, the SAFE-Stack was released. Promising a isomorphic experience both on the server and the client, I went for it! And then I was a little frustrated.

Doing server code and client code was day and night. The client had a well defined state-machine, but the server felt disconnected. It was made somewhat better with Fable.Remoting, but still not quite what I wanted. I added some features for it and it got real good, until it was a bloated mess of hard to maintain code because of me. 😅

It’s not the case anymore, Zaid Ajaj did an awesome rewrite recently and it got even better, efficient and with the feature hell under control. But it was that experience that gave me the knowledge I needed to create Elmish.Bridge.


So, what is Elmish.Bridge?

I could say that it’s a websocket plugin for Elmish, yadda yadda technical words yadda, but let’s focus on the problem it solves and the solution it presents.

Problem is: There wasn’t an Elmish counterpart for the server part, communicating with the client. It was Elmish on the client, plus some requests querying data from the server that it could consume, normally by http requests, promises and other complexity that made me annoyed. I want to have Elmish on the server too.

And so I did. The first version was a total flop. It did nothing different from the current version but the how to use it was terrible. My mistakes were:

  • I rewrote the main functionality of Elmish, making something incompatible
  • Added a new kind of message to explicitly say: That’s a server message, redirect it for the server/This is a client message, you can consume it.

That made converting a normal Elmish program a real pain. If you used libraries that changed the kind of message, you needed to jump through hoops to use them.

So I came to my senses and did something better. The new client version is super easy to use, all you need is attach it to the existing Program and then you can send the messages with Bridge.Send .

As for the server — it’s not quite as simple as the client, but it’s a small price compared with what you needed to do before. When I started writing this article I thought about writing some code, showing how to do things, but then I saw this:

There is some code on the project’s README and I’m happy to give advice if any point of pain appears, but writing a in-depth tutorial may prevent a new use to appear. I’m curious to see what people will try to do with it. A dumb question can become a new feature.

So, if you have a SAFE project please give it a try! Don’t be afraid to open issues and ask questions. You can find me on Slack, twitter and on the Gitter.

Download it from nuget:

Check out the repository:

Happy bridging!