Deploy React Application to Google Firebase 🔥

Let’s start deploying React app to firebase.

1st step

you have to setup a firebase project. You can setup a firebase project from firebase console.

The firebase project which I have created

2nd step

Now we need to get ready our React App for deployment.

npm run build

by running the above command we can create abuild directory with a production build of our app.

3rd step

We need to Configure Firebase. To host our site with firebase , We need firebase command-line tool. by running following command we can install firebase CLI globally in your machine.

npm install -g firebase-tools

4th step

Okay, Now we have install Firebase CLI globally, now we need to login to firebase. but for this we have to be in root directory of our react app. Run following command.

firebase login

if you are not logged in this will generate a link and you can login to firebase using that link.

5th step

After logged into firebase , we need to initiate the project. for that run following command.

firebase init

Now you can see question list. From this list let’s select following option.

Hosting: configure files for firebase hosting and (optionally) set up Github action deploys.

Then select Use an existing project

Select the project that you wish to host with firebase.

As the public directory select the build folder which we created by running npm run build.

Select whether or not you need your firebase app to be configured as a single-page app. I have selected No.

after configuring these settings now we are ready to deploy the app.

6th step

Deploy to Firebase

Just run the following command to deploy your app:

firebase deploy

Now firebase will run its deploying process and after completing the process it will give you a unique url.

In my case, Its : https://ty-weather-app.web.app

Now you have hosted your react app in firebase. 🙌🏻

Refer to the hosting section of the firebase docs for more information. :)