Host frontend + backend code on a single port

[JamesMGreene]

Given our application's nature, we should ideally just host the frontend + backend code with one Express port (for both dev and production). This should simplify our onboarding for local development, our Codespaces configuration, and our deployment strategy.

In terms of deployment, we would only need a single self-contained Heroku App, and could even consider using other hosting services like Azure, AWS, GCP, etc. 🚀

While researching this, I found that it is easy enough to have an Express app host a built production Vue app but I struggled to find good resources on how to do it in a way that still supported hot-reloading of Vue from a development perspective.

The most interesting resource I found on the topic was this one, which seemed very promising in its unique approach of mounting the Express app into the Vue app (vue-cli-service app, that is) since it already has an internal Express server. 🔄

Related:

• OSS Architecture: Combining front-end and back-end into one repo amplify-back-end#127

[JamesMGreene]

Alternative to consider for the short term:

• Use Heroku backend proxying for /api to support multiple backends #84