https://github.com/uppercod/microfrontend

https://github.com/uppercod/microfrontend

Last synced: about 1 year ago
JSON representation

• Host: GitHub
• URL: https://github.com/uppercod/microfrontend
• Owner: UpperCod
• Created: 2019-12-10T05:48:42.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2020-09-12T12:50:42.000Z (almost 6 years ago)
• Last Synced: 2025-04-10T03:58:32.248Z (about 1 year ago)
• Language: JavaScript
• Homepage: https://uppercod.github.io/microfrontend/dist/
• Size: 953 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 11
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# @atomico/microfrontend

## Orchestrator example

```jsx

import { h, customElement } from "atomico";

import { Container, Sandbox, preact, vue } from "@atomico/microfrontend";

// Create a container to use preact

let App1 = Container(() => import("./team-1/app"), preact);

// Create a sandbox to use vue

let App2 = Sandbox(() => import("./team-2/app"), vue);

function MyApp() {

  function handler(message) {

    console.log(message); // from preact . . . from vue

  }

  return (

    

      microfrontend apps!

      

      

    

  );

}

```

## sandbox rules

The sandbox is a separate document that assimilates the execution of all the code associated with the sandbox, this allows to keep styles and js global without conflict, but does not allow a manipulation on `window.location`, to achieve this you must pass`location` as A prop for the sandbox.