Trouver un hébergeur de site web est une étape primordiale pour rendre votre site accessible sur Internet. Cela permet de le mettre en ligne de façon publique et permet aux visiteurs de pouvoir y accéder n’importe où et n’importe quand. En effet, un hébergeur va vous permettre de rendre votre site accessible 24h/24 ! Dans ce tutoriel, vous découvrirez comment héberger votre site, de façon totalement gratuite, grâce à CloudFlare Pages !

Cloudflare Pages, c’est quoi ?

Cloudflare est un de package de solutions pour les sites Web. Il agit autant en matière de sécurité que de performance. Néanmoins, les services de Cloudflare se diversifient de plus en plus ! Dans ce tutoriel par exemple, nous allons utiliser le service Cloudflare Pages. Cloudflare Pages va ici nous permettre de mettre en ligne notre site web. A noter que Cloudflare Pages ne supporte que les pages web HTML statique (ceci incluant les pages faites à partir de Framework JavaScript).

Héberger son site

Pour commencer, inscrivez-vous sur le site de Cloudflare. Une fois inscrit(e), vous serez automatiquement redirigé(e) vers la page d’ajout de site. Si vous n’avez pas encore de domaine, Cloudflare propose depuis peu l’enregistrement de domaine directement depuis sa plateforme. Cette étape est facultative sachant que Cloudflare Pages propose un sous-domaine gratuit (exemple.pages.dev). Une fois sur la page ci-dessous, cliquez sur l’onglet Pages du menu latéral.

Une fois sur l’onglet Pages du tableau de bord, cliquez sur Create a project afin de démarrer la procédure.

Vous aurez ici le choix entre 3 possibilités pour importer votre site web :

• Importation via Git (GitHub ou GitLab)
• Importation directe des fichiers du site (ZIP)
• Importation via interface de ligne de commande (CLI)

Nous allons dans ce tutoriel utiliser l’importation via fichier .zip, mais la documentation du site peut vous aider à réaliser la manipulation via les autres méthodes proposées.

Avant de pouvoir téléverser les fichiers de votre site web, vous allez devoir choisir un nom pour votre projet. A noter que ce nom sera utilisé comme sous-domaine par défaut pour votre site.

Une fois avoir choisi le nom que vous souhaitez, vous pouvez dès à présent téléverser les fichiers de votre site web, via un dossier ou un fichier .zip compressé.

Les fichiers de votre site web sont désormais téléversés.

Vous pouvez dès à présent déployer votre site web !

Pour accéder à votre site, rendez-vous sur la page dont vous avez choisi le nom précédemment à travers le processus de déploiement Cloudflare Pages. Dans le cas présent, il s’agit de la page NSI42.pages.dev.

Et voilà ! Vous savez désormais comment héberger une page web gratuitement avec Cloudflare.

Pour ceux qui veulent aller plus loin, nous allons désormais apprendre à connecter notre site à un nom de domaine personnalisé !

BONUS : Mise en place d’un nom de domaine personnalisé

Pour profiter d’un nom de domaine personnalisé pour votre site, il va tout d’abord vous falloir vous en procurer un. Depuis peu, Cloudflare propose des offres d’enregistrement de noms de domaine. Une fois votre domaine enregistré et ajouté sur Cloudflare, rendez-vous sur l’onglet Custom domains depuis votre espace Cloudflare Pages.

Une fois sur l’onglet, cliquez sur sur le bouton ci-dessous.

Vous pouvez dès à présent entrer votre nom de domaine personnalisé que vous vous êtes procuré précédemment.

Une fois le nom de domaine ajouté, vous devez configurer vos enregistrements DNS afin de faire pointer celui-ci vers le sous-domaine Cloudflare de votre site. Pour se faire, recopiez la configuration suivante.

Une fois le nom de domaine ajouté, vous pourrez désormais y accéder via votre domaine personnalisé !

---

Et voilà ! Vous savez désormais héberger une page web gratuitement avec un nom de domaine personnalisé grâce à Cloudflare Pages.