How to create modular Elm code that scales nicely with your app
Switch branches/tags
Nothing to show
Clone or download
Type Name Latest commit message Commit time
Failed to load latest commit information.
examples Shuffle examples for new effects/ section of guide Nov 14, 2018
.gitignore Add initial set of examples Jan 11, 2015
LICENSE Update the license for 2016 Apr 25, 2016 Update everything for 0.19 Aug 21, 2018
elm.json Update dependencies for some patches Nov 15, 2018


Elm is a programming language that compiles to JavaScript. It is known for its friendly error messages, helping you find issues quickly and refactor large projects with confidence. Elm is also very fast and very small when compared with React, Angular, Ember, etc.

This repo focuses The Elm Architecture, an architecture pattern you see in all Elm programs. It has influenced projects like Redux that borrow core concepts but add many JS-focused ideas.

The Elm Architecture

The Elm Architecture is a simple pattern for architecting webapps. The core idea is that your code is built around a Model of your application state, a way to update your model, and a way to view your model.

To learn more about this, read the the official guide and check out this section which is all about The Elm Architecture. This repo is a collection of all the examples in that section, so you can follow along and compile things on your computer as you read through.

Run The Examples

After you install, run the following commands in your terminal to download this repo and start a server that compiles Elm for you:

git clone
cd elm-architecture-tutorial
elm reactor

Now go to http://localhost:8000/ and start looking at the examples/ directory. When you edit an Elm file, just refresh the corresponding page in your browser and it will recompile!