Elm Arcade

Getting Started With Elm and Typed Functional Programming

Welcome to this workshop! Today we're learning Elm and typed functional programming techniques through creating the classic game Memory.

The workshop will cover the following topics:

  • Tuples
  • Records
  • Type Inference
  • Type Signatures
  • Union Types
  • Type Aliases
  • Pattern Matching
  • Functions
  • Partial Application
  • Currying
  • Maybe
  • Running your application in the browser
  • Piping

Some of these concepts may be unfamiliar and somewhat confusing to begin with, so please do ask us if and when you get stuck, or simply have a question. That's what we're here for!

Presentation slides

The slides from the presentation are available here: part 1 & part 2.

Code

The code for the workshop is available here: https://github.com/ewendel/elm-workshop.

Prerequisites

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

  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 elm-lang.org.

  3. Install a plugin for your editor. At the time of writing we prefer VS Code for Elm development so we recommend you use that, even if VS Code is not usually your main editor of choice.

  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
    • Follow the instructions here to enable running elm-format in VS Code
    • 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
  5. Clone the repo (https://github.com/ewendel/elm-workshop) 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.

Congratulations, you're now ready to begin learning Elm!


Made by


Ingar Almklov

@ingara


Erik Wendel

@ewndl

results matching ""

    No results matching ""