{"id":27127294,"url":"https://github.com/u4aew/module-federation-playground","last_synced_at":"2025-07-30T12:05:52.175Z","repository":{"id":85194509,"uuid":"570771670","full_name":"u4aew/module-federation-playground","owner":"u4aew","description":"Module federation","archived":false,"fork":false,"pushed_at":"2024-08-06T19:32:17.000Z","size":4452,"stargazers_count":6,"open_issues_count":0,"forks_count":2,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-07-25T03:38:33.782Z","etag":null,"topics":["antd","event-bus","microfrontend","module-federation","react","yarn-workspaces"],"latest_commit_sha":null,"homepage":"https://microfrontend.fancyapp.site/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/u4aew.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2022-11-26T04:23:05.000Z","updated_at":"2025-05-15T13:03:21.000Z","dependencies_parsed_at":"2023-12-14T21:28:16.765Z","dependency_job_id":"77498c45-37ba-4ee0-8955-5c8bedc9eb49","html_url":"https://github.com/u4aew/module-federation-playground","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/u4aew/module-federation-playground","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/u4aew%2Fmodule-federation-playground","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/u4aew%2Fmodule-federation-playground/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/u4aew%2Fmodule-federation-playground/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/u4aew%2Fmodule-federation-playground/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/u4aew","download_url":"https://codeload.github.com/u4aew/module-federation-playground/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/u4aew%2Fmodule-federation-playground/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":267865864,"owners_count":24157343,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-30T02:00:09.044Z","response_time":70,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["antd","event-bus","microfrontend","module-federation","react","yarn-workspaces"],"created_at":"2025-04-07T16:55:19.906Z","updated_at":"2025-07-30T12:05:52.148Z","avatar_url":"https://github.com/u4aew.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Banking Application with Module Federation\n\nThis banking application is a showcase of Module Federation, a cutting-edge feature from Webpack 5, which allows for a scalable, flexible microfrontend architecture. Designed specifically for the finance sector, this application is divided into several independent modules, each with its unique functionality and managed state.\nMore details in this [article](https://dev.to/u4aew/creating-a-web-application-using-micro-frontends-and-module-federation-11kk).\n\n## Application Sections:\n\n**Host App**: The central hub integrating all modules.\n![Host app](img/1.png)\n***Card App***: Focuses on user card functionalities.\n![Host app](img/2.png)\n**Transactions App**: Manages user transactions and related data.\n![Host app](img/3.png)\n\nThe application's microfrontend approach, combined with state-of-the-art technologies and a focus on modular design, makes it an exemplary project in the realm of modern web development, particularly for complex financial applications.\n\n## Key Features:\n\n1. **Module Federation Implementation**: Utilizes Webpack 5's Module Federation to create a cohesive yet modular application.\n\n2. **Independent Modules**: The application is split into 'Cards' and 'Transactions' modules. Each module operates independently, facilitating separate development, maintenance, and deployment processes.\n\n3. **Redux for State Management**: Each module comes with its own Redux instance, ensuring isolated and effective management of the application state.\n\n4. **Event Bus for Inter-Module Communication**: Implements an event bus for seamless data exchange and interaction between different modules, enhancing overall application performance and user experience.\n\n## integration:\n![Host app](img/4.png)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fu4aew%2Fmodule-federation-playground","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fu4aew%2Fmodule-federation-playground","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fu4aew%2Fmodule-federation-playground/lists"}