How to deploy your React app on Firebase?

Assuming you have created an account on Firebase, let’s move forward to creating the project on the Firebase console to the deployment of your React app on Firebase.

Create Firebase Project
Sign in to Firebase and move to console through the button “Go to console” present at the top right corner of the website. The console panel will open up. Tap on the “Add project” tab there and create the project with any desired name. The project overview window will open up as shown below.

Tap on the web icon, just beside the android icon present there. Register your app there with a suitable name. Tick the setup of Firebase hosting setup there.

Just tap Next on the further proceedings and move to Git Bash to your project directory. Run command:

$ npm install -g firebase-tools

Then you need to log in to firebase through your bash.

$ firebase login

Allow the asked permission by running y or yes. It will open the sign-in window. Just sign in there with your account. Coming back to bash. Run command:

$ npm run build

Then run the command:

$ firebase init

Answer the questions as mentioned below.

? Are you ready to proceed? Yes
? Which Firebase CLI features do you want to set up for this folder? Press Space to select features, then Enter to confi
rm your choices. Hosting: Configure and deploy Firebase Hosting sites
? Please select an option: Use an existing project
? Select a default Firebase project for this directory: mylinks-71d4a (mylinks)
? What do you want to use as your public directory? build
? Configure as a single-page app (rewrite all urls to /index.html)? Yes
? Set up automatic builds and deploys with GitHub? No
? File build/index.html already exists. Overwrite? No

These questions will be asked to you and you need to answer as given above. In the question “Select a default Firebase project for this directory”, choose the project which you created for the web app.

The next step is to deploy your app to firebase.

$ firebase deploy

Hola! Your React app is deployed to Firebase. You can get its link either from the Git Bash itself. It will show up there as “Hosting URL” ending with “.web.app” or in the project on Firebase, go to Hosting tab, there too you will find your app URL.

Now the question arises, how to update your already deployed app?
Follow the following steps:

1. Make and save changes in your react app.
2. Run the following commans:

$ npm run build
$ firebase deploy

This will update your deployed app.

Happy Learning!