DevDays Vilnius 2019


May 21-23, 2019


Erik Wendel

BEKK Consulting, Norway


Erik is UI development expert, having worked with some of the largest web frontends in Norway for the past five years. He is passionate about creating great products, building efficient teams and using the right tools for the job, all while continously delivering value to the product. Erik is currently employed as a team lead at Norwegian Railways, trying to provide the smoothest digital experience possible to millions of train travelers.
He is profoundly interested in functional programming and a founder of Oslo Elm Meetup and Oslo Elm Day.


Building Reliable Web Apps With Elm And Typed Functional Programming


Elm is a typed, functional programming language that compiles to JavaScript. It’s famous for ensuring robust applications, and Elm’s wildly developer friendly compiler helps developers write elegant, long-lived and safe frontend code. It has recently started drawing widespread attention and is starting to position itself as something other compile-to-js languages hasn’t achieved yet – a viable alternative to JavaScript.

Elm utilizes a React-like rendering system, using a tree of pure view functions, while structuring its app using the so-called Elm architecture (which the Redux architecture is loosely based on). All data is immutable, of course, and the language supports fancy features such as algebraic data types, pattern matching and type inference.

Did this pique your interest? This workshop will get you started with Elm in no time. This includes a thorough explanation of syntax and semantics with comparison to JavaScript. The material also serves as an introduction to ML-style typed functional programming, and after this workshop you’ll be able to judge for yourself whether a language like Elm could ever replace JavaScript as our go-to tool for large-scale web development.


The workshop will cover the following topics:

  • Tuples
  • Records
  • Type Inference
  • Type Signatures
  • Union Types
  • Type Aliases
  • Pattern Matching
  • Functions
  • Partial Application
  • Currying
  • Maybe
  • Html.beginnerProgram
  • Piping

Target Audience

Level 1 – Introductory and overview material. Assumes little expertise with topic and covers topic concepts, functions, features, and benefits.


Course Prerequisites

  1. Install node version 7 or newer (which includes npm) from

  2. Install elm. This can be done with npm install -g elm, brew install elm (if on MacOS) or an old-school file download from

  3. Install a plugin for your editor. At the time of writing, Atom’s Elm integration seems the best so we strongly recommend you use that, even if Atom is not usually your main editor of choice.

    The following packages are needed for a pleasant development experience in Atom:

    • language-elm
    • linter-elm-make
    • elmjutsu
    • elm-format
  4. Install elm-format, which is a crucial tool to make your Elm experience more enjoyable.

    • npm install -g elm-format
    • Remember to make sure that elm-format is available on your PATH or that you tell your editor where to find it
    • In Atom, this can be done under package settings for the elm-format package: input the path to the elm-format binary.
    • You can find the path for elm-format by doing which elm-format on MacOS/*Nix or Get-Command elm-format in powershell on Windows
    • We also recommend you enable Format on save in your editor
  5. Clone the repo ( to your computer

  6. Run npm install (please make sure to have npm version 3 or newer)

  7. Start your local application environment with npm start in the root folder of this repo. This should open a new browser window with localhost:3000 and a nice compilation error.