Community driven Elm guide for JS people
This guide will augment the official Elm docs as needed, for a smooth transitions for people coming from JavaScript.
- Try the Hello World online
- Install Elm via npm or the installer.
- Get Hello World running locally
- Work through the architecture examples. Type manually, look in
examples/
for help.
- Install Elm
- Create a new file
Main.elm
in a new folder. $ elm package install
to set upelm-package.json
andelm-stuff/
for deps (similar to node).- Paste the source from the Hello World example to your local
Main.elm
file. $ elm package install evancz/elm-html
to install the missing package dependency.$ elm-reactor
to get the dev server running athttp://0.0.0.0:8000/
.- Success!
- For a standalone file you can run
$ elm make Main.elm --output=main.html
(default is a JS file).
Writing them is optional, but highly encouraged. Type annotations improve code by helping you think about what the function should be doing, and serve as compiler-verified documentation. In addition, if you ever want to publish a third-party library, you need type annotations.
-- A variable of type Int.
answer : Int
answer = 42
-- An update function that takes 2 params - an Action, then a Model and returns a Model (last).
update : Action -> Model -> Model
In JavaScript, params are handled at the same time. In Elm, they are curried. For example:
-- Update is a function that will take an Action param, and return a function that will take a Model param. THAT fn will return a Model.
update : Action -> Model -> Model
If you see mistakes, or something you want covered, open an issue or a PR.
Add sections for
- Package management (compare to node_modules, npm)
- Type Annotations
- Data types (try not to duplicate official docs)
- Basic Syntax
- Program structure and flow
- How to read the API docs
- Package catalog link.