a high security web application for keeping an eye on your finances


Design, Front-end (react.js), System design and architecture, Testing, Project Management


Nele Erikson (from NOPEdesign
Sander Orav front end
Mihkel Eidast front-end
Pärt Erikson back-end
Ivo Klaas back-end
Ardo Aednik PM

project background

MyFinancier was founded in November 2017 and grew out of a team who loves to keep track of their finances. Keeping track of their monthly spendings and earnings was previously done with Excel and they had even programmed themselves a desktop version of MyFinancier for personal use. Because the application had gotten old, they decided it was time to take it all to another level.
MyFinancier is a web application that lets the user do their own accounting in the simplest way possible. The user uploads their monthly earnings and spendings report in the form of a CSV and the application will do the rest – it shows where money was spent and earned, all in the form of tables and easily understandable graphs.

challenge & the insight

This project was very unique. When it comes to other people’s finances, privacy and the knowledge that your data is safe, is of key importance. This is why we needed to find the safest possible way to store user data without the risk of getting hacked. We had never done anything with such a high level of cryptography, which definitely made this project an experience worth remembering.

In order to avoid any information leaks into the database, all the encryption gets done on the front-end side of the browser, by the user’s computer. The technique we use is called Salted Challenge Response Authentication Mechanism or SCRAM for short.

the journey to Beta

It all started in January 2018.

First we created a front-end view with React and began looking into our options regarding cryptography. In the end, together with MyFinancier’s development team, we went with a solution which required us to ask for help from an advisor in the field of cryptography. That’s the level of safety we wanted to achieve.

In order to avoid any information leaks into the database, all the encryption gets done on the front-end side of the browser, by the user’s computer. The technique we use is called Salted Challenge Response Authentication Mechanism or SCRAM for short. SCRAM is a password-based mutual authentication protocol designed to make an eavesdropping attack (i.e. man-in-the-middle) more difficult. It is a way where the client can prove to the server that they know a secret that is derived from the user’s password and the server can prove to the client that it knows the password without sending the password from the database itself.

We used AES-GCM to ensure that the encryption on all the user’s data would be rock-solid and the chances of a hacker breaking in would be essentially zero.

All of the user’s data is put into a protected container and then lastly sent to the database. Basically what the database sees is an encrypted safe and nothing more. When the user later wants to access their data, the database doesn’t know the user’s password but it knows how to make sure that the given password is correct.

The AES keys are 128-bit symmetric keys and it has been calculated that for a supercomputer which uses brute force attacks it would take around 1 billion years to crack the key. That’s the level of security we achieved together with MyFinancier for their web application.

We finished the project in November 2018.

Users are able to track all of their finances by adding their bank accounts to the system. All of the households accounts may be added to form a family to get an even better overview.
MyFinancier uses the power of data automation and smart algorithms to divide the transactions into categories, but still leaving the option for the users to edit any inaccuracies. Soon it’s possible to automate the import process by connecting the system with different banks.
Income & Expenses
By importing your transaction history the system assigns automatic categories to each transaction in the statement, creating a visual representation of all incomes and expenses. All main categories are divided into subcategories so the user can have even further understanding.
By enabling adding and removing transaction entries from the statement history with logic rules, we guarantee more accurate overview. System takes these edits into account and becomes smarter when assigning categories in the future.
Users can also list their other assets into the system to see how well they are doing.
Perhaps one has a mortage on their house or a loan for that new computer. List them up here! And you can have a good overview when the payments end, how much to go etc.

more for the future

After we were done on our side, MyFinancier’s development team took over the project and released the Beta version of the application in August 2019. By the summer of 2020 MyFinancier had grown their user database to 850 accounts who use the program on a regular basis.

Seamless collaboration

MyFinancier came to gotoAndPlay with a peculiar and ambitious goal. Instead of telling us that “that’s not how it’s done” and “other’s use different methods”, they helped us pursue our ideas and together we managed to create (and implement) a new standard on how data is being processed between front-end and back-end in a web application. Furthermore, they kept making suggestions throughout the process in connection with functionality, future development and application management. We never felt like they were just focused on the initial requirements that we gave. During our time together, they were a part of our team who helped us create an application that gives the end-user a possibility to quickly have an informative overview of their money streams.

Kadri Mäsak
CEO of MyFinancier