Easy 3-Step Deployment Process
Step 1: Create a Procfile with the following line:
web: npm run start:prod. We do this because Heroku runs
npm run start by default, so we need this setting to override the default run command.
Step 2: Install the Node.js buildpack for your Heroku app by running the following command:
heroku buildpacks:set https://github.com/heroku/heroku-buildpack-nodejs#v133 -a [your app name]. Make sure to replace
#v133 with whatever the latest buildpack is, which you can find here.
Step 3: Follow the standard Heroku deploy process:
git add .
git commit -m 'Made some epic changes as per usual'
git push heroku master
Easy 7-Step Deployment Process
Step 1: Run
npm install to install dependencies, then
npm run build to create the
Step 2: Navigate to AWS S3 and login (or sign up if you don't have an account). Click on
Services followed by
S3 in the dropdown.
Step 3: Click on
Create Bucket and fill out both your
Bucket Name and
Region (for the USA we recommend
US Standard). Click
Create to create your bucket.
Step 4: Open the
Permissions accordion on the right (under the
Properties tab) after selecting your new bucket. Click
Add more permissions, set the
Everyone (or whoever you want to be able to access the website), and give them
View Permissions. Click
Step 5: Click on the
Static Website Hosting accordion where you should see the URL (or endpoint) of your website (ie. example.s3-website-us-east-1.amazonaws.com). Click
Enable website hosting and fill in both the
Index document and
Error document input fields with
Step 6: Click on your new S3 bucket on the left to open the bucket. Click
Upload and select all the files within your
./build folder. Click
Start Upload. Once the files are done, select all of the files, right-click on the selected files (or click on the
Actions button) and select
Step 7: Click on the
Properties tab, open
Static Website Hosting, and click on the Endpoint link. The app should be running on that URL.
Deploying in a subfolder of an existing server
Suppose you want users to access the app on
Step 1: Configure webpack to inject necessary environment variables into the app
- Changes below are made to
Step 2: add
basename to the history
- Changes below are made to
Step 3: Run
PUBLIC_PATH='/web-app/' BUILD_FOLDER_PATH='build/web-app' npm run build, to save production build inside
Step 4: Upload/Place the created
web-app folder in your server's web-root folder
Endpoint The app should be accessible on
NOTE that this has been tested on both APACHE and NGINX servers.
AWS Elastic Beanstalk
Please refer to to issue #2566 for more explanation.
- Create an account on AWS console
- Install EB CLI (AWS documentation)
- Create your AWS EB profile. In case you are using a continous deployment tool, you can create another user for your CD tool as well.
- Create your Elastic Beanstalk application and environment (either via CLI or web console)
- Configure your EB CLI. You should have a
.elasticbeanstalk/config.ymlif properly configured
Step 1: Add AWS EB start scripts in package.json:
"aws-eb:prod": "npm run build && npm run start:prod"
Step 2: Create a
In the likely case of multiple environment, remove the
NodeCommand entry and
manually configure it per environment in the web console: Configuration > Software > Node command.
Step 3: Create a
Step 4: commit your changes and deploy via EB CLI: