↑ ↓ navigate↵ selectesc close

What web frameworks does Firebase App Hosting support?: Web Architecture & Implementation Guide

CodingCat.dev tutorial cover image
Alex Patterson
Alex Patterson

Deploying server-rendered Next.js, Angular, or Astro apps alongside Firebase used to require stitching together custom Cloud Functions rewrites or managing separate Cloud Run containers by hand. Following the announcement of What web frameworks does Firebase App Hosting support? by Jeff Huleatt on the Official Firebase Blog (2025-06-05), here is our hands-on CodingCat.dev breakdown of what actually shipped, how it works under the hood, and how we wire it into production TypeScript, Next.js, Astro, SvelteKit, React, and Angular applications. Firebase App Hosting, a serverless web hosting service built for modern, full-stack web apps, recently graduated to General Availability with headline support for Angular and Next.js. However, there are a lot more JavaScript frameworks out there. Can we deploy them to App Hosting?

The Mental Model: Why What web frameworks does Firebase App Hosting support? Matters for Web Devs

As a Google Developer Expert (GDE) for Firebase and Senior Solutions Engineer at CodingCat.dev, I evaluate every Firebase update through one lens: does it reduce boilerplate while keeping our runtime security and cloud bills predictable? Firebase App Hosting automates Git-driven Cloud Build pipelines, Cloud Run scaling, CDN caching, and Secret Manager integration so full-stack SSR frameworks run natively on Google Cloud infrastructure.

AJ Pro-Tip from Alex: Set explicit maxInstances and concurrency limits in your apphosting.yaml file and cache public SSR responses at the CDN edge so traffic spikes do not trigger unnecessary Cloud Run cold starts.

How It Works: Technical Breakdown & Implementation

Note: This post focuses on frameworks that are compatible with the App Hosting build process, where App Hosting automatically builds and deploys your web app either from a push to git or from the Firebase CLI. Alternatively, you can build containers yourself and use App Hosting’s Terraform support to deploy to an App Hosting backend. Building the containers yourself means you could deploy any web server with any language, like .NET, Go, or Python. That’s a topic for another blog post, though.

Angular and Next.js

First, a quick recap: App Hosting has pre-configured build and deploy support for Angular and Next.js web apps. These are maintained by the App Hosting team, and have a documented support schedule.

When you use a supported version of either framework, App Hosting builds and deploys your web app without any extra work required. There are also docs for supported package managers and monorepo tooling.

Community-supported frameworks

In addition to built-in Angular and Next.js support, App Hosting documents the expected output of a build system so that any framework can create an adapter to deploy to App Hosting. The full list of community adapters is available at firebaseopensource.com.

Nitro is the server toolkit that powers SSR functionality for lots of frameworks. We’ve collaborated with the Nitro team on a community adapter to make App Hosting a Zero-Config Provider, which means that Nuxt, TanStack Start (following the Nitro deployment guide), SolidStart, and Analog will all work without any extra configuration.

We also have a proof-of-concept community adapter for Astro in the works. To use it, first install the adapter:

Then, update your Astro config file to reference the adapter:

import
import

export
    output: 
    adapter: 
        mode: 
    }),
});

App Hosting looks for a.apphosting/bundle.yaml file that lets you tell App Hosting what commands should be used for build and run, where your framework’s build artifacts are, and what specific Cloud Run settings are needed to run your framework. That way, developers using your framework don’t need to do any extra work to deploy their web apps. As we add features to App Hosting, adapters will get more valuable.

If you’re a framework author curious about the output bundle spec, here’s a sample:

version
runConfig
    runCommand
    environmentVariables
        - 
          value
          availability
    concurrency
    cpu
    memoryMiB
    minInstances
    maxInstances

outputFiles
    serverApp
        include
            - 
            - 

metadata
    adapterPackageName
    adapterVersion
    framework
    frameworkVersion

…any framework?

Here’s the thing. When App Hosting doesn’t recognize your framework, it falls back to the Node.js Cloud buildpack, which knows how to build all kinds of Node projects. That means that, even without a specific adapter, your app can work on App Hosting.

Most JavaScript frameworks will work on App Hosting with minimal extra configuration.

The Node.js buildpack takes the following steps to build and run your app:

In Cloud Build, the buildpack checks your package.json for a build or apphosting:build script. Some kind of build script is required - if not, the build will fail.

In Cloud Run, the buildpack tries quite a few things to start the server for your web app. If you have any of the following, you’ll be able to deploy your app on App Hosting:

The buildpack actually tries even more than this, but the above is most relevant to App Hosting. You can view the buildpack source code for build and run if you’re curious.

You’ll also need to modify your server code to listen on the correct port with the PORT environment variable that is automatically injected.

Let’s see how these rules let us deploy different frameworks:

SvelteKit is supported by the Node.js buildpack with no extra configuration.

Following the standard React Router quickstart is all you need to do, since that includes a build script as well as a start script with a built-in production server:

Express is still a popular way to host static websites or API servers. As long as there is an npm build and start script, we’re set. Here’s an example for a “hello world” Express server:

import

const
// PORT env var is set by Cloud Run
const

app.
  res.
});

app.
  console.
});
{
    "
    "
    "
    "
    "
        "
        "
    },
    "
        "
    }
}

