Tips and Tricks - Mono Connect Widget
This is my first article in the tips and tricks category and yes I'm writing about Mono again. I had another full build article prepared but I figured something shorter should go first.
Before I go into what this trick I have is, let me explain this segment a bit. For tips and tricks, I share big and little things that I've figured can help make using certain tools or products easier, particularly for no-coders.
N.B: Sometimes what I consider a trick may turn out to be common knowledge plus I'm happy for anyone to poke holes in these.
Mono's Widget
Mono is a fintech infrastructure product that allows businesses access financial data of their users. They do a couple of other things but we're not discussing that in this article.
Accessing this data starts with a user being able to interact with the widget and connect their bank account. You've probably seen this widget before:
However, to integrate the widget you need a bit of javascript. It's not a lot of code and for someone who codes, it's really not a big deal but if you're like me and not quite ready to learn javascript, it could be a problem. Add that to the fact that it makes it hard to use Mono in a number of no-code tools.
When a user connects their bank account, you get a temporary authorization code on the backend which is what you'll use to run a particular API request so you can get a permanent ID. This ID is what would be used to run other requests giving you access to things like a user's transactions, balances etc.
Like we've established, you may not be able to do this inside no-code tools. Even if you managed to show the widget using HTML as seen in Mono's docs, there's still an issue with you getting the token and running a request for the permanent ID. So how do you bypass all of this?
Trick #1 - Opening the widget
Sign in to Mono and create an app. If you aren't sure how to do this, here's how. I've created one labelled BWT.
Click on it and copy your public key. I'm doing this in test mode so I have my test public key copied.
The next part is not exactly ideal because it involves you exposing your public key.
All you have to do is copy this URL and insert your public key after the equals-to sign like this: https://connect.withmono.com/?key=insert_public_key_here
This should successfully open up your widget. Now to getting the account ID.
Trick #2
For this part, we'll need Make. Log in to Make, create a new scenario and search for the webhooks app.
Choose the custom webhook from the trigger options. Click on 'Add' to create a new webhook, give it a name and save. I labelled mine 'Get Account ID'.
Copy the webhook URL that is generated, click on OK and save the scenario.
Go back to Mono, add a webhook under your app and paste the link you just copied there.
Open up the connect widget again and try to connect your bank account. Wait for a few seconds and then run the scenario once in Make. You should get something like this as a result:
I did this in test mode so this is a sample data. You can then add more modules to your scenario on Make to help you store the ID in a database and run requests to give you access to the user's financial data.
And that's it.
If you liked this article, make sure to share it with someone.
Have any feedback, cool ideas or thoughts? You can tweet at me or send a dm.
Need help with anything no-code related? Send me an email.