Elm at First Blush: A Noob’s Impression of the Haskell-esque Language for Front End Development

Aspen Hopkins
4 min readMay 9, 2017

If you’re anything like me — essentially a noob in all things functional — you’ve heard about Elm, but have little actual experience developing in it. At this point, I’ve taken a class that spent two-ish weeks on Elm. I wanted to share my initial feelings on the language for those of you who have heard of Elm, but are unsure as to whether it’s worth the time to get emersed in the community.

With that in mind (and the fact that I’ve wanted to make a blog for a while anyway), here’s an introduction to web development using elm.

What is Elm?

Elm is a functional language that compiles to Javascript. It was structured in order to avoid many of the pitfalls and confusion found in Javascript development. For one, there are NO runtime exceptions. Null and undefined are nonexistent — a weird and possibly fantastic idea.

Building web applications in Javascript is like building a snowball: the more “snow”, or simultaneous actions, you add to your app, the more overhead there is to deal with. It’s ridiculous, and has given rise to a plethora of libraries dedicated to helping developers interact with DOM interfaces (thank you, AngularJS).

On top of the normal growing pains associated with Javascript development, there is the issue of maintaining and updating the apps down the road. Refactoring is nerve-wracking. Elm handles that anxiety for you as a frontend warrior of testing. This is because Elm is functional: at its heart, Elm relies on segmented, structured functions that always return something. That something is a value derived from the parameters described in the function, not the current state of a program. To quote the greatest source ever (Wikipedia):

In functional code, the output value of a function depends only on the arguments that are passed to the function, so calling a function f twice with the same value for an argument x will produce the same result f(x) each time; this is in contrast to procedures depending on local or global state, which may produce different results at different times when called with the same arguments but different program state. Eliminating side effects, i.e. changes in state that do not depend on the function inputs, can make it much easier to understand and predict the behavior of a program, which is one of the key motivations for the development of functional programming.

That’s right folks, every function in Elm is an isolated microcosm perfect for pummeling with all the bizarre scenarios that users may force upon your beautiful code. It’s a valuable thing to have in the quickly evolving world of web-development. Just think: tests that practically write themselves! The interwebs would be a much safer — well, stable — place, indeed.

In addition to the fantastic environment for testing, Elm has a quickly growing community of fangirls. Or non-gendered individuals that happen to adore the language. You know what I mean.

Cons of Elm

Do a quick search, and you’ll hear a lot of adulators echoing what I’ve said so far. But there are a few cons associated with using Elm. The major issues I have with Elm stem from it being so new. The people who use Elm are generally proficient programmers, and have a little familiarity with functional programming. While the Elm language website has fantastic tutorials and a lot of support for new users, you won’t be babied through the learning process. It’s not an easy language, and people who’ve never programmed before are going to have a hard time understanding what’s going on. If you feel comfortable enough to dip your toes into Elm, do it the right way.

Use the Tutorials

Take the time to walk through tutorials and really get a feel for the vibe. I don’t care what anyone says, Elm’s learning curve is steep AF. Knowing Javascript will not save you, as the syntax is not similar. Plus, the mindset of Elm is just janky… or it feels that way, at first. In truth, once you’ve adjusted, you’ll find it a logical, elegant language. It always follows the same structure (a convenient and easily reproducible recipe for success in my book).

Last, but not least, there are not many libraries. Want to play with HTML Canvas? Good luck. I have spent a not-insignificant amount of time playing around with Canvas, and can only hope that someone comes along soon to improve that gnarled mess. Javascript integration can also be a pain, and there are no great IDEs.

In general, I do think that Elm is great. It’s very young, and has a small community. There are a few good tutorials, and the community is gaining momentum. Starting now and getting familiar with Elm will only be beneficial, as I suspect that the future in web development will focus in on functional languages.

Good luck, and code on!

Sharing Cat GIFs is Caring

--

--

Aspen Hopkins

Hi! I’m a PhD student at MIT. I’m interested in AI, HCI, data visualization, and how tech impacts human experiences. Find me @ AspenHopkins.com