Menu Home

Exploring the Elm programming language.

Recently I took my third attempt at learning Elm; the first two attempts faded out after doing the “Hello World” level of experimentation.

This time however I have made more progress. I tried to build something more targeted. I build first a small visualisation tool that shows progress of yachts in a race.

As you can see, it’s nothing sophisticated. The buttons at the bottom there move the bars across the top there. Initially the bars were plain text, but I moved them to SVG. Which was rather easy really as Elm has a very similar way of defining SVG as it does HTML.

It took very little time to get the interactions working. The Elm Architecture takes care of everything.

Later I added storing the state in the browser local storage. This was a bit trickier but again not too difficult as Elm has a recognisable pattern to follow. The hardest bit was probably getting my head around the JSON encoders and decoders in Elm.

Today I managed to get a working web application to facilitate the “1-2-4-All” style workshop. It’s a very basic timer really; with text that changes as time goes by at the moment. Take a look at the early prototype at https://ellie-app.com/9crt7ZjNBk5a1

Unlike the first app; this one uses a “subscription”. This is Elm’s way of receiving ongoing inputs from the outside world, in this case time. So in my case every second it sends a “tTck” Msg and the update function keeps track of the seconds that have gone by.

As various numbers of seconds go by I change the message on the page. Nothing sophisticated, but it works.

As a newbie to Elm it’s not been too bad. It’s easy to pick-up. I am hoping that as I refine this app I can do things in a more idiomatic way.

I still feel that despite this being a new language, a new programming style (functional) and front end (not my strength); I got this app working in comparable if not faster than i think I would have managed it in Javascript.

My next steps are to make this cleaner and prettier. I’ll make it have some shine. I am interested to see also if I can package this up in Electron or Tauri so it could be something you could download and run on your laptop as well as online. There is a material design package for Elm also; so i might explore this as a phone app too.

Stay tuned for more updates.

šŸ™‚

Categories: Uncategorized

Lance