Nuxt app - Client & Server files separated - how to deploy to Heroku?-CodePudding

Following a course on Nuxt, I have chosen the SSR route when creating this application, separating admin, client and server into their individual files. This is the file structure:

- amazon-clone
    - admin
    - client
    - server

The course material does not cover pushing to git or deploying to Heroku.

I have followed the steps as per Nuxt & Heroku docs, however because each file will have its own package.json and nuxt.config.js I am under the impression this will not work. As Heroku will expect a package.json in the root folder?

What is the best practise for deploying an app to heroku when client, server and admin are seperated?

The repository: https://github.com/TomBell95/amazon-clone

Heroku deployment steps:

Procfile: web: npm start
package.json: "heroku-postbuild":"npm run build" "engines": {"node": "14.x"}

heroku buildpacks:set heroku/nodejs
heroku config:set HOST=0.0.0.0
heroku config:set NPM_CONFIG_PRODUCTION=true

I have found similar questions however nothing Nuxt specific (e.g. How to push both the client side and server side project folders together as a one project (api front end) on github?).

CodePudding user response：

I really don't see the purpose of having all of those 3 separate.

Never saw this kind of project structure and tbh, I don't even know how to host it properly.
At the end, there is a backend on this. So, you could probably split the backend (host it on Heroku) and the frontend (split it on the frontend). If you're learning Nuxt, this is probably not the way to go because it's not using a common structure from the start.

I can recommend:

Nuxt.js - Vue.js on Steroids, I took this one a while ago, it's done by Max, he is a great teacher and does a lot of great content
Mastering Nuxt is done by a Nuxt Ambassador and his team. It's very complete and plenty of good practices

Those are good resources that you can follow, which are well-known and good.