https://github.com/hoojinguyen/single-spa-example
An example of web app built with micro-frontend using single-spa framework
https://github.com/hoojinguyen/single-spa-example
micro-frontend reactjs spa vuejs
Last synced: 2 months ago
JSON representation
An example of web app built with micro-frontend using single-spa framework
- Host: GitHub
- URL: https://github.com/hoojinguyen/single-spa-example
- Owner: hoojinguyen
- Created: 2022-10-08T04:28:51.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2022-10-08T06:05:08.000Z (over 2 years ago)
- Last Synced: 2025-01-16T21:36:17.745Z (4 months ago)
- Topics: micro-frontend, reactjs, spa, vuejs
- Language: EJS
- Homepage:
- Size: 244 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# single-spa-example
This is an example of web app built with micro-frontend using [single-spa](https://single-spa.js.org/docs/getting-started-overview) framework
## Installation
1. Clone the repo
```
git clone [email protected]:hoojinguyen/single-spa-example.git
```
2. Move into project
```
cd single-spa-example
```
3. Install dependencies for each repo
```
cd single-spa-root && yarn
cd single-spa-header && yarn
cd single-spa-body && yarn
cd single-spa-footer && yarn
```
4. Go to each repo and get started
```
cd single-spa-root && yarn start --port 9000
cd single-spa-header && yarn start --port 8500
cd single-spa-body && yarn serve --port 8600
cd single-spa-footer && yarn start --port 8700
```
5. Navigate to http://localhost:9000/ in your browser
6. And now you will see header, body, footer repos will be hosted on root
## Current applications
1. single-spa-header (written in react)
2. single-spa-body (written in vue)
3. single-spa-footer (written in react)