Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
The Container in the Component based MicroFrontend approach
<!DOCTYPE html>
<html lang="zxx">
<head>
<title>PetStore - because Pets love pampering</title>
<meta charset="UTF-8
<link rel="stylesheet" href="css/style.css"/>
</head>
<body>
<!-- Header section -->
<header class="header-section">
....
</header>
<!-- Header section end -->
<main id='microfrontend'>
<!-- This is where the Micro-frontend gets rendered by utility renderMicroFrontend.js-->
</main>
<!-- Header section -->
<footer class="header-section">
....
</footer>
<!-- Footer section end -->
<script src="frontends/MicroFrontend.js"></script>
<script src="frontends/Home.js"></script>
<script src="frontends/Cart.js"></script>
<script src="frontends/Checkout.js"></script>
<script src="frontends/Product.js"></script>
<script src="frontends/Contact.js"></script>
<script src="routes.js"></script>
<script src="renderMicroFrontend.js"></script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment