silverstripe-framework/admin/client/src/boot
2016-07-07 10:22:24 +01:00
..
index.js API mute frontend debugging by default (#5777) 2016-07-07 10:22:24 +01:00
README.md API Initialise React controllers via routes (#5436) 2016-06-16 15:04:14 +12:00

Boot process

appBoot

This is where routes, reducers, and other functions registered by core and thirdparty code are aggregated. It's responsible for bootstrapping the main client application before any React code is executed.

Hooking into appBoot

In order to include routes and reducers in the bootstrapping process, you need to register them before appBoot is called, when the window.onload event is fired.

We can use the DOMContentLoaded event as an opportunity to do this, as it's fired after the initial HTML document is loaded and parsed, and before the window.onload event.

document.addEventListener('DOMContentLoaded', () => {
  // Register things.
});

Registering routes

The RouteRegister can be used to register routes which will be applied to Page.js when appBoot is called.

controller.js

import routeRegister from 'lib/RouteRegister';

document.addEventListener('DOMContentLoaded', () => {
  routeRegister.add('/some/route', (ctx, next) => {
    // Do stuff.
  });
});

Registering reducers

The ReducerRegister can be used to register reducers with the main application Redux store. This store is passed into every route callback on the ctx.store property.

controller.js

import reducerRegister from 'lib/ReducerRegister';
import routeRegister from 'lib/RouteRegister';
import ProductReducer from '../state/product/ProductReducer';

document.addEventListener('DOMContentLoaded', () => {
  reducerRegister.add('product', ProductReducer);

  routeRegister.add('/products', (ctx, next) => {
    ctx.store.getState().product // -> { products: [] }
  });
});