Overview of My Submission

I've always found painful to use email to share things to my phone. But I've never found any solutions solving this problem efficiently. They would either be too complex or not designed as first for this use case.
So I built this app by myself.

Submission Category:

Action Star
This app is event-driven. Each time something is shared from desktop, a notification is sent to phone thanks to Realm Trigger

Link to Code

Additional Resources / Info

What's the use case of the app ? 🤔

Lotir permites an easy share of text and image between your phone and your computer. It takes less than 30 seconds to share. And it's bi-directionnal. You can share from your computer or your phone.
Lotir can be useful in these situations :

• Imagine you receive a long OTP Code on your phone. Use Lotir to send it to your computer.
• You have a very long url that you should send to Whatsapp. Use Lotir to send it to your phone.
• You have a photo on your phone, and you need it on your computer. Send it over Lotir.

Also, everything is temporary. Thanks to MongoDB TTL indexes, each thing shared stays on the server for 7 days.

Features

• Share any text from and to your phone/computer
• Share any image from and to your phone/computer
• Receive a notification when a new share happened
• Data is safe and temporary. I use a MongoDB Database hosted on Atlas. Data is replicated using a replica-set in three availability zones and can't stay for more than 7 days.

How to use ?

Lotir does not have the concept of registration/login. Instead, it uses a sync key. Consider it as a secret key, it authenticates you to the server. Keep it hidden. To use Lotir, just put the same key in all your devices.

When you done that, you're ready to use Lotir

Download app

As you saw, Lotir is composed of two parts : a computer app and a phone app.

Computer

Lotir.ml is a web app that can handle all computer functionalities. However, if you prefer desktop apps, you can download them from github release.

Phone

Currently, iOS is not yet available.
To use Lotir on your phone, install its APK from github release.

Google Play protect may show several warnings about the security of this app. You can skip them.

Architecture 🗺

Clients (blue on diagram)

Clients are mobile apps, desktop apps and web apps. They identify themselves using the sync key specified in settings. Using Realm SDK (web and React Native), they interact with MongoDB Realm Functions.

• Web app is built using NextJS and Realm Web SDK. UI is handled by chakra UI. I've added a custom theme on top of it.
• Mobile apps are built using Expo and NativeBase. Notification service is also handled by Expo. Apps are then built using EAS Build.
• Desktop apps are just a webview around Lotir.ml created with Neutralino. These are lighter than Electron.

Realm Function (purple on diagram)

Those are the main interface between client and backend. There is 5 of them :

• addMessage : used to share text
• addImage : used to share image
• setToken : used to register notification token for mobile app
• getMessages : retrieve shared text and images for clients
• notifMobile : a function that responds to Realm trigger to create a new notifications

When an image needs to be shared, it is first upload to imgBB by the addImage function and link is then saved using addMessage function

Database trigger (yellow on diagram)

Each time something is shared, a new document is created in MongoDB. Creation of a new document triggers the notifMobile function. If it is detected that the message comes from a computer, the function sends a notification to the phone.

MongoDB Atlas database (green on diagram)

This is the central piece of the architecture. The MongoDB database hosted on MongoDB Atlas saves and retrieves all data for Realm Functions. Each share is saved in a collection with 5 attributes :

• platform : mobile or computer
• id : the sync key
• title : self explanatory
• body : self explanatory
• time : timestamp of when the share was created

Then, a MongoDB TTL index ensures that shares don't stay more than 7 days on the server.

MongoDB Charts

To check some stats about the app, I've set up a small dashboard using MongoDB Charts. I can see how many different users there are, the repartition per platform and how many shares have been made in a week.
Link to dashboard

MongoDB Realm Hosting

Lotir.ml is hosted using MongoDB Realm Hosting

Open Source projects used

• Expo : thanks to a recent update, Realm SDK could be used along Expo
• Realm SDK (web and React Native) : those SDKs greatly simplified development and permits me to avoid using http endpoints.
• react-native-async-storage : used to save data in Mobile app
• Native base : Great UI library for React Native
• react-navigation : Router for React Native
• React for NextJs and React Native
• NextJS : the site isn't optimized but still run fast thanks to NextJS
• Chakra UI : Equivalent of Native base but for React and Vue.
• Icons 8 : Icons come from this awesome website
• Neutralino : Embed the web app in executables
• Realm-cli : I could easily push and pull config of Realm Project thanks to CLI.

Demo

To record my phone screen, I use Your Phone from Microsoft

These videos show two situations :

• Transfering text to phone
• Transfering image to phone