I plan on having multiple PWA-sites within one firebase-project.
The plan is to have them accessible via app1.domain.com, app2.domain.com, app3.domain.com.
Even though the apps are in principle different and have theoretically nothing to do with each other (yet), they do share some assets, including a unified messaging service, account- and profile management, and so on.
Additionally, the plan is to share as many workflows between the apps as possible. For example, I want the authentication-workflow to be app-agnostic, so that it takes only one login and the user is automatically authenticated within all apps.
To clarify what I mean, an example for the authentication process:
- User goes to app1.domain.com
- User clicks within app1.domain.com on the "Login"-Button and gets redirected to login.domain.com
- User enters their credentials, gets authenticated and gets automatically redirected back to app1.domain.com
- User can use app1.domain.com unrestricted as they are authenticated
- User enters (within the same browser) app2.domain.com
- User is automatically authenticated the same as they are in e.g app1.domain,com, app2.domain.com ,etc.
- User clicks on "Logout"-Button within app2.domain.com, and gets signed out in all apps.
How would one achieve such behavior? Ideally the solution would employ multiple Vue.Js Projects, as it would be easier to handle multiple projects while in development as opposed to one huge one.
Thanks in advance, any help is appreciated.
There's a lot to consider here and I found myself thinking along the same lines at first. However some research led me to a 1 app per Firebase project setup. Here are some of the reasons:
- Firebase recommends 1 app (includes multiple platforms) per project (there is an unofficial limit to how many apps you can have in a single project - around 20 last time I checked).
- Aside from the redirection flickering and extra logic it's fine to have a web user redirect to login at
login.domain.com and redirect back but if having mobile sites is a future possibility the user would have to be able to login from inside of each app. Instead:
- You can create a single UI login component common for all apps and on the backend of each app create a callable Cloud Function to do a cross-project connection to a common project (that has no frontend but only a backend for Auth, Firestore, Functions for common users, etc.). Or simply create a single '/login' https Cloud Function in the common project, and make async requests to it from the other projects.
- You can still have the same subdomain specific hosting settings.
- It's easy to manage Analytics, Testing, Config etc. per app.
- It's easy to delegate Firebase administrator roles/permissions per app.
- It's easy to organize (1 app = 1 editor window = 1 Firebase project = 1 code repository).
These are only a few points but I hope it helps.