I’m working on an application where I have a Vue.js frontend and a Node.js/Fastify backend API running separately during development. They communicate through different ports on my local machine.
What’s the recommended approach for deploying these to production? I’m considering a few options:
- Single server deployment: Should I put both applications on one server but separate the API using a subdomain like api.mysite.com?
- Multi-server setup: Is it feasible to host them on completely different servers while maintaining the same domain structure?
I want to make sure I follow best practices for security and performance. Any guidance on the pros and cons of each approach would be helpful.
honestly i’d go with single server first unless you got crazy traffic expected. way easier to manage and debug when things go wrong. just use nginx to proxy /api requests to your backend port - works great and keeps everything clean without dealing with cors headaches.
I just deployed a Vue/Node setup like this and the subdomain approach works great. Using api.mysite.com for your backend kills CORS issues and keeps everything separated cleanly. You can set up different SSL certs and rate limiting for each service, plus CDN caching works perfectly - cache your Vue assets but leave API responses uncached. Best part? You’re running one server environment but still get all the benefits of decoupled services. If you need load balancing later, it’s easy since everything’s already separated.
that’s a really interesting topic! have you thought about how your traffic might scale in the future? if it gets big, might be better to start with a multi-server setup. but if you’re just testing, maybe stick to one server for now?