Short answer: deploy to Firebase Hosting first, add the custom domain in the Firebase console, create the A and TXT records it shows you, wait for SSL provisioning, then set production environment secrets and redeploy.

Why deploy before configuring the domain?

Firebase needs an existing hosting site before it can attach a domain. If you skip straight to DNS, you end up editing records for a target that does not exist yet.

Do the free web.app deploy first, confirm the app loads there, and only then start the domain work. If the app is broken on the default URL, it will be broken on yours too.

How do you connect DNS to Firebase Hosting?

1. In the Firebase console, open Hosting and click Add custom domain.
2. Enter your domain, for example app.example.com. Use a subdomain rather than the bare apex if you can.
3. Firebase shows two A records for the apex or a CNAME for a subdomain, plus a TXT record for verification.
4. Add those records at your registrar exactly as shown.
5. Return to the console and click Verify. Propagation is usually minutes but can take up to 24 hours.

The TXT record proves ownership. If verification fails, it is almost always a typo in the record name or a proxy setting on your DNS provider that strips the record.

How long does SSL take?

Once verification passes, Firebase provisions a managed TLS certificate automatically. This takes from a few minutes to a few hours, occasionally up to 24. You do not need to buy a certificate.

In the meantime the domain shows a certificate warning. That is expected, not a sign you did something wrong.

What usually breaks the first deploy?

Environment variables. Anything reading from process.env at build time needs to be present in the Firebase environment, not just in your Studio workspace settings. This is the single most common cause of “works in Studio, blank page in production.”

The second most common is the wrong build output directory — Firebase expects out for static Next.js exports or public for plain static sites. Check firebase.json matches what your framework actually produces.

Third: client-side routing breaks on refresh because there is no rewrite rule to index.html. Add a rewrite in the hosting config and redeploy.

Who should bother with a custom domain?

Anyone shipping to real users. A web.app URL is fine for a demo but reads as unfinished for a product, and some email providers treat it as suspicious.

If you are prototyping, skip all of this — the default URL is free, instant, and gets you feedback faster. Add the domain when the app earns it.

Quick Summary

• Deploy to the default web.app URL before touching DNS.
• Add A or CNAME records plus the TXT verification record, then click Verify.
• SSL is managed and free, but provisioning can take up to 24 hours.
• Missing production environment variables are the top cause of blank deploys.
• Add a rewrite to index.html if client-side routes 404 on refresh.

Short answer: sign in at firebase.studio with a Google account, create a workspace from a template or a prompt, let the agent scaffold the app, then click Publish to deploy to a live Firebase URL. No local setup needed.

What is Firebase Studio?

It is a cloud IDE running on a remote VM. You open a browser, and you get a full Node or Python environment with a terminal, editor, preview pane, and AI agents. Because everything runs remotely, a Chromebook works as well as a workstation.

The AI layer is Gemini-based. There are agents for prototyping from a description, for coding inside a file, and for fixing errors from the console. Workspaces run on 2-core or 4-core VMs depending on the plan.

How do you create your first workspace?

1. Go to firebase.studio and sign in with Google.
2. Choose “Create a workspace” and pick a template — Next.js, React, Flutter, or a blank one.
3. Or switch to Prototyping Agent and describe the app you want.
4. Wait for the VM to provision; first load takes one to two minutes.
5. Use the preview pane on the right to see the running app.

The prototyping agent generates a full app from a paragraph — screens, routing, and basic data. It is quick for demos and rough for anything with real business logic.

Is Firebase Studio free?

Yes, with limits. The free tier includes three workspaces and access to Gemini agents on a rate-limited basis.

Hosting on Firebase itself has its own Spark (free) and Blaze (pay-as-you-go) tiers, so a deployed demo can stay at zero cost until traffic picks up.

How do you deploy from Studio?

Deployment is one button. Studio detects your framework and configures the build automatically, then publishes to Firebase Hosting and returns a live URL.

If you need a custom domain, add it in the Firebase console after the first deploy. Backend services — Firestore, Auth, Cloud Functions — connect through the Firebase project linked to your workspace.

One caveat: Studio works best when the app is already Firebase-shaped. Bolting on an external database is possible but you lose the one-click conveniences that make Studio appealing.

What are the downsides?

Cold starts. An idle workspace takes time to wake, which is irritating when you want to make a one-line fix. The cloud VM also feels slower than a local machine for large builds.

Vendor coupling is the other issue. Templates and deployment assume Firebase, so moving to AWS later means rewriting the hosting and data layers.

Firebase Studio suits solo developers, students, and teams standardizing on Google Cloud. If your stack is AWS-first or you need a powerful local machine for heavy compiles, a local IDE remains the better choice.

Quick Summary

• Firebase Studio is a browser-based cloud IDE with Gemini coding agents.
• The free tier includes three workspaces, no credit card required.
• Prototyping agents scaffold a full app from one paragraph.
• Publishing deploys to Firebase Hosting with a live URL in minutes.
• Idle workspaces cold-start slowly and the stack is tightly coupled to Firebase.