Search code examples
routesjsrenderjsviews

How to create a route using JsViews?


I have multiple pages

Index.jsp, contact.html, content.html

I have tried creating a router of own with the help of

window.addEventListener('hashchange', router);

If I want to create a router with jsviews, could you please explain or provide link to documentation.

I have checked on https://www.jsviews.com/ but I found only routing with Hapi integration and no native solution. Could you also suggest an easy way for routing?


Solution

  • If you want your route to load different HTML pages from the server, then your route needs to be implemented on the server, so if you are using Express, or Hapi, on the server you can consider using Express or Hapi routes to return different pages. See https://github.com/BorisMoore/jsrender-node-starter for examples of this.

    JsViews runs in the browser, so is not involved in fetching new pages from the server. (You can do an ajax call of course, but the initial page loaded from the server is unchanged - and you are in effect using an SPA pattern - single page app.)

    As an SPA you can indeed have client-side routes, and the www.jsviews.com site is doing just that. Navigate the left-hand contents tree pane, and you will see the URL hash changes. Similarly use the search feature, and the hash will include search parameters, and will be 'bookmarkable' (such as http://www.jsviews.com/#search?s=hash). But in these scenarios you are not loading any new pages from the server (such as your contact.html). You can look at how www.jsviews.com does that, starting from this line: https://github.com/BorisMoore/jsviews.com/blob/gh-pages/index.js#L1428.