Today I deployed a second site to a Firebase project. I have deployed sites individually on different Firebase projects but hadn’t realized that a single project could support multiple sites. This is specially useful if the various sites use the same assets (think internationalized versions of sites etc)
The documentation on multi-site support is actually pretty good. In my case, my “launchpage” project was completely different from the other site on the project but it does give me the opportunity to bring the two together later. It basically came down to modifying the firebase.json file to look like this:
{
"hosting": {
"target":"launchpage",
"public": "",
"ignore": ["firebase.json",/.", "/node_modules/*"]
}
}
This file tells the Firebase tools to ignore certain files and deploy others to hosting.
You can test your app locally by calling firebase serve and deploy to production by calling firebase deploy while in the project root.
The only hiccup I ran into is setting up DNS correctly. While Firebase tries to make it easy by giving you an IP address to point your domain to, Namecheap doesn’t work if you specify your domain name in the hosting panel and requires you to use @ to refer to the domain you are configuring. Subdomains similarly cannot be FQDNs and need to just be the name of the subdomain you are configuring (www instead of http://www.mysite.com for example)
Note that Firebase will occasionally request you to re-verify your domain. See the conditions why on this link or the screenshot below
Same rule applies for re-verification: Use the `@` key to add your custom TXT record needed to verify your domain
Considering how easy this was, this might be the way I host all my sites in the future 🙂
Code Zen 