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