Anatomy

The structure of a Lore application

index.js

This is the root JavaScript file of the application, and is responsible for building and mounting the application to the DOM.

It also attaches the Lore singleton to the window, so you can access it from the command line in case you need to play with it, such as:

  • Manually executing actions (lore.actions.tweet.create(...))
  • Checking the reducer state (lore.store.getState().tweet.byId['1'])
  • Inspecting the config (lore.config.connections.default.apiRoot)
  • Etc.

Defaults

The default file included in new projects looks like this:

import lore from 'lore';
import _ from 'lodash';

// Allows you to access your lore app globally as well as from within
// the console. Remove this line if you don't want to be able to do that.
window.lore = lore;

// Hooks
import auth from 'lore-hook-auth';
import actions from 'lore-hook-actions';
import bindActions from 'lore-hook-bind-actions';
import collections from 'lore-hook-collections';
import connections from 'lore-hook-connections';
import connect from 'lore-hook-connect';
import models from 'lore-hook-models';
import react from 'lore-hook-react';
import reducers from 'lore-hook-reducers';
import redux from 'lore-hook-redux';
import router from 'lore-hook-router';

// Summon the app!
lore.summon({
  hooks: {
    auth,
    actions,
    bindActions,
    collections,
    connections,
    connect,
    models,
    react,
    reducers,
    redux: _.extend(redux, {
      dependencies: ['reducers', 'auth']
    }),
    router
  }
});