KhanShaheb34 / react-microfrontends

Converted two create-react-app projects to one single-spa with some extra functionalities

Home Page:https://cutt.ly/3JJeB3L

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

React micro-frontends using single-spa

This is a demo application built using micro-frontend architecture with the help of single-spa. If you want to learn about micro-frontends, check these:

In this repository I merged (kinda) two react application into one, but can be further developed separately. And created an easy building process.

Full instruction (blog) of how I managed to do so is available here, React Micro-frontend and Single SPA from create-react-app or in this Instructions.md file.

Build and Run

Only one command is enough to build and run the application:

docker-compose up

Now visit http://localhost:9000 to see the app in production.

If you don't want to use docker then run the local-build.sh file, a build folder will be created in the root directory, then go to http://localhost:9000 to view the app.

Because of using live-server, client side routing might be glitchy in the second approach.

Development

I've made a single command to run all of the application at once. Just run run-all.sh command and the application will run in development mode on http://localhost:9000. Any changes in local files, will be effective immediately.

Standalone Development

If you want to develop any app separately, run npm run start:standalone inside the application folder, and the application will start separately in standalone mode.

About

Converted two create-react-app projects to one single-spa with some extra functionalities

https://cutt.ly/3JJeB3L


Languages

Language:TypeScript 56.7%Language:EJS 15.7%Language:JavaScript 9.9%Language:HTML 8.5%Language:CSS 4.8%Language:Shell 4.4%