Mifos X Web App is the revamped version of the Mifos X Community App, an effective financial solution for Mifos User community. It provides all the core functionality for the most common methods of financial inclusion and products and services along with the self-service user administrative portal strives to deliver better support to the self-service users of the online banking and mobile banking app from the financial institutions by providing them with a mechanism to properly manage and give necessary assistance to users for carrying out their operations. The development of Web App began in 2018 where the whole project is written in Angular.The development of the project will help in user experience along with the better maintainability.
Project Mentor:
- [JoseAlberto]
- [Bharath Gowda]
- [Ramveer]
- Implement a third party library for proper internationalization.
- Redesigning customer and account dashboard pages
- Refactor web app to consume typescript client
- Enhance the look and feel of the app.
While the earlier version employs the English language(default language) and internationalization is a procedure used in software applications so that they can be converted to multiple languages. Angular offers libraries for its implementation (ngx-translate,i18n). While Angular has some built-in i18n functionality, ngx-translate is a third-party package that offers functionality for language support.
Here, I have used @ngx-translate/core library for implementation.
While working on this, implementing translation and extracting data from json for the larger codebase was one of the difficult thing as codebase has accross 30 modules and each module has diffrent submodules, so first task was to create simplified json file with all the data and then to convert same data in other languages.
PR's for modules
- [PR-1829] - English Json File
- [PR-1828] - Shared Translate Module
- [PR-1825] - Account Transfer Translate Module
- [PR-1818] - Search Translate Module
- [PR-1814] - Profile Translate Module
This are some of the PR's as their are many more Prs on each and every module.
Implementing internationalization is essential for creating applications that are user-friendly, accessible and capable of reaching a diverse global audience. Angular's built-in i18n features and tools make the process manageable and effective.
Implementing micro-frontend architecture to Mifos Web X mostly focused on breaking down large and complex frontend applications into smaller, manageable, and loosely coupled parts. Each of these parts, called microfrontends, is developed and deployed independently. This architectural approach offers several benefits that address challenges faced when building and maintaining large-scale frontend applications.
As, Mifos Web X has larger codebase and many modules which are also used in mifos other application for modularity, maintaining the same modules independantly and using it this architecture will be given an edge.
Currently, for the project the microfrontend setup is implemented along with independent components for some of the modules. Here, Module Federation architectural pattern is used for implementation.
Project structure and setup link : [Project - link]
Currently, the implementation is in progress.
The Mifos Initiative's experience with Google Summer of Code has been both great and hard. I had a great time expanding my knowledge and working collaboratively with other community members to create and complete an amazing project. Ed Cable, Alberto, Bharat, and Ramveer in particular deserve my gratitude for always being willing to lend a hand and offer advice.
Thank You
Regards
Radha Thakare