A better messenger

A new messenger built to communicate, organize, and reward your communities and friends.

Ninjas Code has the best software developers I have worked with. They jump right into codebase without too much hand holding. They are responsive and professional. Having experience with multiple agencies. I can confidently say Ninjas Code are simply the best.

Crystal Rose

Founder at Sense Chat

1. Introduction

User onboarding with a safe and secure mobile experience.
Building a decentralised application has been gaining popularity for quite some time, while at the same time being difficult to set up and manage. Users on boarded need to be confident about security security of the application. Implementation of phone authentication with providing user with safe and secure private key storage for end to end to encrypted chat was one of the key feature of this application. It was crucial to provide great and smooth onboarding experience. The application was build exclusively on Ethereum blockchain with its on tokens Sense tokens listed on popular crypto exchanges. Therefore users experience with chat and confidence in security was of primary concern for our system.
sense chat

2. Problem

Making a software architecture that is robust and scalabe
Making a software product is not just about just making a functional product. This was the second iteration of Sense and we wanted to make sure that the mistakes made in the first iteration are not repeated, we needed to meet the following criteria:

*

The codebase should have 100% complete code coverage using test driven development

Using react native the UI should be performant compared to pure native performance with pixel perfect design on both devices Android and iOS

Codestructureshouldbeinawaythatmultipleteammembercould work on it without blocking another team member

Technologies should work on all platforms and should be generic

Leveraging typescript the architecture should be designed in Clean Architecture pattern

Knowing that this was the second iteration there was always a strive to make the product better than the previous iteration writing tests for every code so we have battle tested code.

3. Approach

A deep dive into the Native side
We knew from the beginning that what’s going to work since this was our second iteration. Mistakes that were made previously didn’t have to be made again.
The previous code didn’t have proper separation of concerns which made it harder to debug once the code base became larger. In software development there’s always a rule of diminishing return once the code base becomes significantly large its always hard to manage it then and ultimately it becomes unmanageable. Already having a user base we wanted the migration to be smooth as possible.

Functionality

ios support

Android support

getstream.io for chat functionality

Yes

Yes

Functional test, unit tests and end to end testing

Yes

Yes

Using cross platform share feature using Branch.io

Yes

Yes

Using fluid navigation using React Navigation

Yes

Yes

4. Solution

Combining all software solution services
Having considered all the functionalities and limitation of each platform, we looked into out of the box services that could cate some of our needs. The decision was based on reliability and security of these solutions. It should work seamlessly on both platforms.
The chat feature was main feature of our application, it was split into the following steps:
We looked into already made popular solutions which is Rocket Chat. To speed up the development process we used getstream.io which provides chat feature out of the box.
Sharing links in the chat is one of the main feature in chat we made a solution that shows that display previews image when a link is shared which did not come up with getstream.io.
Handling user authentication with Twilo.
sense.chat
sense.chat
The first order of business was making the code architecture compliant with Clean Architecture.
The principles for clean architecture are that it is independent of Framework, UI, Database and external agency. We made our UI in such a way that it was a complete dumb component with only props passed to it and its only function was to render view. Using this approach made it easier for us to test UI using Detox. Writing tests is only possible if the code is testable. Using clean architecture gave us an advantage that in future if we had to change to another service it wouldn’t be too hard to change. Custom hooks were made for handling the logic in controllers part. Mocks were created for data for unit testing as well.
We had a large team working on one codebase. So we didn’t want programmers creating problems for the rest of the programmer. The purpose of our architecture was to facilitate development, deployment, operation and maintenance so that if another team starts works with the codebase they don’t have problem getting hang of the codebase. Our main philosophy was to leave as many options as possible, for as long as possible. Our solution was architecture in different layers with user facing layer being presentation layer. The presentation layer was connected with controllers mainly custom hooks. Any network calls had a separate layer so that we have a clear separation of concerns and the code is testable.
sense.chat

4. OUTCOME AND BENEFITS

A stable solution with an excellent user experience
The result of our work was achieving a stable solution with a low error rate that allowed to provide a flawless user experience. Moreover, it provided the ability to set up the WiFi network or the physical device without leaving the app and manually connect to the device’s hotspot. It resulted in making the whole user onboarding quick and effortless.

Let's Talk with us

Name

Email

Message

Get in Touch

Phone Number

(92) 3339461270

Email

sharan@ninjascode.com

Map Street

Islamabad, Pakistan

Ninjas Code

Ninjas Code is an software house who provide services and custom apps to their clients

Follow Us


NinjasCode - © 2021 All Rights Reserved