Create a React app & deploy to Heroku

create-react-app-on-heroku.sh

## Global install of the app generator
npm install -g create-react-app

## Setup the app (first-time only)
create-react-app my-app
cd my-app
git init

# Create the Heroku app; requires free account at https://www.heroku.com/
heroku create -b https://github.com/heroku/heroku-buildpack-static.git

# Set the web root to the build/ directory
echo '{ "root": "build/" }' > static.json
# Allow JS bundle to be committed (removes `build` from ignores)
sed '/build/d' .gitignore > .gitignore.new && mv .gitignore.new .gitignore

## Build, commit, & deploy
npm run build
git add .
git commit -m "react-create-app on Heroku"
git push heroku master

## Visit the live React app in your browser
heroku open

# Develop your app locally using `npm start`
# Then build, commit, & deploy ♻️

This flow is now automated with Heroku Buildpack for create-react-app

Hello @mars - We are using Create-React-App within an existing node/express app deployed on Heroku. Not yet clear to me what shall I do to deploy it properly. Would be great to have a guide for that.

@philjoseph there is also create-react-app with a Node server for that situation.

Hey, I got this error when I tried the following script:

## Setup the app (first-time only)
create-react-app guanw-test
cd guanw-test
git init

# Create the Heroku app; requires free account at https://www.heroku.com/
heroku create -b https://github.com/guanw/create-react-app-buildpack.git

# Set the web root to the build/ directory
echo '{ "root": "build/" }' > static.json
# Allow JS bundle to be committed (removes `build` from ignores)
sed '/build/d' .gitignore > .gitignore.new && mv .gitignore.new .gitignore

## Build, commit, & deploy
npm run build
git add .
git commit -m "react-create-app on Heroku"
git push heroku master

## Visit the live React app in your browser
heroku open

remote: Compressing source files... done.
remote: Building source:
remote:
remote: ! error fetching custom buildpack
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to arcane-basin-40866.
remote:
To https://git.heroku.com/arcane-basin-40866.git
! [remote rejected] master -> master (pre-receive hook declined)

Do you know why it happened?

anyone has a reply to this?^^

heroku says deployed successfully, but i get 404 error when i open the url

@kimmiekim @HemaW @guanw Use create-react-app-buildpack instead of this script. (This was an early experiment that lead to the creation of that buildpack for Heroku.)