How to deploy React/Node app to Heroku with server and client folder structure?

Question

so Ive finished my first app and I want to deploy it to Heroku, but I keep getting error No default language could be detected for this app. Ive read that you need to have package.json in your root directory. My directory looks like this

AppFolder

• client -> package.json + /public + /build folder + /src -> all react components
• server -> package.json + app.js(main file) +.env + db.js (database pool) + /routes folder

1. Is there a way how to keep this file structure and still deploy it succesfully?
2. Should I commit /build folder to github as well? (Its in.gitignore originally) and its created in /client folder, however in some guide I was trying to follow they moved it to /server folder. Id like to use continious deployment as I still need to test responsivnes + finish some details.
3. Also Im using MySQL, will I be able to host my database on Heroku as well?

Answer 1

All right Ive figured out how to overcome this issue with folder structure. On Heroku go to Resources -> Add Buildpack -> And you want to add a gitpack from github named subdir-heroku-buildpack , author is timanovsky HERE . Ive came around this information in this video: VIDEO .

Or there is a way using git subtree , but for beginners as I am I find the first method more easier.

Also for the front-end part and MySQL Database, both that I successfully deployed using Heroku (Database) and Netlify (React app) Ive used this video: VIDEO2 . It shows how to upload your back-end to Heroku as well, but with the traditional heroku-way folder structure.