https://github.com/jamen/hyperapp-page

A hyperapp router with prerendering and metadata support.
https://github.com/jamen/hyperapp-page

Last synced: 12 months ago
JSON representation

A hyperapp router with prerendering and metadata support.

• Host: GitHub
• URL: https://github.com/jamen/hyperapp-page
• Owner: jamen
• Created: 2019-04-23T23:08:36.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2019-04-23T23:11:59.000Z (about 7 years ago)
• Last Synced: 2025-02-08T01:48:18.802Z (over 1 year ago)
• Language: JavaScript
• Homepage:
• Size: 11.7 KB
• Stars: 2
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: readme.md

Awesome Lists containing this project

README

          
# @finepoint/hyperapp-page

A hyperapp router with prerendering and metadata support.

## Install

```

npm i @finepoint/hyperapp-page

```

## Usage

The module exports two actions, `routeInit(routes)` and `route(path)`. You call `routeInit` when the app is created, and you call `route` to change the page. There is a `Link` component that calls `route` for you. Finally, a `getPage(state)` gets the routed view.

Here is a small demo of all the pieces together:

```js

import { h, app } from 'hyperapp'

import { routeInit, route, Link, getPage } from '@finepoint/hyperapp-page'

const state = {

    sample: 'Hello'

}

const actions = {

    update: d => d,

    state: () => s => s,

    routeInit,

    route

}

const view = state => getPage(state)

const Home = () =>

    


        Home page.

        Go to /foo

    


const Foo = () =>

    
Foo page


const Lost = () =>

    


        404 page

        Return home.

    


const routes = {

    '/': Home,

    '/foo': Foo,

    [false]: Lost

}

const main = app(state, actions, view, document.body)

main.routeInit(routes)

```

Note: The `update` and `state` actions are required for the imported actions.