An open API service indexing awesome lists of open source software.

https://github.com/pj-mill/micro-frontends

Several apps demonstrating MicroFrontEnds with ReactJS, VueJS and Webpack Module Federation
https://github.com/pj-mill/micro-frontends

aws-s3 cloudfront github-actions module-federation react vue webpack

Last synced: 3 months ago
JSON representation

Several apps demonstrating MicroFrontEnds with ReactJS, VueJS and Webpack Module Federation

Awesome Lists containing this project

README

          

# MicroFrontends

## Basics

This folder contains 3 apps (products, cart & container) that demonstrates the basics of micro frontends.
To Run with `node 16` or under...

1. cd into basics/cart folder and run using `cd basics/cart` and `npm run start`
2. cd into basics/products folder and run using `cd basics/products` and `npm run start`
3. cd into basics/container folder and run using `cd basics/container` and `npm run start`

The above apps demonstrate...

1. Basics of Microfrontends
2. Shared Modules
3. Async Script Loading
4. Shared Module Versioning (faker)
5. Singleton Loading
6. Consuming Remote Modules

## Complex

This folder contains 4 apps (marketing, auth, dashboard & container) that demonstrates a complex micro frontend.
To Run with `node 18` or above...

1. cd into complex/marketing folder and run using `cd complex/marketing` and `npm run start`
2. cd into complex/auth folder and run using `cd complex/auth` and `npm run start`
3. cd into complex/dashboard folder and run using `cd complex/dashboard` and `npm run start`
4. cd into complex/container folder and run using `cd complex/container` and `npm run start`

The above apps demonstrate...

1. Advanced Webpack configuration with development & production environments.
2. Routing
3. Shared Modules (package.json)
4. Implementing CI/CD pipeline with Github Actions
5. All apps deployed to AWS S3 and serverd from Amazon Cloudfront
6. Implementing CSS across multiple sub projects
7. Multi-tier navigation through memory history & browser history