module Counter where
import Html exposing (..)
import Html.Events exposing (onClick)
-- MODEL
type alias Model = Int
init : Int -> Model
init count = count
-- UPDATE
type Action = Increment | Decrement
update : Action -> Model -> Model
update action model =
case action of
Increment -> model + 1
Decrement -> model - 1
-- VIEW
view : Signal.Address Action -> Model -> Html
view address model =
div []
[ button [ onClick address Decrement ] [ text "-" ]
, div [] [ text (toString model) ]
, button [ onClick address Increment ] [ text "+" ]
]
No Side Effects
And No Run Time Errors
type alias Model = Int
type Action
= GetDataFromServer
| UpdateDataFromServer Result
GetDataFromServer ->
( model, Http.get "https://example.com/api/data" |> Task.map UpdateDataFromServer )
UpdateDataFromServer result ->
case result of
Ok val ->
( { model = val } , Effects.none )
Err msg ->
( model , Effects.none )
Main.elm
port dropzoneUploadedFile : Signal (Maybe Int)
interop.js
dropZone = new Dropzone();
dropZone.on('complete', function(response) {
var id = parseInt(response.id);
elmApp.ports.dropzoneUploadedFile.send(id);
});
Unit Testing
Without mocking the entire internet
Counter.elm
update : Action -> Model -> Model
update action model =
case action of
Increment -> model + 1
Decrement -> model - 1
CounterTest.elm
[ test "negative count" (assertEqual 0 (update Increment -1))
, test "zero count" (assertEqual 1 (update Increment 0))
, test "positive count" (assertEqual 2 (update Increment 1))
]
Elm // PowToon
Gizra // 20+ people // Israel & US // Fancy clients