Best practices for production deployment of decoupled client and server applications

I’m working on a web application where I’ve built the client side using Vue.js and the server side API with Node.js/Fastify. During development, I run them on separate ports locally (client on 3000, API on 8080).

Now I need to figure out the best approach for production deployment. I’m considering a few options but not sure which one is recommended:

Option 1: Deploy both applications on the same server but use different subdomains (like api.mysite.com for the backend and www.mysite.com for the frontend)

Option 2: Use completely separate servers for each part, though I’m worried about CORS issues and domain management

What’s the standard way to handle this kind of setup? Are there any gotchas I should watch out for when deploying decoupled applications like this?

option 1 is way easier, for real. keeps things simpler nd no cors headaches. just set up your nginx right and it’ll be smooth sailing. i’ve done it for my projects and it works perfectly. definitely recommend sticking to one domain.