How to deploy an app to Heroku that has 2 node servers and 2 react front-ends?

Question

In the beginning, I created a node app with a react frontend (with webpack). In a subfolder, I created a node and react chat app which uses socket-io for real-time collaboration. This chat app also has its own package.json and webpack.config.js files.

The file structure is as follows:

root
- package.json
- webpack.config.js
- server
- client
- database
- chat_folder
-- package.json
-- webpack.config.js
-- client
-- server

I decided on this architecture to keep the chat server separate from the rest of the app but retain access to the shared database.

What would be the best way to deploy such an architected app to Heroku?

My initial thoughts would be to 'move' or incorporate the chat app's package.json file into the root folder's package.json? Somehow add to the package.json's start script to start the chat server. I'm not sure how to start 2 servers from the script. I'm also not sure how to alter the 2 webpack.config files or if that's necessary. Or would I need to deploy 2 separate apps? Or 2 separate dynos?

The start script in the package.json file in the main folder:

"start": "node server/index.js"

The start script in the package.json file in the main folder:

"start": "node server/index.js",

The webpack.config.js files in both folders look the same:

var path = require('path');
var SRC_DIR = path.join(__dirname, '/client/src');
var DIST_DIR = path.join(__dirname, '/client/dist');

module.exports = {
  entry: `${SRC_DIR}/index.jsx`,
  output: {
    filename: 'bundle.js',
    path: DIST_DIR
  },
  module : {
    loaders : [
      {
        test : /\.jsx?/,
        include : SRC_DIR,
        loader : 'babel-loader',
        query: {
          presets: ['react', 'es2015', 'env']
       }
      }
    ]
  }
};