This setup allows for a monolithic Node/Express/React app which can be easily deployed to Heroku.
The front-end React app will auto-reload as it's updated via webpack dev server, and the backend Express app will auto-reload independently with nodemon.
Start by installing front and backend dependencies. While in this directory, run the following commands:
yarn install
cd client
yarn install
cd ..
``
After both installations complete, from the root of the project directory, run the following command in your terminal:
yarn start
That's it, your app should be running on <http://localhost:3000>. The Express server should intercept any AJAX requests from the client.
## Deployment (Heroku)
### Create a Git Repo
Once you're ready to deploy, start by making sure your project is a git repository. If so, proceed to the next section, otherwise run the following commands in your terminal:
git init git add . git commit -m "Initial commit"
### Heroku
Make sure that you have a Heroku app created for this project. If so, proceed to the next section, otherwise run the following command in your terminal:
heroku create
Optionally add an argument for your application's name after `create`, e.g.
heroku myawesomeapp
### Deploying
After confirming that you have an up to date git repository and a Heroku app created, run the following command to deploy:
yarn deploy
If all previous steps were followed correctly, your application should be deployed to Heroku!
## Procfile
* What's the Procfile for?
* By default Heroku will run the "start" script on a deployed node application. In our case, the "start" script in the `package.json` isn't going to work because it's running the webpack development server.
* The Profile takes precedence over the `npm start` command and tells Heroku what command to run instead.