Highway

@JoGrenat #elmlang
to
Elm

Highway
to
Elm
Functional
programming
Immutability
Components
Types
One-way
data flow
Virtual DOM
Happiness (DX)
    "Elm is a functional language that compiles to JavaScript. [...] Elm has a very strong emphasis on simplicity, ease-of-use, and quality tooling."
JS Interop

Runtime
Exception

Great performance
Enforced Semantic Versioning

Syntax
let
  twentyFour =
    3 * 8
  sixteen =
    4 * 4
in
  twentyFour + sixteen
    case myStringMaybe of
  Just myString -> myString
  Nothing -> "Empty"
case myListOfString of
  head :: tail -> head
  [] -> "no value in list"
case myNumber of
  0 -> "0"
  1 -> "1"
  _ -> "Nor 0 nor 1"
    The Elm Architecture (TEA)
Cmd Msg
Communication with JS
main : Program Never Model Msg
main =
    program { view = view, init = init, update = update, subscriptions = subscriptions }
-- ...
subscriptions : Model -> Sub Msg
subscriptions model =
    usernameFromLS ReceivedUsernameFromLS
port registerUsernameToLS : String -> Cmd msg
port usernameFromLS : (String -> msg) -> Sub msgCommunication with JS
const app = Elm.Main.embed(root);
app.ports.registerUsernameToLS.subscribe(username => {
    window.localStorage.setItem('username', username)
});
if (window.localStorage.getItem('username') !== null) {
    const username = window.localStorage.getItem('username');
    app.ports.usernameFromLS.send(username);
}Questions ?
Slides : http://slides.com/ereold/elmlang-workshop
Links
Slides : http://slides.com/ereold/elmlang-workshop
Official website: http://elm-lang.org
Syntax: http://elm-lang.org/docs/syntax
Feedback: http://bit.ly/2DEBZud
Workshop - Highway to Elm!
By ereold
Workshop - Highway to Elm!
- 1,804