Deploying a React App on Heroku

I created a React App and wanted to deploy it on Heroku so here goes.

I am on a mac sunning the Sierra OS. I am also using the Webstorm IDE. I used the terminal in the IDE.

The official instructions are here.

Before you start, you must configure heroku on you computer. The best way to do it is to follow the tutorial.

First Step

In the terminal, while in your program’s directory, type in git init if you have not made a repo yet. When I tired to do this, I received an error about something called xrun;

xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun

After doing some research, it seems that, somehow, command line tools had been deleted -_- . In the terminal, I typed in: xcode-select — install , then went ahead and did my git init again. It worked!

Second Step

Now I had to input:

heroku create -b https://github.com/mars/create-react-app-buildpack.git

But, Mac… I got another error because I forgot sudo. Always put in sudo when the command has Heroku in it (if anyone knows a way around this…).

Third Step

git add . No problems.

Fourth Step

git commit -m "react-create-app on Heroku"

No errors her either. This is rare and I am beginning to get worried.

Fifth Step

AND… I was right to be worried. The next step has me putting in git push heroku master . After I press enter, I am asked for my username and password. Authentification failed and I got this error message:

remote: ! WARNING:
remote: ! Do not authenticate with username and password using git.
remote: ! Run `heroku login` to update your credentials, then retry the git command.
remote: ! See documentation for details: https://devcenter.heroku.com/articles/git#http-git-authentication

Whats that supposed to mean!? I should not put my username and password when asked for it? *Confused*. I went to the link and it was clearer but not crystal. The authentification ignores the username and when they ask for a password, they really want the app key from the CLI so I followed this link and in order to find the app key you need the type in:

heroku auth:token

But remember, heroku and sudo go hand in hand.

1. get the ClI app key: sudo heroku auth:token
2. git push heroku master

Finish

If you want to see the finished product without going to heroku.com, type in the command:

sudo heroku open

My finished product is here:

https://cryptic-cliffs-42497.herokuapp.com/

Vera Worri

github: https://github.com/Vworri

website: vworri.github.io