This documents provides a brief command sequences and code that can get you started with Google Firebase.
Firebase uses command line tools to perform upload
, test
and deploy
actions.
The common command line tools come as npm
packages.
sudo npm install -g firebase-tools
In order to start working with Firebase one needs to make sure that
the CLI
is logged-in. Means, the CLI
has permissions to work with
your google account.
Here is a snapshot:
$ firebase login
i Firebase optionally collects CLI usage and error reporting information
to help improve our products. Data is collected in accordance with Google's
privacy policy (https://policies.google.com/privacy) and is not used to
identify you.
? Allow Firebase to collect CLI usage and error reporting information? No
Visit this URL on this device to log in:
https://accounts.google.com/o/oauth2/auth?client_id=....
Waiting for authentication...
Copy the URL shown in your browser and provide the required Permissions.
It would show a Firebase CLI Login Successful message.
And in the command line it would show:
Waiting for authentication...
✔ Success! Logged in as youremail @gmail.com
$
This means you are ready to use the Firebase commands in CLI
.
In case you have already logged-in the CLI
- you can also logout.
firebase logout
We can easily host a static website here are the commands :
$ firebase init
######## #### ######## ######## ######## ### ###### ########
## ## ## ## ## ## ## ## ## ## ##
###### ## ######## ###### ######## ######### ###### ######
## ## ## ## ## ## ## ## ## ## ##
## #### ## ## ######## ######## ## ## ###### ########
You're about to initialize a Firebase project in this directory:
/home/user/....
? Which Firebase CLI features do you want to set up for this folder? Press
Space to select features, then Enter to confirm your choices. (Press <space> to
select, <a> to toggle all, <i> to invert selection)
❯◯ Database: Deploy Firebase Realtime Database Rules
◯ Firestore: Deploy rules and create indexes for Firestore
◯ Functions: Configure and deploy Cloud Functions
◯ Hosting: Configure and deploy Firebase Hosting sites
◯ Storage: Deploy Cloud Storage security rules
◯ Emulators: Set up local emulators for Firebase features
Use Up and Down Arrow Keys to go between the choices and press Space bar to select.
Here you need to select Hosting since we just what to host a few pages.
Press Enter Key to Proceed after the particular option has been checked.
? Which Firebase CLI features do you want to set up for this folder? Press
Space to select features, then Enter to confirm your choices. Hosting:
Configure and deploy Firebase Hosting sites
=== Project Setup
First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add,
but for now we'll just set up a default project.
? Please select an option: (Use arrow keys)
❯ Use an existing project
Create a new project
Add Firebase to an existing Google Cloud Platform project
Don't set up a default project
Now you have choice.
-
You can either go for an existing project already created in Firebase Console
-
You directly create a new project here
-
You can also use Google Cloud Platform project part of GCP.
In most cases the first 2 options are better.
In my case I selected a project that I had already created in the Firebase Console.
? Which Firebase CLI features do you want to set up for this folder? Press
Space to select features, then Enter to confirm your choices. Hosting:
Configure and deploy Firebase Hosting sites
=== Project Setup
First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add,
but for now we'll just set up a default project.
? Please select an option: Use an existing project
? Select a default Firebase project for this directory: (Use arrow keys)
❯ project-1 (Project-1)
project-2 (Project-2)
Next, Choice of project. You would be given a list of your existing projects. You can scroll using Up and Down Arrow keys and Enter Key to select.
=== Project Setup
First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add,
but for now we'll just set up a default project.
? Please select an option: Use an existing project
? Select a default Firebase project for this directory: project-1 (Project-1)
i Using project project-1 (Project-1)
=== Hosting Setup
Your public directory is the folder (relative to your project directory) that
will contain Hosting assets to be uploaded with firebase deploy. If you
have a build process for your assets, use your build's output directory.
? What do you want to use as your public directory? (public)
? Configure as a single-page app (rewrite all urls to /index.html)? (y/N) N
Next, most of the options can be used as defaults now.
Just make sure that you select N
for the single-page app question.
Since we can have multiple static pages that need to be served.
This would complete the setup.
=== Hosting Setup
Your public directory is the folder (relative to your project directory) that
will contain Hosting assets to be uploaded with firebase deploy. If you
have a build process for your assets, use your build's output directory.
? What do you want to use as your public directory? public
? Configure as a single-page app (rewrite all urls to /index.html)? No
✔ Wrote public/404.html
✔ Wrote public/index.html
i Writing configuration info to firebase.json...
i Writing project information to .firebaserc...
i Writing gitignore file to .gitignore...
✔ Firebase initialization complete!
You project is now ready. You can modify the public/index.html
.
Add your HTML
, CSS
and Javascript
files as needed to this public
directory to host.
To Deploy just give the command:
$ firebse deploy
=== Deploying to 'project-1'...
i deploying hosting
i hosting[project-1]: beginning deploy...
i hosting[project-1]: found 2 files in public
✔ hosting[project-1]: file upload complete
i hosting[project-1]: finalizing version...
✔ hosting[project-1]: version finalized
i hosting[project-1]: releasing new version...
✔ hosting[project-1]: release complete
✔ Deploy complete!
Project Console: https://console.firebase.google.com/project/project-1/overview
Hosting URL: https://project-1.firebaseapp.com
You can now browse the published copy of the website on the Hosting URL listed.