Search Lessons, Code Snippets, and Videos
search by algolia
#native_cta# #native_desc# Sponsored by #native_company#

Deploying an Angular App to Firebase

Episode 1.2 written by Jeff Delaney
full courses and content on

Health Check: This lesson was last reviewed on and tested with these packages:

  • firebase-tools v3.18
  • angular v6

Find an issue? Let's fix it

You can host your Angular app anywhere and still take advantage of the Firebase backend, but nothing is easier than hosting it on Firebase directly. After some initial configuration, deploying updates to your app can be handled with a single command.

Building the Production Code

ng build --prod

Running the ng build command will compile and minify your code in a single package in the dist/ folder. You could drop the contents of this directory into virtually any static website hosting platform or even an S3 bucket and you’re site would be ready to serve traffic.

Deploying to Firebase


First, make sure you have the firebase tools package installed.

npm install -g firebase-tools

Second, log into your existing firebase account. You should have already created a firebase project for your production app. If not, create a new project now.

firebase login


Third, initialize the project. You will only need to go through this process once. Make sure you are in the top level directory of your angular app.

firebase init command for angular deployment You should see this after running firebase init from the command line.

firebase init

For the most part, you can stick with the default settings, except for the following questions:

  1. Choose hosting on the first question.

  2. Change public folder to dist/your-app-name when asked (it defaults to public).

  3. Configure as single page app? Yes

  4. If firebase asks to overwrite your index.html file, just say NO.


Finally, deploy the app.

firebase deploy

If all went well, your app should be alive and well on the firebase project URL.