Microfrontend React Application

This repository demonstrates a microfrontend architecture using React, enabling the development of scalable and maintainable web applications by decomposing a monolithic frontend into smaller, independent modules.

Features

• Modular Architecture: Each module functions independently, facilitating parallel development and deployment.
• React Integration: Utilizes React's component-based structure to implement microfrontends.
• Webpack Module Federation: Employs Webpack 5's Module Federation plugin to manage module sharing and dynamic loading.

Getting Started

Prerequisites

• Node.js (version 14 or higher)
• npm or yarn package manager

Installation

1. Clone the repository:

   git clone https://github.com/Dickyrdiar/microfrontend-react.git
   cd microfrontend-react

2. Install dependencies:

   Using npm:

   npm install

   Or using yarn:

   yarn install

Running the Application

1. Start the development server:

   Using npm:

   npm start

   Or using yarn:

   yarn start

2. Access the application:

   Open your browser and navigate to http://localhost:3000.

Project Structure

The repository is organized into multiple microfrontend applications, each residing in its own directory:

• home: Contains the main application shell.
• about: Includes the 'About' page microfrontend.

Each application is configured with its own webpack.config.js to handle module federation and dependencies.

Learn More

For a comprehensive understanding of microfrontend architecture with React, consider exploring the following resources:

• Build a micro-frontend application with React
• A Deep Dive into Micro Frontend Architecture with React.js
• Building Micro Frontends With React

License

This project is licensed under the MIT License. See the LICENSE file for details.

---

By following this documentation, you should be able to set up and run the microfrontend React application successfully.