Elm Language

#elm

Table of Contents

About 1

Chapter 1: Getting started with Elm Language 2

Remarks 2

Versions 2

Examples 2

Installation 2

Using the installer 2

Using npm 3

Using homebrew 3

Switch between versions with elm-use 3

Further reading 3

Hello World 3

Editors 4

Atom 4

Light Table 4

Sublime Text 4

Vim 4

Emacs 4

IntelliJ IDEA 4

Brackets 4

VS Code 4

Initialize and build 5

Initialization 5

Building the project 5

Style Guide and elm-format 5

Embedding into HTML 6

Embed into the body tag 6

Embed into a Div (or other DOM node) 7

Embed as a Web worker (no UI) 7

REPL 8

Local Build Server (Elm Reactor) 10

Chapter 2: Backend Integration 11

Examples 11

Basic elm Http.post json request to node.js express server 11

Chapter 3: Collecting Data: Tuples, Records and Dictionaries 14

Examples 14

Tuples 14

Accessing values 14

Pattern matching 14

Remarks on Tuples 14

Dictionaries 14

Accessing values 15

Updating values 15

Records 16

Accessing values 16

Extending Types 16

Updating values 17

Chapter 4: Custom JSON Decoders 19

Introduction 19

Examples 19

Decoding into union type 19

Chapter 5: Debugging 20

Syntax 20

Remarks 20

Examples 20

Logging a value without interrupting computations 20

Piping a Debug.log 20

Time-traveling debugger 21

Debug.Crash 21

Chapter 6: Functions and Partial Application 23

Syntax 23

Examples 23

Overview 23

Lambda expressions 24

Local variables 24

Partial Application 25

Strict and delayed evaluation 26

Infix operators and infix notation 27

Chapter 7: Json.Decode 28

Remarks 28

Examples 28

Decoding a list 28

Pre-decode a field and decode the rest depending on that decoded value 28

Decoding JSON from Rust enum 29

Decoding a list of records 30

Decode a Date 31

Decode a List of Objects Containing Lists of Objects 32

Chapter 8: Lists and Iteration 34

Remarks 34

Examples 34

Creating a list by range 34

Creating a list 34

Getting elements 35

Transforming every element of a list 36

Filtering a list 36

Pattern Matching on a list 37

Getting nth element from the list 37

Reducing a list to a single value 38

Creating a list by repeating a value 39

Sorting a list 40

Sorting a list with custom comparator 40

Reversing a list 40

Sorting a list in descending order 41

Sorting a list by a derived value 41

Chapter 9: Making complex update functions with ccapndave/elm-update-extra 42

Introduction 42

Examples 42

Message which call a list of messages 42

Chaining messages with andThen 42

Chapter 10: Pattern Matching 44

Examples 44

Function arguments 44

Single type deconstructed argument 44

Chapter 11: Ports (JS interop) 45

Syntax 45

Remarks 45

Examples 45

Overview 45

Note 45

Outgoing 45

Elm side 45

JavaScript side 46

Note 46

Incoming 46

Elm side 46

JavaScript side 47

Note 47

Immediate outgoing message on start-up in 0.17.0 47

Get started 48

Chapter 12: Subscriptions 50

Remarks 50

Examples 50

Basic subscription to Time.every event with 'unsubscribe' 50

Chapter 13: The Elm Architecture 52

Introduction 52

Examples 52

Beginner program 52

Example 52

Program 53

Example 53

Program with Flags 55

One way parent-child communication 56

Example 56

Message tagging with Html.App.map 57

Chapter 14: Types, Type Variables, and Type Constructors 59

Remarks 59

Examples 59

Comparable data types 59

Type Signatures 59

Basic Types 60

Type Variables 61

Type Aliases 62

Improving Type-Safety Using New Types 63

Constructing Types 65

The Never type 65

Special Type Variables 66

Credits 68

About

You can share this PDF with anyone you feel could benefit from it, downloaded the latest version from: elm-language

It is an unofficial and free Elm Language ebook created for educational purposes. All the content is extracted from Stack Overflow Documentation, which is written by many hardworking individuals at Stack Overflow. It is neither affiliated with Stack Overflow nor official Elm Language.

