Building Toby's mobile app

Toby is a nice little bookmark manager. It has a simple and pretty interface, coupled with all the features that you need (extension, note, collections, teams).

Weirdly enough, the team decided to go for a browser extension only. Although very nicely integrated into the browser, it offers no access on mobile... A bummer for a tool that's supposed to keep your favorite websites and make them easily accessible later.

(Edit: they now have a web app, accessible through any browser. Still far from a decent mobile experience, but good enough)

I was head-deep into React Native building nowmad.io, so I decided to take a day off and jump into building Toby a mobile app!

Toby logo

Playstorehttps://play.google.com/store/apps/details?id=com.toby

AppStore: Never got accepted due to copycat policies (contacted devs, without success)

Sourceshttps://github.com/julienr2/toby

DisclaimerI’m not related in any way to Toby. I speak in my name only and developed this app as an exercise. I don’t intend to fraud or take over Toby, but on the contrary enhance their experience to use it more easily on various platforms, while learning new concepts.


Figuring out the API

Being a browser extension, it was easy to inspect it and figure out the few API endpoint needed. And since the browser extension doesn't have any host, it's more complicated to enforce some API key system, based on the origin. So Toby's team took the option to ignore that and keep the API endpoint fully open.

The only little trick was to figure that those endpoints were sending back base64 encoded stringified JSON. Once figured out, all the interaction with the API was strait-forward.

Design

This was strait-forward too, as I could find some teaser of an official Toby mobile app (that never got developed so far..), laying down some basic components and layout.

I kept it very simple, with the minimum complexity possible, to focus on the core usage: accessing bookmarks and saving new ones

Saving new bookmarks

One key feature I wanted for this mobile app, was the ability to easily add a new bookmark, leveraging the Share intent/extension of the platforms. This way, from any mobile app or browser, we can simply select a URL, and share it to the app to quickly save it in our bookmarks.

Turned out to be more complex than expected.

// image share intent

Android

After digging into Android native code, you face two options:

  • Adding an `intent` into the main activity of your manifest, in order to launch the app when it received a sharing intent
  • Adding a new `activity`, which can fire up a newly registered component, which can have a whole new logic

The second option was the way to go because I wanted a specific modal-app overlaying the rest of the mobile activity, to quickly tweak and adjust the collection destination of the bookmark.

With a bit of help from the react-native-share-extension library, the rest was easy to set up!

iOS

Although I can't actually get the app to the AppStore since I don't own the domain, I went for iOS two (sharing most of the app logic with React Native).

New platform, new world, new challenges... Luckily this detailed article provided all the steps needed to battle through it!

Until the last challenge: App Groups...

On Android, the app is the same, sharing the same storage. On iOS, an extension and an app are considered two different entities. So in the extension, when you try reaching for the auth token you saved during the login flow in the app, you'll realize there's nothing there!

Of course, Apple provides a way to safely share value between apps, using App Groups, and even better, there's a React Native lib for it! Basically, you set up a decentralized location on the device, and allow access to both apps, this way they can both register and access values into it.

After adjusting the code **I finally got Toby (unofficial) working on both platforms **🎉🎉

Wrapping up

It has been quite a work to get there and I met more difficulties than I expected, but it got me to dig deeper into the native part, and to start putting a foot into XCode and IOS dev (probably just a toe actually).

I now face the copycat's policies of AppStore preventing me from publishing the app, but hopefully, I’ll manage it somehow… In the meantime, I hope this experience can help you develop something similar for your app or can help you access and add bookmarks from/to your Toby account!

I’d be glad to hear what extensions you’ve built or get any feedback about your experience with Toby for mobile!

Profile picture
Hey ! I'm Julien.
Here I wander through thoughts and code