This is a minimal boilerplate for an Elm app with Parcel.
Run npm install and npm start to start a development server.
Last active
January 30, 2019 16:35
-
-
Save sch/05ad3bbcdb95131010da3e3121b9ae67 to your computer and use it in GitHub Desktop.
Minimum Elm boilerplate
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "type": "application", | |
| "source-directories": [ | |
| "." | |
| ], | |
| "elm-version": "0.19.0", | |
| "dependencies": { | |
| "direct": { | |
| "elm/browser": "1.0.0", | |
| "elm/core": "1.0.0", | |
| "elm/html": "1.0.0" | |
| }, | |
| "indirect": { | |
| "elm/json": "1.0.0", | |
| "elm/time": "1.0.0", | |
| "elm/url": "1.0.0", | |
| "elm/virtual-dom": "1.0.0" | |
| } | |
| }, | |
| "test-dependencies": { | |
| "direct": {}, | |
| "indirect": {} | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <body> | |
| <div id="app"></div> | |
| <script src="./index.js"></script> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var { Elm } = require("./Main.elm"); | |
| Elm.Main.init({ | |
| node: document.getElementById("app") | |
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| module Main exposing (main) | |
| import Browser | |
| import Html exposing (Html, button, div, text) | |
| import Html.Events exposing (onClick) | |
| type alias Model = | |
| { count : Int } | |
| initialModel : Model | |
| initialModel = | |
| { count = 0 } | |
| type Msg | |
| = Increment | |
| | Decrement | |
| update : Msg -> Model -> Model | |
| update msg model = | |
| case msg of | |
| Increment -> | |
| { model | count = model.count + 1 } | |
| Decrement -> | |
| { model | count = model.count - 1 } | |
| view : Model -> Html Msg | |
| view model = | |
| div [] | |
| [ button [ onClick Increment ] [ text "+1" ] | |
| , div [] [ text <| String.fromInt model.count ] | |
| , button [ onClick Decrement ] [ text "-1" ] | |
| ] | |
| main : Program () Model Msg | |
| main = | |
| Browser.sandbox | |
| { init = initialModel | |
| , view = view | |
| , update = update | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "private": true, | |
| "scripts": { | |
| "start": "parcel index.html" | |
| }, | |
| "devDependencies": { | |
| "node-elm-compiler": "^5.0.1", | |
| "parcel-bundler": "^1.10.1" | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment