Comment héberger gratuitement un site Web statique sur Firebase de Google

Si vous cherchez à héberger gratuitement un site Web simple, vous n’êtes pas limité aux fabricants de sites Web gratuits tels que Google Sites ou Wix. De nombreux fournisseurs de cloud proposent des plateformes d’hébergement avec de généreux niveaux gratuits qui vous permettent d’avoir un contrôle total sur le contenu que vous servez.

Qu’est-ce qu’un site Web «statique»?

Contrairement à son apparence, un site Web «statique» ne signifie pas que votre site doit ressembler à une page GeoCities 1999. Vous êtes toujours libre de diffuser du contenu JavaScript, même des applications Web complètes d’une seule page conçues avec des cadres comme React.

Statique signifie simplement que votre contenu ne change pas avant d’être diffusé. Par exemple, WordPress répond aux demandes et modifie le contenu de la page à l’aide de PHP, selon la page que vous avez demandée. Un site Web statique, d’autre part, est tout simplement du HTML, plus les images, CSS ou JavaScript que vous envoyez avec. Vous êtes libre de le modifier côté client avec JavaScript après l’avoir envoyé à l’utilisateur, c’est ainsi que React fonctionne, mais même dans ce cas, le fichier JavaScript lui-même est statique.

L’avantage d’avoir votre site Web entièrement statique est que vous n’avez pas réellement besoin d’un serveur Web sophistiqué comme NGINX ou Apache pour diffuser votre contenu. Parce qu’il ne s’agit que de fichiers statiques, de nombreux fournisseurs, comme AWS et Google Cloud Platform, proposent des moyens d’héberger ces types de sites Web à partir de compartiments de stockage cloud.

Google propose un tel service, pour l’hébergement à partir d’un bucket Cloud Storage en utilisant un Load Balancer ou un CDN en face de lui. Cependant, il est conçu pour les sites d’entreprise hautes performances et n’est pas entièrement gratuit. Pour les déploiements simples, vous pouvez utiliser la plate-forme Firebase de Google, qui est conçue pour fournir des backends aux applications mobiles, mais comprend également un fantastique service d’hébergement de contenu statique que vous pouvez utiliser.

Configuration d’un déploiement Firebase

Firebase fait partie de Google Cloud Platform, vous aurez donc besoin d’un projet GCP à utiliser avec Firebase. Rendez-vous sur la console GCP et créez-en une nouvelle dans la liste déroulante de la barre de menus:

Vous aurez besoin de la CLI Firebase pour la partie suivante. Téléchargez le binaire de votre système d’exploitation, puis exécutez le firebase depuis votre terminal pour vous connecter et connecter la CLI Firebase à votre compte Google.

firebase

Ensuite, accédez au répertoire avec cd que vous souhaitez utiliser pour le code de votre site Web, puis exécutez firebase init:

Cela configurera le répertoire actuel en tant que projet Firebase. Pour les fonctionnalités, choisissez «Hébergement».

Sélectionnez «Ajouter Firebase à un projet Google Cloud Platform existant», puis sélectionnez le projet GCP que vous avez créé. Vous pouvez créer un tout nouveau projet ici, mais lors de nos tests, il a donné une erreur lors de la configuration et nous devons quand même en créer un manuellement.

Pour la configuration de l’hébergement, vous pouvez définir le répertoire public (par défaut «public»). Si vous utilisez une bibliothèque côté client comme React pour gérer le routage, vous pouvez configurer le projet en tant qu’application d’une seule page, qui réécrira toutes les URL pour les diriger vers la seule page index.html.

Firebase devrait maintenant être configuré. Vous pouvez déployer le site Web pour la première fois en utilisant firebase deploy. Cette commande synchronisera votre répertoire local avec votre déploiement cloud. Chaque fois que vous souhaitez mettre à jour le site, il vous suffit d’exécuter firebase deploy encore.

Votre site sera désormais visible sur projectname.web.app. Cependant, vous souhaiterez probablement configurer un domaine personnalisé, ce qui est assez facile. Vous aurez bien sûr besoin d’un domaine personnalisé enregistré auprès d’un registraire de domaine, comme Namecheap ou Google Domains.

Rendez-vous sur la console Firebase, sélectionnez votre projet, puis sélectionnez «Hébergement» dans la barre latérale. Cliquez sur « Ajouter un domaine personnalisé ».

Entrez votre domaine et vous recevrez un enregistrement TXT. Accédez aux paramètres de votre registraire de domaine et définissez le nom d’hôte et la valeur sur les valeurs qui vous sont données en tant que nouvel enregistrement TXT.

Une fois la vérification effectuée, vous devrez bien sûr pointer le domaine vers Firebase. Firebase vous donnera deux adresses IP à ajouter à votre domaine. Remplacez tout «A Records» existant que vous pourriez avoir.

Votre site affichera un avertissement HTTPS rouge pendant un petit moment, tandis que Firebase vous fournira automatiquement un certificat SSL gratuit. Vous n’avez rien à faire car ce processus est automatique.

Chaque fois que vous devez déployer des mises à jour, apportez des modifications au code dans le dossier public et exécutez firebase deploy depuis votre terminal. Vous devriez voir les modifications déployées en moins d’une minute.

Comment faire évoluer un site statique ? 

Comme nous venons de vous le dire, un site statique n’est pas voué à être modifié. De ce fait, si vous avez des actualités à poster régulièrement, comme via l’intermédiaire d’un blog, vous ne pourrez pas le faire. Vous allez être obligé de le recoder et de le faire migrer vers un autre serveur. Vous pourrez ainsi choisir d’héberger votre site proche de chez vous ou alors d’opter pour un hébergement offshore.

Pour vous aider à faire votre choix, voici quelques éléments qui peuvent vous aider dans votre sélection :

• Le coût de l’hébergement 
• L’accompagnement proposé : si vous ne savez pas de quel type d’hébergement vous avez besoin pour votre site, notamment entre un hébergement mutualisé ou dédié, il est important de pouvoir bénéficier de conseils. 
• Les services proposés : bien entendu, il vous faut un minimum de services, comme la gestion des noms de domaine, la gestion de l’espace disque, une bande passante illimitée, pour ne pas tous les citer. 
• La sécurité de l’hébergement : C’est indispensable de s’y intéresser pour pouvoir récupérer votre site. Intéressez-vous à la sauvegarde incrémentielle de tous les fichiers de votre site et au backup. Il faut aussi une solution hardware efficace contre les attaques.