Premiers pas avec Firebase Hosting

Firebase Hosting vous offre un moyen rapide, sécurisé et fiable d'héberger les éléments statiques de votre application (HTML, CSS, JavaScript, fichiers multimédias, etc.), ainsi que de diffuser du contenu dynamique et d'héberger des microservices.

Notre hébergement de qualité production est soutenu par un réseau de diffusion de contenu (CDN) mondial. Hosting diffuse votre contenu via SSL, par défaut, et peut être utilisé avec votre propre domaine personnalisé ou sur les sous-domaines de votre projet sans frais sur web.app et firebaseapp.com.




Pour obtenir une assistance par IA, copiez le prompt ci-dessous dans votre agent de codage IA (comme Antigravity, Claude Code, Codex et Cursor). Vous pouvez personnaliser le prompt et itérer avec votre agent. Consultez les compétences de l'agent Firebase pour obtenir des informations détaillées sur l'installation. 

Help me use Firebase in my app.
1. Make sure that **Firebase agent skills** are installed and updated. For Claude Code, Codex, or Cursor agents, help me install the Firebase plugin. For other agents, run `npx skills add firebase/agent-skills`.  Always try to use **Firebase agent skills** for Firebase-related tasks.
2. Help me use Firebase to host my web app. Set up my app to use Firebase, and then deploy my app.

Avant de commencer

Avant de pouvoir configurer Firebase Hosting, vous devez créer un projet Firebase.

Étape 1 : Installer Firebase CLI

Consultez la documentation de Firebase CLI pour découvrir comment installer la CLI ou passer à sa dernière version.

Étape 2 : Initialiser votre projet

Pour connecter les fichiers de votre projet en local à votre projet Firebase, exécutez la commande suivante à partir de la racine du répertoire de votre projet en local :

firebase init hosting

Lors de l'initialisation du projet, à partir des invites Firebase CLI :

  1. Sélectionnez un projet Firebase à associer au répertoire de votre projet en local.

    Le projet Firebase sélectionné est votre projet Firebase "par défaut" pour le répertoire de votre projet local. Pour associer d'autres projets Firebase au répertoire de votre projet en local, configurez des alias de projet.

  2. Spécifiez un répertoire à utiliser comme répertoire racine public.

    Ce répertoire contient tous vos fichiers statiques diffusés publiquement, y compris votre index.html fichier et tous les autres éléments que vous souhaitez déployer sur Firebase Hosting.

    • Applications statiques : si vous déployez une application statique :

      • La valeur par défaut du répertoire racine public est public.

      • Vous pouvez spécifier votre répertoire racine public maintenant ou vous pouvez le spécifier ultérieurement dans votre firebase.json fichier de configuration.

      • Si vous sélectionnez la valeur par défaut et que vous n'avez pas encore de répertoire nommé public, Firebase le crée pour vous.

      • Si vous n'avez pas encore de fichier index.html ou 404.html valide dans votre répertoire racine public, Firebase les crée pour vous.

    • Activer App Hosting : si la CLI détecte des fonctionnalités d' un framework Web SSR comme Next.js ou Angular Universal, elle peut vous recommander d'initialiser Firebase App Hosting à la place. App Hosting est la solution de déploiement recommandée pour les applications de framework full stack. Vous pouvez poursuivre la configuration de App Hosting ou continuer avec Hosting (classique) pour les déploiements statiques uniquement.

  3. Choisissez une configuration pour votre site.

    Si vous choisissez de créer une application monopage, Firebase ajoute automatiquement des configurations de réécriture pour vous.

À la fin de l'initialisation, Firebase crée et ajoute automatiquement deux fichiers à la racine du répertoire de votre application locale :

Étape 3 : Déployer sur votre site

Pour déployer votre site, exécutez la commande suivante à partir de la racine du répertoire de votre projet local :

firebase deploy --only hosting

Cette commande déploie le contenu et la configuration de votre Hosting sur les sous-domaines provisionnés par Firebase suivants :

  • PROJECT_ID.web.app
  • PROJECT_ID.firebaseapp.com

En savoir plus sur les déploiements et même sur les tests locaux de votre site.

Étapes suivantes

Votre site est désormais prêt à être partagé avec le monde entier.