single page apps made easy
Go to file
2019-11-01 15:43:22 -05:00
cli add init functionality 2019-11-01 15:43:22 -05:00
examples i feel much better about the elm docs now 🙂 2019-11-01 00:30:18 -05:00
src i feel much better about the elm docs now 🙂 2019-11-01 00:30:18 -05:00
.gitignore cli generates things for you 2019-10-31 00:05:55 -05:00
.npmignore prepare for npm publish 2019-11-01 13:46:38 -05:00
docs.json i feel much better about the elm docs now 🙂 2019-11-01 00:30:18 -05:00
elm-analyse.json a fresh start :) 2019-10-15 23:52:54 -05:00
elm.json write up some docs for the package 2019-10-31 22:06:59 -05:00
LICENSE add license because laws 2019-11-01 00:32:49 -05:00
netlify.toml a fresh start :) 2019-10-15 23:52:54 -05:00
package-lock.json add init functionality 2019-11-01 15:43:22 -05:00
package.json ugh, sharing tags is weird 2019-11-01 13:47:29 -05:00
README.md add absolute links in readme 2019-11-01 00:37:47 -05:00

ryannhg/elm-spa

an experiment for creating single page apps with Elm!

trying it out

Note: the API is still experimental! (hoping to post on discourse soon for community feedback)

elm install ryannhg/elm-spa

overview

module Main exposing (main)

import Application
import Generated.Pages as Pages
import Generated.Route as Route
import Global


main =
    Application.create
        { ui = Application.usingHtml
        , routing =
            { routes = Route.routes
            , toPath = Route.toPath
            , notFound = Route.NotFound ()
            }
        , global =
            { init = Global.init
            , update = Global.update
            , subscriptions = Global.subscriptions
            }
        , page = Pages.page
        }

keep your pages simple

(Instead of making everything an elm-fork-knife!)

page =
    Page.static
        { title = title
        , view = view
        }
page =
    Page.sandbox
        { title = title
        , init = init
        , update = update
        , view = view
        }
page =
    Page.element
        { title = title
        , init = init
        , update = update
        , subscriptions = subscriptions
        , view = view
        }
page =
    Page.component
        { title = title
        , init = init
        , update = update
        , subscriptions = subscriptions
        , view = view
        }

while the top level stays easy to read!

init appRoute =
    case appRoute of
        Route.Index route ->
            index.init route

        Route.Counter route ->
            counter.init route

        Route.Random route ->
            random.init route

( It's like magic, but actually it's just functions. )

run the example

this project comes with an example in examples/html.

Here's how to run it:

  1. git clone https://github.com/ryannhg/elm-spa.git && cd elm-spa

  2. npm install

  3. npm run dev