How can I use a TurboRepo to have multiple Apps? Do I use multiple Next.JS projects? Help with infra
Hi folks, I need some help in understanding how I can setup my infrastructure
I want: 
- Any number of apps, that consume a single backend. (Or maybe I need multiple backends, I still don't know.)
- My idea is to have one single TRPc Endpoint being served on one MASTER server, which would probably be a Next.JS app on Vercel.
- An infrastructure that allows me to deploy any number of applications when I want, in order to scale my company in any way I want.
- TurboRepo would be used for me to have my apps (E.G.): my Master Next.JS application, and then my Expo React Native app, and then my other webapps (these other webapps I still don't understand how I need to handle)
Ok, so these are a few points I need. And as you just read from this last bullet point I wrote, Ideally I would have a TurboRepo for ALL of my apps. However, I still do not understand how to do it in a correct way. Should I have multiple Next.Js applications? But wouldn't that make me have multiple servers in Vercel? (serverless functions, I know. But still, a separate "server"). I don't want to scatter my backend all around, but I still want to use my Create-T3-App as my MASTER app.
Yesterday, I deployed the starter turboRepo project to Vercel, which contains 2 Next.JS apps. And as you would Imagine, since Next.JS is a backend framework, It deploys the serverless functions for these 2 apps, so essentially, I have 2 "backends". In doing this, I tried to envision how I could scale this monorepo to have multiple apps, just like this way I tried with these 2 apps. After some thought, I created this diagram:
https://excalidraw.com/#json=4ztK98vS0jiYkz68Y30nM,EFvIKEsJoQj33wKH3o9IqA -- Excalidraw link
Excalidraw
Excalidraw — Collaborative whiteboarding made easy
Excalidraw is a virtual collaborative whiteboard tool that lets you easily sketch diagrams that have a hand-drawn feel to them.

5 Replies
As You can see from the diagram, I setup in there multiple Next.JS projects, and I understand logically that it is possible to operate through each combination.
Pink computer: 
-App1 'backend" is acting as a "middleware" between the client and my main MASTER backend.
Blue Computer:
-App2 'backend' is serving whatever it has inside it. (no connection to my MASTER backend) - Maybe can be used for static pages. (at this point i'll just use Vite lmao)
Green Computer:
-App3  'backend'  is  serving  each  route  for  the  user.  All  of  the  following  connections  can  be  made  to  the  MASTER  app  directly.  No  need  to  intercept  App3  with  the  middleware
As  you  can  probably  tell,  I  don't  understand  well  how  to  organize  my  infrastructure.  I  love  NextJs.  I  love  prisma,  I  love  TRPc.  Maybe  ideally  in  my  dream  world  I  would  have  one  single  backend  for  all  of  this.  But  I  don't  understand  how  I  can  assign  multiple  domains  for  different  apps  inside  just  one  single  Next.JS  application.  I  am  not  sure  how  that  would  be  possible
######
####
Just  so  you  can  understand  my  real  use  case:
I  am  a  company  that  wants  to  separate  each  client  through  its  own  app.  I  want  ideally  to  use  the  same  backend  trpc  logic,  but  it  should  be  a  different  app  in  of  itself,  accessed  via  a  different  domain.  EG:  company1.com,  company2.com  and  company3.com  should  access  different  Apps,  but  ideally  same  backend.
Is  it  possible  to  it  with  one  Next.JS  app?  Do  I  need  multiple?  Or  maybe  I  can  have  only  one  Next.JS  app  for  my  backend,  and  then  multiple  Vite  or  other  "frontend"  frameworks  so  I  can  access  the  Next.JS  backend?  Help  me  I  am  a 

how different do these sites need to be? is it just one logo change per domain or something more?
Completely different app. One I would sell for example software to manage teams, and another app I would for example have an e-commerce
In another app I would sell AI tools for example, using openai
if you're going do wildly separate things with all these then it's probably best to keep them all fully separate. e.g. one next.js app per project with it's own db. sharing code between these could make it difficult if you ever want to go a different direction with any of them. you probably know you own situation better than me though so your mileage might vary
That’s not what I want
I want to create one integrated thing for all my apps. Literally have a system in which I have one DB and one layer of communicating from my multiple frontends (and multiple apps) to my server. The database should be one database for all of my needs, and Ideally I would implement all database operations on my one and only backend