Oh so you are finally here

Stackr exposes a Micro-Rollup Api that takes in all the things we built previously and wrap it around an application

This is how it looks like

const counterFsm = new StateMachine({
  state: new CounterRollup(genesisState.state),
  stf: counterSTF,
});

const actionSchemaType = { type: "String" };
const actionInput = new ActionSchema("update-counter", actionSchemaType);
const buildStrategy = new FIFOStrategy();

const { actions, ...otherUtilities } = await MicroRollup({
  // the config
  config: stackrConfig,

  // the state machine that has an STF attached
  useState: counterFsm,

  // The user/entity input to the micro-rollup
  useAction: actionInput,

  // the sequencer that will order actions
  useBuilder: { strategy: buildStrategy, autorun: true },

  // Syncer will send the actions to the Vulcan
  useSyncer: { autorun: true },
});

yeah that’s it! 🎉

Sending Actions to the Micro-Rollup

Now that we have a Micro-Rollup setup, we can send actions to it

Consider this as kinda “frontend”

Step 1 : preparing data

// any user's/entities wallet
const wallet = ethers.Wallet.createRandom();

// the action that we want to send
const data = {
  type: "increment",
};

// sign the action
const signature = await wallet.signTypedData(
  stackrConfig.domain,
  // we use the same actionInput schema to get EIP-712 types
  actionInput.EIP712TypedData.types,
  data
);

// create a payload
const payload = JSON.stringify({
  msgSender: wallet.address,
  signature: sign,
  payload: data,
});

The payload is a JSON string that contains the following, and MUST conform to the following schema

{
  msgSender: string, // the user/entity's address
  signature: string, // the signature of the action
  payload: any, // the action data
}

Step 2 : sending the payload

We use the actions object that we got from the Micro-Rollup and get the schema from it. Use the same identifier that was used to create the actionInput

const schema = actions.getSchema("update-counter");
const newAction = schema.newAction(payload);

const ack = await actions.submit(newAction);

After submitting the action the Micro-rollup sends an acknowledgement receipt back

Usage with web-server

You can also create an express app to interact with the rollup with users sending actions to it

const app = express();
app.use(bodyParser.json());
const { actions, state } = await rollup();

app.get("/", (req: Request, res: Response) => {
  res.send({ currentGame: state.get().state.getState() });
});

app.post("/", async (req: Request, res: Response) => {
  const schema = actions.getSchema("update-counter");

  if (!schema) {
    res.status(400).send({ message: "error" });
    return;
  }

  try {
    const newAction = schema.newAction(req.body);
    const ack = await actions.submit(newAction);
    res.status(201).send({ ack });
  } catch (e) {
    console.log(e);
  }
});

app.listen(3000, () => {
  console.log("listening on port 3000");
});

Modes

You can send action to the Micro-rollup either directly or via an HTTP call or some other way

Ordering and Block Building

The Micro-Rollup will order the actions and build blocks based on the strategy that was passed to it and the config which governs the block size and other parameters

Utilities

Micro-rollup object exposes a bunch of utilities that can be used to interact with the Micro-Rollup.

  1. actions
  2. builder
  3. state
  4. chain
  5. syncer
  6. events

More about themin the next section