microzord
Attention: WIP
It is a pre-alpha version of the library. Please, do not use it until official release.
What is it?
It is a small tool that allows you to add and render multiple apps on one page. It has simple ideomatic APIs for all modern frameworks and builds bridges between them.
🧙 Framework agnostic. You can have an Angular application with a React app header and a Vue app footer. Each app can have endless amount of nested apps inside. There are also wrappers for every modern framework with simple API.
🧩 Modular. You can insert another app in your app in any place as an ordinary component. Use the same methods to bind data and to handle its events.
🐝 Tiny as a bee and works as well. No new code in the bundle of child application and a bit more than 1 KB library for host application to get all the benefits!
Installation and usage
An extensive demo is coming soon...
An example of usage external apps in Angular app
app.module.ts
@NgModule({
imports: [
MicrozordHostModule.register({
apps: [
{
name: 'react-menu',
assetMap: '/react-menu/microzord.json',
},
{
name: 'vue-footer-app',
assetMap: '/vue-footer-app/microzord.json',
},
],
}),
],
})
export class AppModule {}
Usage in application:
<header microzord="react-menu"></header>
<div>Any content</div>
<footer microzord="vue-footer-app" (hook)="onFooterLifecycleEvent($event)"></footer>
Core team
License
🆓 Feel free to use our library in your commercial and private applications
All microzord packages are covered by Apache 2.0
Read more about this license here