import Html exposing (Html, button, div, text)
import Html.Events exposing (onClick)
main =
Html.beginnerProgram { model = model, view = view, update = update }
-- MODEL
type alias Model = Int
model : Model
model =
0
Slide 11
Slide 11 text
-- UPDATE
type Msg = Increment | Decrement
update : Msg -> Model -> Model
update msg model =
case msg of
Increment ->
model + 1
Decrement ->
model - 1
-- VIEW
view : Model -> Html Msg
view model =
div []
[ button [ onClick Decrement ] [ text "-" ]
, div [] [ text (toString model) ]
, button [ onClick Increment ] [ text "+" ]
]
Slide 12
Slide 12 text
WHY IS IT
BETTER ?
(IN MY OPINION)
Slide 13
Slide 13 text
FRIENDLY COMPILER
Slide 14
Slide 14 text
FASTER THAN ANGULAR / REACT / THIS WEEK'S
FRAMEWORK
Slide 15
Slide 15 text
JAVASCRIPT INTEROP
you can start writing elm next to your React components
import Elm from 'react-elm-components';
import { Counter } from '../elm/Cou.elm';
...
Slide 16
Slide 16 text
PIPE OPERATOR
sum (filter (isOver 100) (map getCost records))
vs
records
|> map getCost
|> filter (isOver 100)
|> sum