Monica CRM is a great open source contact manager, but at the time of writing (early 2019) there’s no official mobile client.
I made a simple ‘Quick Add’ app for Android that works well for me. It might work well for you, too. Get it here.
Why
Adding contacts via the web interface is a little slow for me, because:
- I live in China, and connections to servers outside China aren’t always fast or reliable.
- I often want to add notes for a new contact, and
- I sometimes want to add contacts when I have no internet connection, and this isn’t possible via the web UI.
What the app does
It lets you enter a person’s name (forename and surname) and some notes about that person. When you’re done, just tap ‘Save’ and you can continue adding someone else, or just do something else.
There’s no waiting, because the new contact and new notes are uploaded in the background. And if you have a bad network connection (or are on a plane), the information is saved on your phone temporarily. Once you have an internet connection, it’s just one tap to upload all the pending contacts to Monica.
How you connect the app to your Monica account
In order to use the app, you need a ‘Personal access token’, which you can create in the Monica web app. Just click the settings icon in the menu bar, then click ‘API’ on the left hand menu. You will see a button ‘Create New Token’ which generates a new token.
Here’s a short (4 minute) video showing installation, configuration and usage: https://youtu.be/6SsJ5QSDglg
How I built the app
I wanted to build a cross-platform app that wasn’t just a wrapped WebView, which meant choosing between Flutter and React Native. It wasn’t an easy choice, but I decided to go with React Native as it’s been around for longer and there are lots of good resources on Udemy, Stack Overflow etc.
React Native itself has many many dependencies, and I tried to add direct dependencies only when I had a real need:
- react-native-navigation: to provide a bottom-tabbed UI
- react-native-elements: to get some nicer default styling, and a pre-built component for list items
- react-native-vector-icons: easy access to icons for bottom tab navigation, and also required by react-native-elements
- redux: added only after I created a mess trying to pass state between two tabs that were based on two components in different files
- redux-persist: added to reduce the amount of code needed to store some state in both redux and local storage
- redux-thunk: added to make it easy to trigger network requests
This was my first time developing a mobile app with React Native, and I took a few wrong turns. Notably, I spent a bit too much time trying to structure the code for state management and networks requests properly. Once I started using redux, everything became easier.
If I were to do something similar again, I would take a look at these:
- redux-saga as an alternative to redux-think (it has more features, so maybe it’s better?)
- ant-design-mobile-rn as an alternative to react-native-elements (it has more components and built-in styles, so maybe it’s better?)
BTW - This app has no relationship with Monica CRM or its creators. If it works for you, great! If not, please don’t bother Monica’s developers for support, as they likely can’t help.