Firebase Studio: An Honest Review With Examples

Firebase offers a powerful suite of tools that covers everything you need in order to build modern web and mobile apps. It is a popular name in the developer world and has long been the go-to backend for startups, with great features like authentication, cloud storage,  real-time databases and serverless functions.

Google is now taking things a step further with Firebase Studio, a new AI-powered development environment designed to help go from idea to MVP in minutes. Similarly to Replit and Lovable, Firebase Studio makes it possible to build full-stack apps using just a prompt.

In this article, we’ll explore what Firebase Studio is and how it works. I’ll show you how I used it to build an IoT dashboard from scratch and share my first impressions!

We keep our readers updated on the latest in AI by sending out The Median, our free Friday newsletter that breaks down the week’s key stories. Subscribe and stay sharp in just a few minutes a week:

What Is Google’s Firebase Studio?

Firebase Studio is Google’s new AI-powered development tool that allows you to build full-stack apps using natural language prompts. 

It’s actually the evolution of Project IDX, a cloud IDE that Google launched in 2023. Project IDX focused on being a general-purpose cloud IDE with AI support, but the rebrand to Firebase Studio narrows its focus to optimize the experience for Firebase developers. It takes the best parts of IDX, like the Code OSS editor, AI assistant, and cloud-based environment, and adds integrations with Firebase services like Firestore, Auth, Hosting, and Cloud Functions.

Firebase Studio was announced during Firebase’s 2024 rebrand, and it’s Firebase’s answer to the growing wave of “AI-native” dev tools.

How to Access Firebase Studio

You can try Firebase Studio right now by heading to studio.firebase.google.com. All you need is a Google account. Once you're in, you can type a prompt describing the app you want to build and Firebase Studio will generate a ready-to-run project using Firebase’s tools under the hood. 

Firebase Studio Pricing

Firebase Studio is free to use during its preview period. By default, you can create up to 3 workspaces at zero cost. However, some integrated services like Firebase App Hosting or exceeding the free quota for the Gemini API will require linking a billing account and can incur charges. Your Firebase project will automatically upgrade to the Blaze (pay-as-you-go) plan, and you'll be billed for any usage beyond the free quotas.

That said, if you plan on using Firebase Studio mostly for prototyping and development tasks, you should remain within the free workspace limits and be able to explore Firebase Studio without incurring any costs.

Test 1: IoT Dashboard App From Prompt

I first decided to test the app generation from a prompt. When testing AI-powered app-building tools, I like to use a somewhat complex prompt to really test the tool’s behavior. A to-do list app usually turns out great but a slightly more complex app really highlights the areas the tool is good at and the ones it struggles in.

So, my prompt was the following:

After pressing the “Prototype with AI” button and waiting a minute or so, I was still staring at a blank screen.

Refreshing the page didn’t do much, so I decided to delete the workspace and try again. This time, I got shown a plan for my app:

I was pretty impressed by the fact that it had generated some style guidelines that I could edit (for example, I could change the colors by simply clicking on them). 

However, if you look at the feature section, you can see that it dropped the Cloud Function and Firestore requirements that I specified in my prompt. Anyway, I decided this was close enough and went along with the plan, curious to see the result. This is what the next screen showed me:

At this point, I was a little underwhelmed by the result. The UI was very basic, and there was, in fact, no user authentication at all.

I started testing the different buttons and functionality of the prototype screen. 

Clicking on the top right button of the app UI opens the app in a new tab. The next button on the left allows you to share a preview link. Pretty useful. The leftmost button on the UI opens a component selector—more on that in a bit.

Clicking on the squiggly orange button on the left of the chat input opens an interesting “drawing” menu.

I was able to draw a rectangle around a sensor card and specify that I wanted to see the status of said sensor. Indeed, turning it on and off makes little sense if I don’t know what state it currently is in. 

It did add a status property on both sensor cards, which is updated based on the button clicked.

I tried adding a new kitchen sensor through the UI, which worked fine.

However, that new sensor didn’t persist after a refresh, which was a little disappointing.

At that point, I wanted to have a look at the code. I clicked the code icon on the top right of the Firebase Studio screen, next to the blue “Publish” button. I was quite happy to see an online code editor pop up. It is quick enough, looks great, and has a Gemini feature built-in. Opening the source control started scanning for Git repositories.

And it looked like it had found one and was waiting for me to publish the branch I was on.

