Mifos is a nonprofit organization that uses AngularJS to build a single page application (SPA) for providing banking services to the poor. They chose AngularJS because it cleanly separates views from controllers, supports two-way data binding, directives for extending HTML, and dependency injection. Their SPA built with AngularJS has allowed for faster development cycles and greater contributions from designers. They plan to use Ionic and Cordova to build a tablet app and improve testing with Protractor and offline functionality with Angular 2.

1. Mifos
Bringing Banking to the Poor with
the help of Angular JS

2. Agenda
 Introduction to Financial Inclusion and Mifos
 Our need for a SPA Framework
 Why Angular?
 Demo
 What’s next?
 How you can get Involved
 Q&A
Inputs by Michael Vorburger, Edward Cable, Markus Geiss and Gaurav Saini (thanks!)

3. The need for Financial Inclusion
As of 2010, 2.4 billion people (~30% of world population) live on < $2/day
2.5 Billion People (> half the world’s adult population) do not have access to regular
Financial Services
- Sourced from http://www.worldbank.org/
The Microfinance Movement : A world in which as many poor and near-poor
households as possible have permanent access to an appropriate range of high quality
financial services, including not just credit but also savings, insurance, and fund
transfers.

4. AMicroFinanceoperation in ruralIndia
This image was taken during a Centre meeting conducted by Grameen Koota, one of the larger Mifos users serving more than half a million customers. A
MFI employee would be responsible for disbursing loans and collecting repayments during these meetings

5. LoanDisbursementsat a Centre Meeting
Many Organizations in Southern Asia follow the “Solidarity Groups” model pioneered by Mohammad Yunus (awarded with the
Nobel Peace Prize 2006) – Picture Credits @Michael Vorburger

6. MifosBeing usedin Branchoffices
Mifos serves as the Core Banking system for Organizations in the financial inclusion space - – Picture Credits @Michael
Vorburger

7. The Mifos Story
Used by more than 70 MFI’s serving more than 2.5 million customers
Managed by the Mifos Initiative (a non-profit registered in Washington)
Built with love by hundreds of volunteers spread across the world fighting poverty one line of
code at a time
2004-11: Registered on Sourceforge
2006-11: Initial Mifos Product Launch
2009: Winner of JavaOne 2009 Duke’s choice award for Best Java Technology for the Open
Source Community
2013: Launch of the new “MifosX” suite

8. OurCommunity
Picture taken during our 2013 Mifos Summit held at Jaipur India. Our next summit is scheduled to be during October in
Kampala, Uganda.

9. TheOriginal MifosProduct
Web based MIS for MFI’s built with Java (Spring MVC, Spring, Hibernate), MySQL and the Pentaho BI suite

10. Mifos X: The next generation of Mifos
Redesigned to fulfil our long-term vision of a fully extensible platform that can scale through
multi-tenancy and rapidly be extended upon through a clean layered architecture and full
API.
Platform: Encapsulates the complexity that exists in the business and technical domains
needed for a Banking System behind a relatively simple API. This API frees up application
developers to innovate and produce apps suitable for a variety of Financial inclusion services.
Built on a Jersey/Spring/JPA/MySQL stack
Applications: A suite of applications (mostly User Interfaces with no business Logic) built on
top of "The Platform" that cater to a variety of financial Inclusion models

12. AnAppbuiltby MusoniSystems
The Musoni system (built on top of the MifosX Platform) is optimized for Cashless operations and integrated with leading
Mobile Money vendors in the African market

13. AndroidClient fortheMifosXPlatform

14. Our First Community App
Some of our goals while starting building out our first Community App towards the
end of 2011
•Cheap to Modify and extend
•No Server Side language, no business logic within the app
•Leverage on most common skills within our Community
•Package (using Cordova) as a hybrid mobile app

15. Ourfirst“Community App”
Built with JQuery and JQuery Templates

16. The need for a SPA Framework
As the community app matured, it became increasingly clear that the codebase would
be difficult to maintain in the long run
DOM manipulation impeded parallel development by UI designers and JS developers
Large amount of Boiler plate code for common SPA tasks like two way data Binding,
routing and tracking Browser history
Decision made to rewrite our SPA using a “Mature” framework which would address
these issues out of the box

17. Why Angular?
 Clean separation between the View and the Controller (Parallel development,
Mobile Views)
 Two way data Binding
 Extending HTML vocabulary with “Directives”
 “Server side” concepts like Dependency Injection, Modularization made sense to our
(predominantly java) Community
 Testability (both unit testing and E2E testing)
 Basic Routing available out of the box. https://github.com/angular-ui/ui-router
provides advanced routing
• Could provide I18 support with help from libraries likehttp://angular-
translate.github.io/ and http://lgalfaso.github.io/angular-dynamic-locale/

18. Why Angular continued…
Other factors that were taken into account
More awareness within our community when compared to competing frameworks
Decent documentation (now Excellent)
IDE support (Webstorm) and Chrome plugins like Batarang

19. Our Stack
Bower: Package Management
Grunt: Task runner
Require JS: JS Module Loader
Angular JS
Bootstrap: HTML and CSS Design Templates
D3: Data Visualization
Jasmine: Unit Testing Framework
Karma: Test runner

20. CommunityAppDemo
Hosted on https://demo.openmf.org/ (login as mifos/password)

21. Benefits to our Community
 Faster development cycles: Volunteer driven re-write of the Community app with
AngularJS took < 3 months
 Greatly increased contributions from Designers / HTML & CSS developers
 Simplified collaboration process, increased volunteer satisfaction
 Implementation partners have found it easier to extend/modify

22. Next Steps
Use Ionic (and Cordova) for a tablet optimized version of our Community app
E2E testing using Protractor
Offline Functionality (would be made easier with the planned enhancements in
Angular 2)
* Details of upcoming changes in Angular 2 can be found at
http://blog.angularjs.org/2014/03/angular-20.html

23. Interested? Get Involved
Volunteer Opportunities: http://mifos.org/take-action/volunteer
Learn more about Contributing to Mifos : http://tinyurl.com/ltmzgbl
Github Repo: https://github.com/openMF
Subscribe to our Mailing Lists:
•Developer List: https://lists.sourceforge.net/lists/listinfo/mifos-developer
•User List: https://lists.sourceforge.net/lists/listinfo/mifos-users

24. Question & Answers