Skip to content

v0.0.142 Route-based templates

Compare
Choose a tag to compare
@peeke peeke released this 02 Aug 08:28
· 57 commits to master since this release

This PR allows you to re-route visitors to different entry points of your application. @kaliber/build serves all javascript used in the entry point, also for routes which might not need all functionality. Splitting your app into different entry points allows you to create smaller chunks of JavaScript.

You should determine which templates to create, based on similar functionality.

In the following example:

  • visiting the url /routeBasedTemplate/test1 serves the page found in /src/routeBasedTemplate/template1/index.html.js
  • visiting the url /routeBasedTemplate/test2 serves the page found in /src/routeBasedTemplate/template2/index.html.js
  • visiting any other url falls back to the index.html.js file containing the resolveIndex function.
Index.routes = {
  resolveIndex(location, req) {
    const { pathname } = location
    return (
      pathname === '/routeBasedTemplate/test1' ? 'routeBasedTemplate/template1' :
      pathname === '/routeBasedTemplate/test2' ? 'routeBasedTemplate/template2' :
     null
    )
  },

  async match({ pathname }, request) {
    return { status: 200, data: { hostname: request.hostname, pathname } }
  }
}

export default function Index({ data }) {
  return (
    <html lang='en'>
      {head('Fallback')}
      <body>
        Fallback
      </body>
    </html>
  )
}