@microfrontend-example/core

An event-driven orchestration layer

Usage no npm install needed!

<script type="module">
  import microfrontendExampleCore from 'https://cdn.skypack.dev/@microfrontend-example/core';
</script>

README

microfrontend-example

Entities

Registry

Manages an aggregation of Services.

Orchestrator

Determines whether or not the orchestration process should run.

Router

Handles navigation and routing.

Service

Represents each service in the system. Handles loading, mounting, and unmounting of services.

Statuses

Status
REGISTERED
LOADED
LOAD_ERROR
BOOTSTRAPPED
BOOTSTRAP_ERROR
MOUNTED
MOUNT_ERROR
RUNNING
STOPPED
UNMOUNTED
UNMOUNT_ERROR
SKIPPED

Events

Event
<service>:CHANGE_STATUS
<service>:REGISTER
<service>:LOAD
<service>:MOUNT
<service>:STOP
<service>:UNMOUNT
<service>:UNLOAD
<service>:BEFORE_CHANGE
<service>:NO_APP_CHANGE
<service>:ROUTING_EVENT

Process

Fire Event => Update Status => Call Hooks

start() => reroute()

Registration

The shell calls registerApplication() and passes in a name, a load hook, a route activation function, and an optional set of custom props for each service.

registerApplication() fires an APP_REGISTER event. Since the s

Orchestration

Structure

Apps

Domain-focused solutions for performing complex integrated business logic.

  • admin: A portal for managing users, groups, and roles
  • billing: A portal for managing users, groups, and roles
  • portal: The primary 'hub' for accessing apps

Packages

Cross-domain integrations and shared functionality go here.

  • core: An advanced event-driven orchestration layer
  • scripts: A powerful shared build pipeline for centralized automation and other cool shib

Services

Smaller services with more fragmented logic and little-to-no UI should go here.

  • auth: A portal for managing users, groups, and roles
  • data: A GraphQL Apollo server for data aggregation logic

Shell/Frame

The shell is the orchestration layer served as index.html responsible for registering, loading, mounting, unmounting, and unloading services.