{"id":26398,"date":"2021-10-06T08:39:10","date_gmt":"2021-10-06T08:39:10","guid":{"rendered":"https:\/\/codeandpepper.com\/?post_type=case_study&p=26398"},"modified":"2025-05-08T11:51:58","modified_gmt":"2025-05-08T11:51:58","slug":"fintech-app-development-jordan","status":"publish","type":"case_study","link":"https:\/\/codeandpepper.com\/case-studies\/fintech-app-development-jordan\/","title":{"rendered":"Dinarak"},"content":{"rendered":"\n
\"Digital<\/figure><\/div>\n\n\n\n
\n
FinTech Development<\/div>\n
Google Cloud Platform<\/div>\n
React Native<\/div>\n
TypeScript<\/div>\n <\/div>\n<\/section>\n\n\n\n

Managing your finances in a post-digital revolution world seems simple, but what if you don\u2019t have a bank account? It may come as a surprise to some, but there are still millions of unbanked smartphone users who need a simple and reliable way to pay their bills, transfer money or track their finances. In Jordan, one company, Dinarak<\/a>, decided to cater to their needs and Code & Pepper was assigned a series of tasks to help them provide a perfect solution for the unbanked part of the society.<\/strong><\/p>\n\n\n\n

About Dinarak<\/h2>\n\n\n\n

Dinarak is a licensed payment services provider under the Central Bank of Jordan’s innovative ‘JoMoPay’ system.<\/strong> The company aims to offer the least expensive solution in the market, with the simplest systems and with the most extensive network of physical agents nationwide.<\/p>\n\n\n\n

Dinarak\u2019s app<\/strong> is an all-in-one solution: a digital wallet, instant payments system and funds disbursement tracker. Thanks to such versatility, it empowers the unbanked part of Jordan\u2019s society to use their money any way they want.<\/p>\n\n\n\n

\"Inphographic<\/figure><\/div>\n\n\n\n

What is extremely important, thanks to keeping the fees on a minimal level, a Dinarak account is suitable for all types of transactions, even those of less than one Dinar. It makes it more practical than credit cards or traditional bank accounts. Besides that, the app is suitable for even the least technologically advanced devices.<\/p>\n\n\n\n

Goals<\/h2>\n\n\n\n

The client already had a working application when we started working together, but it needed to be revamped to meet modern standards of design and usability. In order to achieve it all, we were asked to redesign its interface for maximum user-friendliness and to rewrite the frontend using React Native.<\/p>\n\n\n\n

\"Redesign<\/figure><\/div>\n\n\n\n

Why React Native<\/h2>\n\n\n\n

Introduced in 2013 by Facebook, React.js was designed for engaging and high performance web applications with minimal coding.<\/p>\n\n\n\n

The defining characteristic of React development is the focus on individual UI components that can be reused, rearranged and connected with ease. In fact, it was created for the purpose of writing apps for different platforms at the same time and without the need of a costly process of porting them for different operating systems. React Native code can be compiled to native iOS and Android languages and changes are instantly visible on both platforms. It also makes both versions totally consistent, both functionally and visually. This feature was especially a huge advantage in the case of the Dinarak app which needs to be flexible enough to run on both new and legacy devices.<\/p>\n\n\n\n

React also provides high-quality supporting libraries, such as Redux or React Router, and tools for building cross-platform apps, all maintained and used by a huge community of developers. Not only does it make implementing basic functionalities a breeze, but it also gives access to an infinite knowledge base, so solving all problems is fast and easy.<\/p>\n\n\n\n

The last reason for choosing React Native was the ease of maintaining the app. Since this technology uses JavaScript with which every frontend developer is familiar with, the developers can stick to just one technology stack and keep optimising code based on their previous experiences.<\/p>\n\n\n\n

\"Dinarak<\/figure><\/div>\n\n\n\n

Challenges<\/h2>\n\n\n\n

Creating a new frontend for the application in a different technology than it used to use, required a lot of communication, especially considering the fact that the backend of the system was being redeveloped, too. However, that part of the process was conducted by the client\u2019s in-house team in cooperation with a middleware specialised partner, which further made the synchronization of works challenging. Some reverse engineering was needed due to the two-layer legacy nature of the existing backend, but our Project Manager Szymon Mizio\u0142ek<\/a> did well coordinating the course of action with Dinarak\u2019s technical lead, so the overall results were more than satisfying.<\/p>\n\n\n\n

A fresh design with usability in mind<\/h2>\n\n\n\n

The client\u2019s requirements were clear – to make the app user-friendly, compatible with a wide range of devices, feature packed and stylish, with an emphasis on the brand\u2019s image. UX designer Maciej Zaj\u0105c created a new vision of the application with all of these features in mind.<\/p>\n\n\n\n

\"UX<\/figure><\/div>\n\n\n\n

Quality, we are proud of<\/h2>\n\n\n\n

Our developers are certain about one thing – the highest quality of their code. We have achieved an outstanding 90% of the test coverage metric in the case of Dinarak app and made sure that the code is as clear and coherent as possible. By staying true to the \u201cclean code\u201d rule, we created an app that will be easy and cost-effective to maintain in the future, no matter the personal changes in the team.

<\/p>\n\n\n

\n
\n\n\n\n

\n <\/h2>\n\n\n\n
\n
\n \n
\n \r\n\r\n\t\r\n\t\t\r\n\t\t\r\n\t<\/g>\r\n\t\r\n\t\t\r\n\r\n\t\t\t\r\n\r\n\t\t\t\r\n\r\n\t\t\t\r\n\t\t\r\n\t<\/g>\r\n<\/g>\r\n<\/svg>\r\n <\/div>\n
\n

\n Mobile App Development <\/p>\n <\/div>\n <\/a>\n <\/div>\n

\n \n
\n \n<\/svg> <\/div>\n
\n

\n React Native <\/p>\n <\/div>\n <\/a>\n <\/div>\n

\n \n
\n \r\n\r\n\t\r\n\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t<\/g>\r\n\t<\/g>\r\n<\/g>\r\n<\/svg>\r\n <\/div>\n
\n

\n Quality Assurance <\/p>\n <\/div>\n <\/a>\n <\/div>\n

\n \n
\n \r\n\r\n\t\r\n\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t<\/g>\r\n\t<\/g>\r\n<\/g>\r\n\r\n\t\r\n\t\r\n<\/g>\r\n<\/svg>\r\n <\/div>\n
\n

\n Product design <\/p>\n <\/div>\n <\/a>\n <\/div>\n <\/div>\n\n<\/div>\n<\/section>\n