Lab Homework 9
Deploying Your React App to the Web!
Deploying your App
Developing locally, testing and then deploying to a place where you can serve the application to a broader audience is generally best practice when it comes to professional (production) application development.
Right now, notice how the URL for your application is localhost:3000? This means that it’s running locally on your computer (on port 3000). Many times, it can be extremely helpful to deploy your React app somewhere where others can interact with it.
For this homework, we’re going to use a cloud platform called Heroku. This service will host our React app environment for us, and give us a URL we can visit. There are a TON of other ways we can host our application, but Heroku is fast, free and integrates well with our source control methods (git).
INSTRUCTIONS
- Create an account on Heroku.com
2. Download and install the Heroku CLI for your OS
https://devcenter.heroku.com/articles/heroku-cli
3. Make sure you are in your madlib application’s directory and type the following into the terminal.
$ git init$ git add .$ git commit -m “my first React application deployment.”$ heroku login(Enter your Heroku credentials.)$ heroku create
$ git push heroku master
4. Here’s what we did:
- We initialized source control (
git) for our applications root directory (git init) - We added all the files and directories except those specified in the .gitignore file (
git add .) - We made our first commitment and gave it a message (
git commit -m “my first React application deployment.”) - We logged into Heroku and created a new app
- We pushed our commitments to heroku on the master branch (
git push heroku master)
5. When you ran $heroku create the Heroku CLI create an app for you and gave you a URL and a git repository. Go copy the URL and open it in a browser!
6. Post your URL to the #Lab-9 Slack Channel
