- Préparation des comptes et outils nécessaires
Installation de Node.js
Rendez-vous sur la page officielle de Node.js pour télécharger la version recommandée : https://nodejs.org/
Une fois le fichier .msi téléchargé,double-cliquez pour lancer l'installation. Suivez les étapes en cliquant sur "Next" jusqu'à la fin de l'installation. Les paramètres par défaut conviennent parfaitement aux débutants.
Installation de Git
Téléchargez Git depuis le site officiel : https://git-scm.com/
Lancez l'installation en exécutant le fichier .exe. Durant l'installation, acceptez les options par défaut en cliquant sur "Next" jusqu'à voir la barre de progression. L'installation peut prendre quelques minutes selon votre connexion.
Création des comptes GitHub et Vercel
Inscription GitHub : Rendez-vous sur https://github.com/ et créez un compte gratuit en suivant les instructions. Vous devrez vérifier votre adresse email.
Compte Vercel (optionnel) : Vercel propose un hébergement gratuit optimisé pour les sites statiques. Connectez-vous avec votre compte GitHub sur https://vercel.com/
- Configuration du dépôt GitHub et des environnements
Création du dépôt GitHub
Connectez-vous à votre compte GitHub et cliquez sur "New repository" pour créer un nouveau dépôt. Nommez-le selon le format suivant : votrepseudo.github.io
Cochez la case "Public" et cliquez sur "Create repository".
Configuration de Node.js
Créez un nouveau dossier sur votre ordinateur qui servira à accueillir les fichiers de votre blog. Ouvrez un temrinal dans ce dossier.
Configurez npm pour utiliser un miroir chinois afin d'accélérer les téléchargements :
npm config set registry https://registry.npm.taobao.org
Installez ensuite Hexo de manière globale :
npm install -g hexo-cli
Une fois l'installation terminée, initialisez votre blog :
hexo init .
npm install
Note : Si vous rencontrez des erreurs liées à OpenSSL, cela peut indiquer un problème de connexion réseau. Essayez de configurer un proxy ou utilisez un autre miroir npm.
Configuration de Git (étape cruciale)
Ouvrez un terminal et configurez votre identité Git :
git config --global user.name "Votre pseudo GitHub"
git config --global user.email "votre@email.com"
Génération de la clé SSH :
Saisissez la commande suivante et appuyez sur Entrée à chaque prompt :
ssh-keygen -t rsa -C "votre@email.com"
Ajout de la clé SSH sur GitHub :
- Naviguez vers le dossier
C:\Users\VotreUtilisateur\.ssh(n'oubliez pas d'activer l'affichage des fichiers cachés) - Ouvrez le fichier
id_rsa.pubavec un éditeur de texte - Copiez tout le contenu du fichier
Sur GitHub, Allez dans Settings → SSH and GPG keys → New SSH key. Collez le contenu dans le champ "Key" et donnez un titre à votre clé.
Vérifiez la connexion en ouvrant un terminal et en tapant :
ssh -T git@github.com
Répondez "yes" à l'invite de confirmation. Vous devriez voir un message indiquant que la connexion est réussie.
- Déploiement de Hexo sur GitHub Pages et configuration d'un domaine personnalisé
Déploiement sur GitHub Pages
Générez les fichiers statiques de votre blog et lancez le serveur local :
hexo g
hexo s
Ouvrez votre navigateur et accédez à http://localhost:4000. Si vous voyez la page par défaut de Hexo, félicitations ! L'installation locale fonctionne.
Astuce : Si le site ne se charge pas, le port 4000 est peut-être occupé. Arrêtez le serveur avec Ctrl+C, puis relancez avec hexo server -p 5000 pour utiliser un autre port.
Une fois le blog fonctionnel en local, procédez au déploiement en ligne.
Installation du module de déploiement Git :
npm install hexo-deployer-git --save
Modification du fichier de configuration :
Ouvrez le fichier _config.yml à la racine de votre projet et recherchez la section deployment. Modifiez-la ainsi :
deploy:
type: git
repository: git@github.com:pseudo/pseudo.github.io.git
branch: main
Déployez votre blog avec la commande :
hexo d
Votre site est maintenant accessible à l'adresse https://pseudo.github.io.
Commandes utiles :
hexo new "nom-article" # Créer un nouvel article
hexo new page "nom-page" # Créer une nouvelle page
hexo g # Générer les fichiers statiques
hexo d # Déployer sur le serveur
hexo g -d # Générer et déployer en une commande
hexo s # Lancer le serveur local
hexo clean # Nettoyer le cache et les fichiers générés
hexo help # Afficher l'aide
Configuration d'un domaine personnalisé via Vercel (avancé)
Vercel offre des performances réseau bien supérieures à GitHub Pages, avec des temps de réponse généralement inférieurs à 80ms contre plus de 100ms pour GitHub.
Procédure :
- Connectez-vous sur https://vercel.com/
- Cliquez sur "Add New" puis "Project"
- Importez votre dépôt GitHub
- Les paramètres par défaut conviennent, cliquez sur "Deploy"
Ajout du domaine personnalisé :
- Dans les paramètres du projet, allez dans "Domains"
- Cliquez sur "Add Existing" et saisissez votre nom de domaine
- Configurez les enregistrements DNS chez votre registrar selon les instructions fournies
Une fois lesDNS propagés, votre blog sera accessible via votre domaine personnalisé avec les avantages de performance de Vercel.