One project, multiple sites! Plus a boost in upload speed!

Do you manage multiple Firebase Hosting sites? Do these sites share a single resource like a Firestore or Realtime database? Do you wish you could manage these sites from one place instead of having to create multiple projects? Do you wish that Firebase Hosting could deploy only the new or modified files? Wish no more! Because it’s all here!

Create multiple sites in one project

Firebase Hosting now allows you to create multiple sites inside of one Firebase project. If your admin site and blog site consume data from a shared Firebase resource, they can now both live in a single project - saving you time and developer resources. You can manage these sites directly in the Firebase Console and deploy via the command line.

Firebase automatically provisions a firebaseapp domain for you, which is the same as your Firebase project name. We currently do not support subdomains on the firebaseapp.com domain, but you can still provision subdomains on your own by connecting a custom domain for your sites. To get started with multiple sites, you’ll need to be on the Blaze plan. Once you’re on the Blaze plan you’ll be able to add multiple sites inside of the Firebase Console.

Configure targets for multiple sites in firebase.json

To help switch between different sites in a single project we introduced a new configuration setup in firebase.json. Make sure you update to the latest version of the Firebase CLI!

{
  "hosting": [ {
      "target": "blog",
      "public": "blog/dist"
    }, {
      "target": "app",
      "public": "app/dist"
    }
  ]
} 

The "hosting" config can now take in an array of site configurations. A single object still works if you still have just one site. Each configuration has a "target". The CLI uses this target to know what "public" folder to use for deploying assets. Speaking of the CLI! We have a new command for you.

Deploy from the CLI with targets

To manage switching between multiple sites in one project, we’re going to use the target:apply command. This command is a bit like the firebase use --add command except instead of linking the project to the alias, it establishes a link between the site and the target. The applied target can then be used with the firebase deploy and firebase serve commands.

The firebase use command is helpful for deploying to multiple projects. This is common for those who have a “staging” project versus a “production” project. For managing one site across different environments, we still recommend multiple projects for promoting best practices of each environment having its own set of Firebase resources.

However, managing multiple sites is a different problem. The CLI now has to know about multiple sites instead of just one. The CLI must know:

  • The name of the specific site
  • Where the assets of this site are located
  • What project you wish to deploy this site to

This why we introduced target:apply for Hosting.

firebase target:apply hosting target-name site-name 

Let’s break down this command.

  • firebase - the Firebase CLI module
  • target:apply - the command to link the site to the target
  • hosting - the Firebase resource type of the target
  • target-name - the target name specified in firebase.json. You could use "blog" or "app" as in the example config above.
  • site-name - the name of the site you want the target associated with

Let’s say you wanted to deploy your blog using the example firebase.json above:

firebase target:apply hosting blog my-cool-blog
firebase deploy --only hosting:blog 

In this command, we first identified the target-name of "blog", then associated it with the targeted site “my-cool-blog”, and finally deployed to that target. If you don’t specify a target in your firebase deploy or firebase serve commands, then all your targets will be deployed, or served locally on different ports, respectively. Note that you only have to define your targets once per project.

Your uploads just got a bit faster, and in some cases a lot faster

If you updated the Firebase CLI recently, you might have noticed that your uploads got a bit faster. You may have also noticed a new .firebase folder in your project. That’s because we rolled up a new deployment system that we call Delta Uploads.

This new system only processes new, modified, or deleted files. You know, the delta. This means any files that are unchanged aren’t uploaded when you run firebase deploy. You may not notice a big improvement in performance if your site is only a few files. However, it will make a huge difference for sites with a large amount of existing unmodified assets.

Give it a try today!

Check out the official documentation and make sure to update your CLI! Both multi-site and delta uploads features require the latest version of the Firebase CLI. Make sure you’re either above or at version 4.2.0 to use these features. Happy deploying!