Note the build script that just prints “no-op build script” - there needs to be something there for a successful App Hosting build. If you wrote your server with TypeScript, you could run your TypeScript build here.

The default Hono Node.js template has a build and run command, which is a great start.

The only thing we need to modify is the port that the server listens on:

import
import

const

app.
    return
});

serve
    fetch: app.fetch,
    // PORT env var is set by Cloud Run
    port: process.env.PORT 
},
    (info) 
        console.
    },
);

The main difference between using frameworks that don’t have an official or community adapter is that adapters may have specific tuning of Cloud Run instances to best suit the framework, or special environment variables that enhance framework functionality.

Instead, you can set these yourself:

Static web apps (SPAs)

We still recommend the original Firebase Hosting for static web apps. However, if you’d like to deploy a static web app to App Hosting, you certainly can with the help of a static server like superstatic or serve to run in your App Hosting backend. It takes two steps in the command line:

npm

# Replace <your folder here> with the folder
# that contains static assets, commonly "public".
# The $PORT environment variable is set automatically by Cloud Run.
npm

Here’s an example of a static single-page app (SPA) built with React, TypeScript, and Vite from the react-ts Vite template:

Running these commands will result in this package.json file:

{
    "
    "
    "
    "
    "
        "
        "
        "
    },
    "
        "
        "
        "
        "
    },
    "
        "
        "
        "
    }
}

The $PORT environment variable is set by Cloud Run.

Since there is a build script and a run script, App Hosting will be able to deploy and serve your static React app.

Static content won’t change until your next rollout, so it is worth heavily caching content in Cloud CDN. Most static file servers should have settings for this.

In the case of superstatic, create a superstatic.json config file and reference it from your start script:

This example caches content for an hour (3600 seconds):

{
    "
        {
            "
            "
                {
                    "
                    "
                }
            ]
        }
    ]
}

It’s fine to set long cache timeouts because the CDN tags will be purged on every new rollout.

Use your favorite framework on App Hosting

While Angular and Next.js are the best-supported frameworks for App Hosting, we hope it’s clear that it’s ready for nearly any JavaScript-powered web app you’d like to build. If you’re a framework maintainer, you can make it even easier for developers to deploy to App Hosting by following the output bundle specification.

If you haven’t already, head over to the Firebase console and explore our documentation to deploy your first app. As always, if you have questions, you can hit us up on any of our support channels.

Production Web Architecture & Security Checklist

Whether we are deploying on Firebase App Hosting, Cloudflare Workers, or Vercel, shipping Next.js features to production requires defense-in-depth across three layers:

  • Enforce Firebase App Check & Attestation: Protect your web endpoints, Cloud Functions, Data Connect GraphQL resolvers, and Firebase AI Logic calls against unauthorized replay or billing abuse using Firebase App Check with reCAPTCHA Enterprise.
  • Validate Locally with the Firebase Emulator Suite: Run deterministic integration tests against local Firestore, Auth, Functions, and Data Connect PostgreSQL emulators before promoting schema or rule changes to production.
  • Keep Server & Client Boundaries Type-Safe: Use the modular Firebase Web SDK and generated TypeScript bindings so SSR frameworks like Next.js, Astro, SvelteKit, and Angular serialize state cleanly without hydration flickers.

Conclusion

Accelerate your full-stack web and AI development by pairing What web frameworks does Firebase App Hosting support? with strict Security Rules, Firebase App Check, and local emulator testing. Come tell us on X (@CodingCatDev) and LinkedIn (CodingCat.dev) how you are using Firebase in your stack, and subscribe to the CodingCat.dev YouTube Channel so you don't miss what we build next!

Watch Our Related Firebase Video Tutorial on YouTube

Want to see how we architect and debug Firebase web applications live? Watch our related CodingCat.dev session Firebase Security Rules: Effortless control over your app's data. below, and make sure to Subscribe to CodingCat.dev on YouTube for weekly full-stack web and AI deep dives:

Resources, Official Docs & Related CodingCat.dev Guides

Frequently Asked Questions (FAQ)

What are the key capabilities introduced in What web frameworks does Firebase App Hosting support??

What web frameworks does Firebase App Hosting support? (announced 2025-06-05 by the Firebase team) enhances the platform for Firebase, Google Cloud, Web Dev, Next.js, React, Angular, Svelte, TypeScript, Security, Serverless workloads. Firebase App Hosting, a serverless web hosting service built for modern, full-stack web apps, recently graduated to General Availability with headline support for Angular and Next.js. However, there are a lot more JavaScript frameworks out there. Can we deploy them to App Hosting? Developers can review the primary announcement on the Firebase Blog alongside our implementation patterns and production checklist above.

How do web developers use What web frameworks does Firebase App Hosting support? with Next.js, SvelteKit, React, or Angular?

Web developers can integrate these features using the modular Firebase JavaScript/TypeScript SDK, Firebase Data Connect web bindings, and Firebase App Hosting. Always pair client-side SDK initialization with Firebase App Check and strict Security Rules, and test locally with the Firebase Local Emulator Suite before deploying.

Where can I watch video tutorials on Firebase Web and AI development?

You can watch our hands-on Firebase video walkthroughs on the CodingCat.dev YouTube Channel, including Firebase Security Rules: Effortless control over your app's data., and follow us on X (@CodingCatDev) for weekly full-stack tutorials.