I thought it was a little strange, so I decided to click on “Publish Branch.”

Sure enough, I wasn’t signed in, and that was just a quirk of the editor. In any case, I did appreciate the ability to sign in to GitHub straight through the online editor.

What I really wanted to see was the ability to integrate with the Firebase suite of tools. I went back to the prototype tab and asked in the chat to integrate with Auth and Cloud Functions to mock sensor data.

It complied and gave me a Login screen, but immediately failed with some errors.

One of the errors, as can be seen on the screenshot above, stemmed from the fact that the code was attempting to fetch from a Cloud Function that didn’t exist, as it hadn’t been created at all in the code. Clicking the “Fix Error” a few times yielding nothing.

I navigated back to the code tab, and had to prompt the Gemini assistant a few times for it to agree to create Cloud Function code, and not just a regular function. It then added that it couldn’t deploy it for me, but could help me with the steps to do that. Fair enough.

As the chat interface didn’t seem very good at solving logic problems, I wondered if it could perhaps solve UI ones better. I asked it to make the login page UI more exciting by adding images themed around data and analytics. That also yielded no change at all, despite the chat showing it was changing a few files.

The last feature I wanted to try was the app publishing. Clicking the big “Publish” button on the top right opens a side panel, with steps to publish the app.

I decided to create a billing account, and automatically move to the Blaze plan so I could publish the app with Firebase App Hosting. The link in the side panel redirects to the Google Cloud console, in which I was prompted to create a billing profile. Once I clicked confirm, I was redirected to a “URL not found” page on GCP. 

Going back to my Firebase Studio tab, I could now see a “Waiting for billing account from Cloud Console” message. I waited a few minutes and refreshed several times, and ended up being able to select my billing account and publish my app.

This concluded my “app generation from a prompt” test. My first thought was that it had perhaps been a little more difficult with Firebase Studio than with other tools I have used before.

Now, on to the second test.

Test 2: Generating a Project From a Template

While Firebase Studio offers app generation from a prompt, it also allows the creation of apps through templates.

On the Firebase Studio homepage, clicking on one of the little framework or language icons under the “Start coding an app” section opens a new screen. I chose to create a Node Express API Server called “My Node App” and use TypeScript to do so.

After a few seconds, the resulting server appeared in the online code editor. No prototype tab here, but it makes sense given this is backend code.

This time around, opening the source control tab gave me the opportunity to initialize a new Git repository.

This template only exposed a basic “hello world’ endpoint, but it had all the code and boilerplate needed to start coding a NodeJs + Express API. 

First Impressions and Thoughts on Firebase Studio

Overall, Firebase Studio is a good step into the world of AI-assisted development, but one that still feels very much in beta.

The idea of going from a single prompt to a working app with a visual prototype, live preview, editable components, and styling controls is super exciting. There were also some thoughtful little touches, like being able to change colors by clicking directly on a palette or drawing on the prototype to ask for changes.

The built-in code editor was also a nice surprise: it looks good, runs smoothly, and comes with Gemini and GitHub support out of the box, which made playing around with the code pretty straightforward. It is definitely as good as some other online code editors I have tried in the past.

However, I ran into quite a few frustrating issues. Prompt-based generation felt hit-or-miss: features I explicitly asked for (like Cloud Functions, Auth, and Firestore) were dropped, and when I asked for them again later, the system partially implemented them but left broken functionality and unresolved errors.

The UI it generated was quite basic, and my requests to add background images were ignored. After insisting multiple times, all I got was a gradient of colors in the background. I also ran into some quirks around publishing and setting up billing, which made the whole process feel a bit clunky.

Template-based app creation went better. The Node.js backend template gave me a well-structured and clean codebase that I could start working on immediately. That felt a lot more reliable and developer-friendly.

To be totally fair, I didn’t get around to testing everything, and it’s clear the tool is still evolving. I’ve seen others mention that it works better with simpler use cases or more structured prompts, so I might try that next time.

Right now, Firebase Studio feels like a sneak peek at what AI-first development could become. It’s not quite ready for prime time, especially compared to tools like Replit, Lovable, Bolt, or v0, but it’s an exciting space to watch.

Conclusion

Firebase Studio has some genuinely exciting ideas, but I don’t think it is ready to build production-ready apps on its own just yet. If you're curious about AI-assisted development or want to explore what's coming next, it's definitely worth a play!