> Canonical URL: https://codingcat.dev/post/firebase-2025-06-app-hosting-frameworks # What web frameworks does Firebase App Hosting support?: Web Architecture & Implementation Guide ![CodingCat.dev tutorial cover image](https://cdn.sanity.io/images/hfh83o0w/production/abbc622e6d0ff7c307da55103cc339a98b0c4394-1200x630.svg?w=1200&q=82&fit=max&auto=format)[![Alex Patterson](https://cdn.sanity.io/images/hfh83o0w/production/a606dfaa381aab08ddbe16a33fe1d3e1fb37c927-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Alex Patterson](/author/alex-patterson)June 6, 2025 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**](https://firebase.blog/posts/2025/06/app-hosting-frameworks/) (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**](https://g.dev/firebase/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**](https://g.dev/firebase/app-hosting-terraform-resources) 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**](https://g.dev/firebase/app-hosting-preconfigured-frameworks). These are maintained by the App Hosting team, and have a documented [**support schedule**](https://g.dev/firebase/app-hosting-nextjs-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**](https://g.dev/firebase/app-hosting-package-managers-monorepos). ### Community-supported frameworks In addition to built-in Angular and Next.js support, App Hosting [**documents the expected output of a build system**](https://g.dev/firebase/app-hosting-community-framework-adapters) so that any framework can create an adapter to deploy to App Hosting. The full list of community adapters is available at [**firebaseopensource.com**](https://firebaseopensource.com/platform/app_hosting). [**Nitro**](https://nitro.build/deploy/providers/firebase) 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**](https://nitro.build/deploy#zero-config-providers), which means that [**Nuxt**](https://nuxt.com/deploy/firebase), [**TanStack Start**](https://tanstack.com/start/latest) (following the [**Nitro deployment guide**](https://tanstack.com/start/latest/docs/framework/react/guide/hosting#nitro)), [**SolidStart**](https://start.solidjs.com/), and [**Analog**](https://analogjs.org/) will all work without any extra configuration. We also have a [**proof-of-concept community adapter for Astro**](https://github.com/FirebaseExtended/firebase-framework-tools/pull/297) 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**](https://github.com/FirebaseExtended/firebase-framework-tools?tab=readme-ov-file#app-hosting-output-bundle), 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**](https://g.dev/cloud/buildpacks-app-hosting-frameworks), 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**](https://github.com/GoogleCloudPlatform/buildpacks/blob/17165a4156e95e2e9eb55ab631190d2d042e9954/pkg/nodejs/npm.go#L150) and [**run**](https://github.com/GoogleCloudPlatform/buildpacks/blob/17165a4156e95e2e9eb55ab631190d2d042e9954/pkg/nodejs/npm.go#L212) if you’re curious. You’ll also need to modify your server code to [**listen on the correct port**](https://g.dev/cloud/run-port-contract-app-hosting-frameworks) with the `PORT` environment variable that is automatically injected. Let’s see how these rules let us deploy different frameworks: [**SvelteKit**](https://svelte.dev/docs/kit/introduction) is supported by the Node.js buildpack with no extra configuration. Following the standard [**React Router quickstart**](https://reactrouter.com/start/framework/installation) 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**](https://expressjs.com/) 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**](https://hono.dev/) 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: - [**Configure Cloud Run service settings**](https://g.dev/firebase/app-hosting-cloud-run-settings) ### Static web apps (SPAs) [**We still recommend the original Firebase Hosting for static web apps**](https://firebase.blog/posts/2024/05/app-hosting-vs-hosting). 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**](https://www.npmjs.com/package/superstatic) or [**serve**](https://www.npmjs.com/package/serve) to run in your App Hosting backend. It takes two steps in the command line: ``` npm # Replace 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**](https://g.dev/firebase/app-hosting-cdn-caching). 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**](https://firebase.blog/posts/2025/06/app-hosting-frameworks/#a-note-for-framework-authors). If you haven’t already, head over to the [**Firebase console**](https://g.dev/firebase/app-hosting-console-frameworks-guide) and explore our [**documentation**](https://g.dev/firebase/app-hosting-introduction) to deploy your first app. As always, if you have questions, you can hit us up on any of our [**support channels**](https://firebase.google.com/support). ## Production Web Architecture & Security Checklist Whether we are deploying on [**Firebase App Hosting**](https://firebase.google.com/docs/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**](https://firebase.google.com/docs/app-check). - **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)**](https://x.com/CodingCatDev) and [**LinkedIn (CodingCat.dev)**](https://www.linkedin.com/company/codingcatdev) how you are using Firebase in your stack, and subscribe to the [**CodingCat.dev YouTube Channel**](https://www.youtube.com/@CodingCatDev?sub_confirmation=1) 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.**](https://youtu.be/wGbEM0CXMuI) below, and make sure to [**Subscribe to CodingCat.dev on YouTube**](https://www.youtube.com/@CodingCatDev?sub_confirmation=1) for weekly full-stack web and AI deep dives: ## Resources, Official Docs & Related CodingCat.dev Guides - **Primary Release Source: ** [What web frameworks does Firebase App Hosting support? on the Official Firebase Blog](https://firebase.blog/posts/2025/06/app-hosting-frameworks/) (published 2025-06-05 by Jeff Huleatt) - **Official Firebase Documentation: ** [Firebase Developer Docs & Web SDK Reference](https://firebase.google.com/docs/web/setup) - **Related on CodingCat.dev: [Firebase Studio: Tips and Tricks](/post/firebase-2025-05-studio-tips-tricks)** - **Related on CodingCat.dev: [Server Value Expressions for Data Connect](/post/firebase-2025-06-dataconnect-server-values)** - **Related on CodingCat.dev: [Firebase SQL with Data Connect](/podcast/firebase-sql-with-data-connect)** - **Related on CodingCat.dev: [Build a Custom No-Code App in 90 Minutes](/podcast/build-a-custom-no-code-app-in-90-minutes)** ## 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**](https://firebase.blog/posts/2025/06/app-hosting-frameworks/) 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**](https://firebase.google.com/docs/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**](https://www.youtube.com/@CodingCatDev?sub_confirmation=1), including [**Firebase Security Rules: Effortless control over your app's data.**](https://youtu.be/wGbEM0CXMuI), and follow us on [**X (@CodingCatDev)**](https://x.com/CodingCatDev) for weekly full-stack tutorials. ## Recent Posts [View More](/blog/page/1)[![PHP2Shell (CVE-2026-109618): How AI Found a Decade-Old Bug in 70% of the Web](https://cdn.sanity.io/images/hfh83o0w/production/e83065d0a4e2f841ce64d3f4aea8ddbbf07e5cb9-1376x768.jpg?w=1376&q=82&fit=max&auto=format)](/post/php2shell-cve-2026-109618-ai-php-security-scramble) ### [PHP2Shell (CVE-2026-109618): How AI Found a Decade-Old Bug in 70% of the Web](/post/php2shell-cve-2026-109618-ai-php-security-scramble) October 22, 2026 Two critical pre-authentication RCE flaws in PHP (CVE-2026-109618 and CVE-2026-109619), uncovered by AI models from OpenAI and Google Gemini, sparked a global patching scramble across 70% of the web. Here is how PHP2Shell works and how to patch your servers. [![Alex Patterson](https://cdn.sanity.io/images/hfh83o0w/production/a606dfaa381aab08ddbe16a33fe1d3e1fb37c927-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Alex Patterson](/author/alex-patterson)[![Sanity Knowledge Bases](https://cdn.sanity.io/images/hfh83o0w/production/38b0f021c51d97043c8a1ebf31d505a0ea877b7c-2752x1536.jpg?w=1920&q=82&fit=max&auto=format)](/post/sanity-knowledge-bases) ### [Sanity Knowledge Bases](/post/sanity-knowledge-bases) October 17, 2026 Eliminate query-time guessing in your AI agents. Learn how Sanity Context Knowledge Bases compile structured datasets, crawled documentation websites, and uploaded files ahead of time, resolve conflicting facts, and serve a compact outline over Context MCP. [![Alex Patterson](https://cdn.sanity.io/images/hfh83o0w/production/a606dfaa381aab08ddbe16a33fe1d3e1fb37c927-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Alex Patterson](/author/alex-patterson)