Configure your elm-pages Program, similar to a Browser.application.
This is the entry point for your elm-pages application.
This is similar to how you set up a regular Elm application using Browser.application, but with a few differences.
view has access to StaticHttp data (see Pages.StaticHttp).view is able to set head tags which can be used for site metadata and SEO data.manifest lets you configure the manifest.json for your PWA (Progressive Web App).canonicalSiteUrl is the default domain for your <head> tags for SEO purposes (you can override it with canonicalUrlOverride,
see <Head.Seo>. Learn more about canonical URLs and why they are important in this article.internals is an opaque data type with some internal boilerplate from your elm-pages content. You should pass it internals = Pages.internals.Otherwise, you have a standard Elm app which
elm-pages LifecycleIt's helpful to understand the elm-pages lifecycle and how it compares to a vanilla elm app (i.e. a Browser.application).
elm-pages build)Whereas a vanilla Elm app simply compiles your Elm code at build time, elm-pages performs some lifecycle events at this stage.
StaticHttp.Requests (see <Pages.StaticHttp>) for every static page in your app. The StaticHttp Responses are stored in JSON
files called content.json (one JSON file for each static page in your site).<head> tags for the page from your view's head.static folder to the dist folder.The user will see the pre-rendered HTML when they initially load a page on your elm-pages site (unless you are in dev mode, i.e. elm-pages develop, in
which case there is no pre-rendering).
StaticHttp responses and page data (the content.json file for the current page).init function and update loop (not just the pre-rendered HTML content).
At this point, all of your subscriptions, etc. will behave as they would in a regular Elm application.content.json file), so that the page load is instant.Pass the initial required configuration for your elm-pages application.
Here's a basic example.
import Pages.Platform
main : Pages.Platform.Program Model Msg Metadata View
main =
Pages.Platform.init
{ init = init
, view = view
, update = update
, subscriptions = subscriptions
, documents =
[ { extension = "md"
, metadata = Metadata.decoder
, body = MarkdownRenderer.view
}
]
, onPageChange = Just OnPageChange
, manifest = manifest
, canonicalSiteUrl = canonicalSiteUrl
, internals = Pages.internals
}
|> Pages.Platform.toProgramWhen you're done with your builder pipeline, you complete it with Pages.Platform.toProgram.
The Program type for an elm-pages app.
Add some head tags that will be included on every page of your elm-pages site.
Include files to be generated. Any Err values will turn into a build error.
You can use StaticHttp data here, and it won't be included in your production build (it will just be fetched as needed during the build step). You also have access to all of your site's pages, with their path, metadata, and body.
Some use cases are to generate
import Pages.Platform
withRobotsTxt builder =
builder
|> Pages.Platform.withFileGenerator
(\siteMetadata ->
StaticHttp.succeed
[ Ok
{ path = [ "robots.txt" ]
, content = """
User-agent: *
Disallow: /cgi-bin/
"""
}
]
)
You can
initaBuilder, and then turn it to aProgramwithtoProgram.That gives you the basic options, then you can include optional configuration.