Se você estiver criando apps Angular ou Next.js renderizados pelo servidor, confira o Firebase App Hosting de última geração, uma solução de pilha completa para frameworks modernos da Web.
Mantenha tudo organizado com as coleções
Salve e categorize o conteúdo com base nas suas preferências.
O Firebase Hosting se integra a frameworks da Web modernos e conhecidos, incluindo o Angular
e o Next.js. Ao usar Firebase Hosting e Cloud Functions for Firebase com esses
frameworks, é possível desenvolver apps e microsserviços no seu ambiente de framework
preferido e implantá-los em um ambiente de servidor gerenciado e seguro.
O suporte durante o pré-lançamento antecipado inclui as seguintes funcionalidades:
Implantar apps da Web compostos por conteúdo estático da Web
Implantar apps da Web que usem a pré-renderização ou a geração de sites estáticos (SSG, na sigla em inglês)
Implantar apps da Web que usem a renderização do lado do servidor (SSR, na sigla em inglês), um recurso sob demanda de renderização completa de servidores
O Firebase oferece essa funcionalidade pela CLI do Firebase. Ao inicializar
o Hosting na linha de comando, você fornece informações sobre o projeto novo ou que já existe
da Web, e a CLI configura os recursos certos para o framework da Web
escolhido.
Antes de começar
Antes de começar a implantação do app no Firebase,
confira os seguintes requisitos e opções:
CLI do Firebase versão 12.1.0 ou mais recente. Instale a CLI
usando
seu método preferido.
Opcional: ative o faturamento no seu projeto do Firebase
(obrigatório se você planeja usar a SSR).
Disponibilizar localmente
Teste sua integração localmente seguindo estas etapas:
Execute firebase emulators:start no terminal. Isso cria o app e o
disponibiliza usando a CLI do Firebase.
Abra o app da Web no URL local retornado pela CLI (geralmente http://localhost:5000).
Implantar o app no Firebase Hosting
Quando estiver tudo pronto para compartilhar as mudanças com o mundo, implante o app no
site ativo:
Execute firebase deploy no terminal.
Verifique seu site em SITE_ID.web.app, PROJECT_ID.web.app ou no seu domínio personalizado, se você tiver configurado um.
Configurar ambientes diferentes
É possível implantar vários conjuntos de variáveis de ambiente para diferentes ambientes de projeto, como preparo e produção.
Assim como o Cloud Functions para Firebase, essa ferramenta oferece suporte ao formato do arquivo dotenv para carregar variáveis de ambiente especificadas em um arquivo .env.
Se você tiver um alias de projeto staging, poderá implantar variáveis de ambiente de um arquivo .env.staging.
Se você tiver um alias de projeto production, poderá implantar variáveis de ambiente de um arquivo .env.production.
Se você tiver um projeto com o ID PROJECT_ID, poderá implantar variáveis de ambiente de um arquivo .env.PROJECT_ID.
[[["Fácil de entender","easyToUnderstand","thumb-up"],["Meu problema foi resolvido","solvedMyProblem","thumb-up"],["Outro","otherUp","thumb-up"]],[["Não contém as informações de que eu preciso","missingTheInformationINeed","thumb-down"],["Muito complicado / etapas demais","tooComplicatedTooManySteps","thumb-down"],["Desatualizado","outOfDate","thumb-down"],["Problema na tradução","translationIssue","thumb-down"],["Problema com as amostras / o código","samplesCodeIssue","thumb-down"],["Outro","otherDown","thumb-down"]],["Última atualização 2025-09-05 UTC."],[],[],null,["\u003cbr /\u003e\n\nFirebase Hosting integrates with popular modern web frameworks including Angular\nand Next.js. Using Firebase Hosting and Cloud Functions for Firebase with these\nframeworks, you can develop apps and microservices in your preferred framework\nenvironment, and then deploy them in a managed, secure server environment.\n\nSupport during this early preview includes the following functionality:\n\n- Deploy Web apps comprised of static web content\n- Deploy Web apps that use pre-rendering / Static Site Generation (SSG)\n- Deploy Web apps that use server-side Rendering (SSR)---full server rendering on demand\n\nFirebase provides this functionality through the Firebase CLI. When initializing\nHosting on the command line, you provide information about your new or existing\nWeb project, and the CLI sets up the right resources for your chosen Web\nframework.\n| **Note:** Framework-aware Hosting is an early public preview. This means that the functionality might change in backward-incompatible ways. A preview release is not subject to any SLA or deprecation policy and may receive limited or no support.\n\nBefore you begin\n\nBefore you get started deploying your app to Firebase,\nreview the following requirements and options:\n\n- Firebase CLI version 12.1.0 or later. Make sure to [install the CLI](/docs/cli#install_the_firebase_cli) using your preferred method.\n- Optional: Billing enabled on your Firebase project (required if you plan to use SSR)\n\nServe locally\n\nYou can test your integration locally by following these steps:\n\n1. Run `firebase emulators:start` from the terminal. This builds your app and serves it using the Firebase CLI.\n2. Open your web app at the local URL returned by the CLI (usually http://localhost:5000).\n\nDeploy your app to Firebase Hosting\n\nWhen you're ready to share your changes with the world, deploy your app to your\nlive site:\n\n1. Run `firebase deploy` from the terminal.\n2. Check your website on: `SITE_ID.web.app` or `PROJECT_ID.web.app` (or your custom domain, if you set one up).\n\nConfigure different environments\n\nYou can deploy multiple sets of environment variables for different project environments, such as staging and production.\n\nLike Cloud Functions for Firebase, this tooling supports the [dotenv](https://www.npmjs.com/package/dotenv) file format for loading environment variables specified in a .env file.\n\n- If you have a `staging` project alias, you can deploy environment variables from a `.env.staging` file.\n- If you have a `production` project alias, you can deploy environment variables from a `.env.production` file.\n- If you have a project with id `PROJECT_ID`, you can deploy environment variables from a `.env.PROJECT_ID` file.\n\nSee the [Cloud Functions documentation](https://firebase.google.com/docs/functions/config-env?gen=2nd#deploying_multiple_sets_of_environment_variables) for a detailed guide.\n\nNext steps\n\nSee the detailed guide for your preferred framework:\n\n- [Angular](/docs/hosting/frameworks/angular)\n- [Next.js](/docs/hosting/frameworks/nextjs)\n- [Flutter Web](/docs/hosting/frameworks/flutter)\n- [Frameworks with Express.js](/docs/hosting/frameworks/express)"]]
