This is a starter project for building a React application with microfrontends. It is designed as a monorepo and includes four microfrontends: Shell, Header, Footer, and State. The project is pre-configured with basic dependencies such as Material-UI (@mui), Keycloak Provider, Recoil, React Router DOM, and many others to help you get started quickly.
Follow these steps to get started with this project:
-
Clone the repository to your local machine:
git clone https://github.com/AldoNoschese96/react-mf.git cd react-mf yarn install npx lerna run start:development
This will start the development server for all microfrontends. You can access the apps at http://localhost:3000 || http://localhost:3001 || http://localhost:3002 || http://localhost:3003.
The project follows a monorepo structure and consists of the following directories:
- [packages/shell]: The main application Shell microfrontend.
- [packages/header]: The Header microfrontend.
- [packages/footer]: The Footer microfrontend.
- [packages/state]: The State microfrontend.
The Shell microfrontend is the main application that orchestrates and loads the other microfrontends. It provides routing and integration of the Header, Footer, and State microfrontends.
The Header microfrontend is responsible for rendering the application's header.
The Footer microfrontend is responsible for rendering the application's footer.
The State microfrontend manages global application state using Recoil or another state management library of your choice.
The project includes some basic dependencies to help you get started:
- React: A JavaScript library for building user interfaces.
- React Router DOM: Routing for React applications.
- Material-UI: A popular React UI framework.
- Keycloak Provider: Integration with Keycloak for authentication.
- Recoil: State management library.
- ... and many more
License
This project is licensed under the MIT License. See the LICENSE file for details.