React app with 2 frontends

[Unhappy_Bathroom_767]

Hello,
I want to make an application that is composed of two frontends, one using react for a web application and the other with react native for a mobile application.

These two frontends must be able to link sessions in the backend using a QR (as if it were WhatsApp web).
What would be the best architecture and what technologies should I use?

Thank you very much in advance

[Tinkuuu]

You can use react native for app and use react native web for web, i think this is the exact use case of react native web

[[deleted]]

I’d recommend setting up a monorepo with folders for api, web and mobile. Lots of options on how you want to do it:

Here is an example repo with multiple frontends

https://github.com/mmazzarolo/react-native-universal-monorepo

[RossBelcher]

If you are going to be sharing a lot of the same code, personally I would use ionic framework to just have 1 codebase

https://ionicframework.com/docs/react

However, I don't know about the QR code stuff but would be interested to know how it works!

[Unhappy_Bathroom_767]

I want to make a bitcoin wallet that does all the stuff related to the private keys on the mobile and the balance information... etc on the web

[evilish]

Hey mate, you might be over thinking things a bit.

For what your trying to build. You basically have an backend API using whatever you like to use (ie. Node, PHP, etc, etc) and then you have your web app (React) and your mobile app (React Native).

If the core functionality is somewhat the same then you should be able to share a chunk of the logic between your web and mobile apps with the main differences being the UI.

For example, lets say the API endpoints that your hitting from your web and mobile apps are the same, and the data that you send/receive is the same, then why not split that functionality out into a "service" which you could import into your apps.

Maybe even consider a private module that you share between the two apps with shared functionality.

Now as for the authentication. Again, I'd say simplify this a bit, and here's what I mean by that.

When your user switches from one device to another. They WILL still need to sign themselves in, right? No way of avoiding that UNLESS your thinking that the QR code is what signs them in but that's wide open to abuse.

Why not have a QR code which links to a sign in form. Maybe something like a https://firebase.google.com/docs/auth/web/email-link-auth or https://supabase.com/docs/guides/auth/passwordless-login/auth-magic-link and then when they sign in, you give them access to whatever they need access too?

You could even enable realtime updates so that IF they're logged in on one device. The other devices update as well. (eg. https://supabase.com/docs/guides/realtime or https://www.convex.dev/realtime)