Skip to content

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

Notifications You must be signed in to change notification settings

KhanShaheb34/react-microfrontends

Repository files navigation

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.