Deploy React App to firebase

3 min readJan 1, 2021

Deploy to firebase is very easy.
Prerequisite
1. A firebase project. If you don’t have create it from Firebase Console
2. Add the web app to the project and copy the “Firebase SDK snippet” on your App.js
3. A react app. If you have not created yet create React App by
npx create-react-demo-firebase-hosting

4. Add firebase to your project
npm install firebase — save

Lets start

Step 1 (Install firebase tools)
Navigate to the project folder and open terminal and install firebase tools

npm install firebase-tools -g

Step 2 (Login to Firebase)
Login to firebase using below command

firebase login

This will ask for permission. Give the permission and add it will open the browser to authenticate. After successful authentication it will give success message in the terminal

Step 3 (Initialize firebase)
Now after login initialize firebase in your app using below command

firebase init

You will get first question “Are you ready to proceed?”
type Y

Next you will get the prompt with “Which Firebase CLI features do you want to set up for this folder?”
Select the “Hosting: Configure and deploy Firebase Hosting sites” by space key and then hit enter to proceed

Then you will prompt to select project. As we have already a project exist in firebase so select the “Use an existing project” and hit enter key

Again next you will be get all the list of project. Select the project by hitting the enter key

Again next you will prompt “What do you want to use as your public directory?”
Add public directory name “build”. By default react app generate a default build folder which contains all the production assets. You can change the default configuration. But we will for now go with the default name

Next you will be prompt with “Configure as a single-page app (rewrite all urls to /index.html)?” type y and hit enter key

Next you will be prompt with “Set up automatic builds and deploys with GitHub?” type N and hit enter