“elm-starter”, a tool for the Modern Web

Lucamug
6 min readJul 26, 2020
Mount Fuji seen from Kawaguchi lake by WorldInMyEyes from Pixabay

Lately there has been some interesting discussion about Modern Web.

I personally think that

  • Single Page Applications (SPAs) have been (ab)used in places where a more traditional server side approach could have been a better fit
  • SPAs require extra care (navigation, scrolling, accessibility, SEO, etc.)
  • There are many SPAs that are not well crafted but when they are well made, SPAs can very much enhance the user experience
  • The browser feels like the natural place where to handle complex UIs, not the Server
  • As developers, I (we?) like to keep using my best tools to improve the Developer Experience

Related to the last point I feel that the Elm language come with a curse:

Once you are in Elm, you want to stay in Elm

This is not happening only with Elm, but with any compiled-strictyly-typed-inferred-immutable-purely-functional-with-nice-errors language.

So to alleviate some of these issues I made a small script to convert Elm SPAs into Statically Generated Progressive Web Applications (PWAs), called elm-starter.

(Yes, another one)

Goal

The goal is to have a tool that

  • Is mainly written in Elm (see the curse mentioned above)
  • Supports the majority of Elm libraries (elm-ui, elm-spa, etc.)
  • Relatively simple to use
  • Can be used to bootstrap a new app or to convert an existing one
  • Is not invasive and can be removed at any time

The resulting PWA should have these characteristics

  • Works without Javascript
  • Works off-line
  • Is installable on mobile/desktop
  • Is friendly to bots (SEO)
  • Supports preview cards
  • Renders fast (gets high scores in Lighthouse)

The classic Lighthouse screenshot with confetti 🎉

--

--