Simplistic implementation of SPA by changing page based on a Page reactive variable. Websharper blog post, Structuring Non-Linear Sites: http://websharper.com/blog-entry/3965/structuring-web-applications-with-websharper-ui-next

Websharper_ChangeOfPages_SPA

namespace UINextRouterTest

open WebSharper
open WebSharper.JavaScript
open WebSharper.JQuery
open WebSharper.UI.Next
open WebSharper.UI.Next.Html
open WebSharper.UI.Next.Client

[<JavaScript>]
module Client =
    
    type Page = Home | Configuration | Account

    type Context = { Go: Page -> unit }

    let HomePage ctx =
        Doc.Concat [
            h1 [text "Home"]
            p [ text "Blabla some stuff in the home" ]
            Doc.Link "link to go to config" [] (fun _ -> ctx.Go Configuration) ]
    
    let ConfigurationPage ctx =
        Doc.Concat [
            h1 [text "Config"]
            p [ text "Blabla config stuff config in the config" ]
            Doc.Link "link to go to account" [] (fun _ -> ctx.Go Account) ]
            
    let AccountPage ctx =
        Doc.Concat [
            h1 [text "Account"]
            p [ text "Blabla account stuff account in the account" ]
            Doc.Link "link to go to home" [] (fun _ -> ctx.Go Home) ]
    
    let Main =

        let rvPage = Var.Create Home
        let context = { Go=Var.Set rvPage }

        let doc =
            rvPage.View
            |> View.Map (function
                           | Home -> HomePage context
                           | Configuration -> ConfigurationPage context
                           | Account -> AccountPage context)
            |> Doc.EmbedView

        Doc.RunById "main" doc