The content is released under Creative Commons BY-SA, and the list of contributors to each chapter are provided in the credits section at the end of this book. Images may be copyright of their respective owners unless otherwise specified. All trademarks and registered trademarks are the property of their respective company owners.

Use the content presented in this book at your own risk; it is not guaranteed to be correct nor accurate, please send your feedback and corrections to info@zzzprojects.com

https://riptutorial.com/ 1

http://riptutorial.com/ebook/elm-language https://archive.org/details/documentation-dump.7z mailto:info@zzzprojects.com

Chapter 1: Getting started with Elm Language

Remarks

[Elm][1] is a friendly functional programming language compiling to JavaScript. Elm focuses on browser-based GUIs, single-page applications.

Users usually praise it for:

No runtime exceptions.• Best compiler errors ever• The ease of refactoring.• Expressive type system• The Elm Architecture, which Redux is inspired by.•

Versions

Version Release Date

0.18.0 2016-11-14

0.17.1 2016-06-27

0.17 2016-05-10

0.16 2015-11-19

0.15.1 2015-06-30

0.15 2015-04-20

Examples

Installation

To start development with Elm, you need to install a set of tools called elm-platform.

It includes: elm-make, elm-reactor, elm-repl and elm-package.

All of these tools are available through CLI, in other words you can use them from your terminal.

Pick one of the following methods to install Elm:

Using the installer

https://riptutorial.com/ 2

http://elm-lang.org/blog/compiler-errors-for-humans http://blog.jenkster.com/2016/06/how-elm-slays-a-ui-antipattern.html http://guide.elm-lang.org/architecture/ http://elm-lang.org/blog/the-perfect-bug-report https://gist.github.com/evancz/d5f418f42827262ece857aa8ff6458c6 http://elm-lang.org/blog/farewell-to-frp http://elm-lang.org/blog/compilers-as-assistants http://elm-lang.org/blog/compiler-errors-for-humans http://elm-lang.org/blog/announce/0.15 https://github.com/elm-lang/elm-platform https://github.com/elm-lang/elm-make https://github.com/elm-lang/elm-reactor https://github.com/elm-lang/elm-repl https://github.com/elm-lang/elm-package

Download the installer from the official website and follow the installation wizard.

Using npm

You can use Node Package Manager to install Elm platform.

Global installation:

$ npm install elm -g

Local installation:

$ npm install elm

Locally installed Elm platform tools are accessible via:

$ ./node_modules/.bin/elm-repl # launch elm-repl from local node_modules/

Using homebrew

$ brew install elm

Switch between versions with elm-use

Install elm-use

$ npm install -g elm-use

Switch to an older or newer elm version

$ elm-use 0.18 // or whatever version you want to use

Further reading

Learn how to Initialize and build your first project.

Hello World

See how to compile this code in Initialize and build

import Html

https://riptutorial.com/ 3

http://elm-lang.org/install https://www.npmjs.com/ http://www.riptutorial.com/elm/example/7220/initialize-and-build http://www.riptutorial.com/elm/example/7220/initialize-and-build

main = Html.text "Hello World!"

Editors

Atom

https://atom.io/packages/language-elm• https://atom.io/packages/elmjutsu•

Light Table

https://github.com/rundis/elm-light•

Sublime Text

https://packagecontrol.io/packages/Elm%20Language%20Support•

Vim

https://github.com/ElmCast/elm-vim•

Emacs

https://github.com/jcollard/elm-mode•

IntelliJ IDEA

https://plugins.jetbrains.com/plugin/8192•

Brackets

https://github.com/tommot348/elm-brackets•

VS Code

https://marketplace.visualstudio.com/items?itemName=sbrink.elm•

https://riptutorial.com/ 4

https://atom.io/packages/language-elm https://atom.io/packages/elmjutsu https://github.com/rundis/elm-light https://packagecontrol.io/packages/Elm%20Language%20Support https://github.com/ElmCast/elm-vim https://github.com/jcollard/elm-mode https://plugins.jetbrains.com/plugin/8192 https://github.com/tommot348/elm-brackets https://marketplace.visualstudio.com/items?itemName=sbrink.elm

Initialize and build

You should have Elm platform installed on your computer, the following tutorial is written with the assumption, that you are familiar