Jagwah

The Jagwah class is used to create a new application instance, although you can create multiple instances within a single Browser context it's not the intended usage and has not been thoroughly tested.

Usage

You can create a new Jagwah instance using the Jagwah() class.

const jagwah = new Jagwah(...);

Options

When creating a new Jagwah instance you can pass in a Jagwah.options object.

const jagwah = new Jagwah({
  constants: { ... },
  providers: [ ... ],
  templates: [ ... ],
  routes: [ ... ],
});

Constants

The constants property is good for "global" information that you might need throughout your application, such as environment variables, urls and more. If the constants property is used it should be an object with any shape.

const jagwah = new Jagwah({
  constants: {
    CDN_URL: 'https://cdn.jagwah.com/',
    API_URL: 'https://api.jagwah.com/',
  },
});

Providers, Templates, Routes

The providers, templates and routes properties can be used to register arrays of Providers, Templates and Routes instead of using the individual methods (jagwah.Provider(), jagwah.Template(), jagwah.Route()).

const jagwah = new Jagwah({
  providers: [MyProvider, ...],
  templates: [MyTemplate, ...],
  routes: [MyRoute, ...],
});

Tip

An neat way to use the providers, templates and routes properties is to use barrel files and import your modules all at once and then use the Object.values() method.

import * as providers from './providers';

const jagwah = new Jagwah({
  providers: Object.values(providers),
  ...
});

However, this prevents code-splitting (since all the things are required at startup), unfortunately there is no documented way to easily split code because code splitting is hard - submit a feature request if you come up with a way.

Start

The start() method is used to initialize a Jagwah application, it takes one argument (Jagwah.start.options) which has optional before and after properties. Those properties accept an array of middleware-like classes, you can use dependency injection and run tasks before an internal update occurs between the before and after calls.

The example below has a single before handler injects an AccountProvider to check the sign-in status before the first render. Things that occur within the before handler should be fast because they'll prevent the initial render.

export class BeforeStartCheckAuth {
  constructor(
    @Inject('$account') private $account: providers.AccountProvider,
  ) {}
  async task() {
    await this.$account.signCheck();
  }
}

jagwah.start({
  before: [BeforeStartCheckAuth],
  after: []
});

The classes should use dependency injection during construction and expose a task() method which will be called by Jagwah.

Update

The update() method will call the render() method on all active templates, it's used internally when a Route is called with template delcarations. You should typically use it within Providers when your state changes and Templates need to be updated.