Guide for expanding from Realm Sync to Web

Hi all,

I am looking for guidance how to approach creating a web app working with MongoDB Atlas/Realm, coming from the native Realm SDK for iOS.

Current project state is a fully implemented iOS app using the Realm Swift SDK with a MongoDB Atlas database and a Realm App to synchronize the local database with the sync schema definition and custom partitioning strategy (using a function). For authentication I am currently using the built-in Realm Email/User-Password service, as-well as “Sign in with Apple” and “Login with Google”. All of it is configured in MongoDB Atlas/Realm App.

Now we want to expand the iOS and Android app with a Web App offering the same functionality. Basically we are just editing the data in the database and visualizing on the different platforms. I decided to go with Realm Sync, because the native apps are offline-first, therefore I was looking for a smart solution to migrate the data into the cloud as soon as the user decides to do so.

Now for web this is a different topic, as the storage solutions of moderns browsers are not that sophisticated, but offline-first is also not required.
So I already looked into the Web SDK guides/tutorials in the documentation (https://www.mongodb.com/docs/realm/web/) on how to get started, but I still have a few open questions, I hope you can answer for me.

Q1. Should I continue to use the built-in authentication of Realm for the web app, or should I go with a different auth provider, e.g. Auth0? I am worrying the verification of the authentication with Realm Sync is not available in my own backend (I couldn’t find a public key to verify the JWT Token signature created by the Realm App). If I have to change to the Custom JWT strategy, I should probably do that now, before creating a larger userbase, but I am wondering if User/Password in Realm is not available in a custom backend, or if I just can’t find how to set it up.

Q2. Offline-first synchronization like on iOS/Android is not really a thing in the web. Do I understand correctly, for web I do not interact with any kind of local database, but instead only work with the GraphQL endpoint + Realm functions?

Q3. We are using Next.js as the web app framework. It also includes the option to built the API backend used in the web-app. Is there any preference in using the Realm GraphQL endpoint vs. building the Next.js backend by myself to connect to the MongoDB database and create my own API endpoint? Of course it is more work, but it would also give me more freedom with the queries and self-hosted/container-based pricing seems cheaper than serverless-hosted by MongoDB.

I found an example in the Next.JS GitHub project, but it only uses the Realm GraphQL endpoint, rather than a custom endpoint.

Thanks in advance for your help!

Hello @Philip_Niedertscheid ,

I don’t have any specific docs on how to do a cross-platform web/mobile app in Realm, but you can take a look at the Realm Template Apps to see how I might approach it - you can pick either web-mql or web-graphql depending on which API you want.

Q1: I don’t understand your Question 1 entirely - you can definitely use the same authentication provider in your web and mobile apps (e.g. email/password). However, if you need to integrate auth with another system outside of Realm then you may want to consider using something like Auth0 instead for both web/mobile.

Q2: You are generally correct regarding Realm Database & Offline Storage being unavailable for web. you suggested GraphQL+Functions but could also use MQL+Functions as both APIs are more or less equivalent in terms of what you can do. It’s a matter of preference, though I’d personally suggest MQL if you want real-time because we don’t have GraphQL subscriptions yet.

Q3: One of the main value premises of Realm is that you don’t have to do all the extra work of setting up a backend. So yes it might be a little more flexible at the end of the day but it probably won’t be cheaper for you to implement your own versions of Realm’s rules, auth, validation, etc. However, if you prefer Next.js functions to Realm’s serverless functions, you could always use the Realm SDK in your Next.js handlers to route database requests through our rules/auth/etc

Thanks,
Tarun

1 Like

Hi Tarun,

thanks for the reply and the link to the templates.
I will check it out and maybe it already helps me enough.

Regarding your feedback:

Q1: AFAIK authenticating with Realm your backend creates a JWT token for the internal Realm username/password system and signs it using a private key. This token is then used for authenticated requests. Your e.g. GraphQL backend will receive the request with said JWT token and needs to verify its signature. To verify a JWT token, the backend which processes the request needs access to the public key. You have access to public key, but if I want to use my own backend, I also need access to the public key so I can also verify that the user is in fact authenticated. This is exactly what Auth0 is offering as a service, but to do the same with Realm username/password I would only need your public key (which is not confidental at all).

Q2: I understand, thanks for highlighting the differecnes

Q3: Extending my further explanation from Q1, I am looking for a way to verify the authentication token of a request with the users in the Realm Users database.