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!)

Pages.Index

page =
    Page.static
        { title = title
        , view = view
        }

Pages.Counter

page =
    Page.sandbox
        { title = title
        , init = init
        , update = update
        , view = view
        }

Pages.Random

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

Pages.SignIn

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:

git clone https://github.com/ryannhg/elm-spa.git && cd elm-spa
npm install
npm run dev

2.2 KiB Raw Blame History