The next step in our Single Page Application series is to add url routing and navigation. There are two packages we’ll need for this. The first, Navigation,
will allow us to handle navigation events and starting the application on a page other than the home page.
The second package, Url-Parser, helps us parse our url’s path into an Elm sum type
which we can use to determine which page to render in the view.
Examples
shell
# Force the server to render index.html on 404s
./node_modules/.bin/webpack-dev-server --history-api-fallback
Main.elm
setRoute : Location -> Model -> Model
setRoute location model =
let
route =
UrlParser.parsePath Route.route location
|> Maybe.withDefault Route.Home
in
case route of
Route.Home ->
{ model | page = Home }
Route.Newest ->
{ model | page = Newest }
Links