Building a Better Web
June 11–12, 2018: Training
June 12–14, 2018: Tutorials & Conference
San Jose, CA

Building web apps with Elm

Jeremy Fairbank (Test Double)
9:00am–12:30pm Tuesday, June 12, 2018
Future JS and Functional
Location: San Jose Ballroom 1-3 (Marriott)
Secondary topics:  Hands-on, Technical

Who is this presentation for?

  • Frontend developers

Prerequisite knowledge

  • A working knowledge of HTML and JavaScript
  • Familiarity with React and Redux (useful but not required)

Materials or downloads needed in advance

  • A laptop with a modern browser installed (We will use Ellie for running demos and exercises.)

What you'll learn

  • Learn how to build frontend applications with the Elm Architecture, define and call Elm functions, document code with type annotations, and create custom types with union types


Join Jeremy Fairbank to learn how to build frontend applications with the Elm language, a statically typed functional programming language that compiles to JavaScript and has no runtime exceptions in practice.

You’ll begin by exploring Elm’s syntax, defining and calling functions with familiar data types such as strings and numbers, and discover that Elm’s functions have no side effects, meaning they are predictable, reliable, and easily testable. You’ll then build your first application with the Elm Architecture, Elm’s framework for building frontend applications, defining a model to hold application state, a view function to display the state in the browser, and an update function to handle events and create new state to display.

Jeremy concludes by highlighting the safety of building Elm applications by introducing static types. You’ll add type annotations to document your code and see how the Elm compiler prevents type errors. You’ll also improve event handling by creating your own custom type to define the exact kinds of events in our application and see how the compiler ensures you handle all events in your application to prevent bugs. You’ll leave ready to build your own Elm applications.

Photo of Jeremy Fairbank

Jeremy Fairbank

Test Double

Jeremy Fairbank is a web developer at Test Double, where he helps improve how the world builds software. Jeremy has many years of experience in frontend and full stack development and has presented numerous times on web development at conferences such as Fluent Conf and RailsConf. He is passionate about frontend development and its future, especially in functional JavaScript and Elm, and is the author of Programming Elm from the Pragmatic Programmers.

Comments on this page are now closed.


Picture of Jeremy Fairbank
05/31/2018 11:37pm PDT

Hello, everyone.

Please visit this repo and follow the instructions for installing dependencies on your local machine:

We will be using Ellie to run demos and exercises. However, if we run into any issues with Ellie, then we will instead use the above repo, so it will be helpful if you have already installed dependencies. The repo also lists the Ellie URLs we will use for demos and exercises.