Freebox Delta : Hébergement Site Web
Free vient d’activer une fonctionnalité pour sa Freebox Delta permettant l’hébergement de Machines Virtuelles (en anglais : Virtual Machines – VMs). Les détails sur cette mise à jour sont disponibles sur le site de la Freebox.
Suite à cette annonce, j’ai pensé qu’il était intéressant de migrer l’hébergement de mon site personnel de GitHub sur mon propre serveur (littéralement chez moi).
Dans la suite de cet article, je présenterai le système mis en place pour l’hébergement de ce site sur ma Freebox.
N.B. Les opérations décrites ici peuvent s’appliquer sur presque n’importe quel système Linux, indépendamment d’une Freebox.
Prérequis
Une Freebox Delta
Avant de commencer, il faut d’abord une Freebox Delta :) avec une VM opérationnelle.
VM installé sur votre Freebox
Pour des raisons idéologiques, j’ai choisi une VM avec Debian. Pour la suite, vous pouvez choisir n’importe quelle distribution Linux.
Je ne vais décrire ici la démarche à suivre pour l’installation d’une VM sur la Freebox car il y a d’excellent tutoriels traitants le sujet. Celui d’Inpact Hardware est très simple à suivre : Machines virtuelles et Freebox Delta : création et hébergement de votre première page Web.
Mise en Place
Solution de Blog
Mes besoins en termes de site personnel sont de pouvoir me présenter, partager mes publications et de partager quelques articles (plutôt techniques).
Il existe plein de solutions pour mettre en place des sites Web allant du plus simple comme écrire directement les pages en HTML, au plus compliqué avec les solutions de CMS.
J’ai opté pour une solution intermédiaire la génération de site statique. Ces solutions permettent d’avoir les avantages des CMS pour la rédaction, l’organisation, la mise en page, … en laissant souplesse d’extension et de modification d’une implémentation HTML.
Parmi toutes les solutions de générateur de site statique, j’ai choisi Jekyll.
J’ai essayé d’autre générateur comme Pelican (utilisé pour la version précédente de ce site) ou Hugo. Mais, Jekyll reste le plus simple à mettre en place et le plus facile à utiliser / faire évoluer.
Configuration & Installation
Avant de se lancer dans la publication de votre site, il faut faire quelques installations systèmes sur votre machine locale (votre PC ou votre Mac) et sur votre VM.
Installation sur votre PC/Mac
Il faut aussi installer Jekyll sur votre machine pour valider votre site avant publication sur la VM. Jekyll propose des guides pour les principaux systèmes d’exploitation : Installation.
Installations sur la VM
- Mise à Jour
Avant tout, il est important de mettre à jour le système de la VM. En effet, l’image de base peut de dater de quelques jours qu’il faut déjà appliquer des mises à jour :
$ sudo apt update
$ sudo apt full-upgrade
$ sudo apt autoremove
Debian est réputé pour son système de gestion des packages : apt
.
- Jekyll
La première étape est d’installer Jekyll sur la VM : Jekyll on Ubuntu.
Si vous utilisez Zsh
comme shell Unix (plutôt que bash – par défaut), il faut ajouter des variables d’environnements pour le bon fonctionnement de Jekyll :
$ echo '# Install Ruby Gems to ~/gems' >> ~/.zshrc
$ echo 'export GEM_HOME="$HOME/gems"' >> ~/.zshrc
$ echo 'export PATH="$HOME/gems/bin:$PATH"' >> ~/.zshrc
$ source ~/.zshrc
- Apache HTTP Server
Pour servir vos pages Web, il faut un serveur HTTP. Le plus populaire est Apache HTTP Server.
Son installation se fait tout simplement par le gestionnaire de packages :
$ sudo apt install apache2
L’installation peut prendre quelques minutes, puis votre serveur sera démarré. Pour valider l’installation, il suffit de saisir l’adresse IP de votre VM dans un navigateur, pour moi : http://192.168.0.45
Pour connaître l’adresse IP de votre VM, il faut vous rendre sur le portail d’administration de votre Freebox et dans le panneau de contrôle des VMs :
Déploiement Automatique
Maintenant, vous devez avoir une installation Jekyll en local sur machine et un serveur prêt à héberger votre site dans votre VM.
Dans cette partie, je vais vous présenter une méthode pour simplement déployer votre site Web de votre machine locale vers votre VM qui l’exposera sur Internet.
Jekyll propose plusieurs manières d’automatiser les déploiements. Dans mon cas j’ai choisi une méthode simple avec Git (l’outil de gestion de code source).
Il faut en faire l’installation sur machine locale : https://git-scm.com/downloads
L’installation est très simple sur la VM :
$ sudo apt install git
Jekyll propose un très bon guide pour mettre en place la synchronisation : https://jekyllrb.com/docs/deployment/automated/
J’ai dû faire quelques ajustements à ce guide :
votre_machine_locale$ ssh ma_vm
vm$ mkdir mon-site.git
vm$ cd mon-site.git
vm$ git --bare init
vm$ touch hooks/post-receive
vm$ chmod a+x hooks/post-receive
vm$ sudo chown -R mon_user:mon_user /var/www/html
Le script ~/mon-site.git/hooks/post-receive
est à créer comme suit :
#!/bin/bash -l
# Install Ruby Gems to ~/gems
export GEM_HOME=$HOME/gems
export PATH=$GEM_HOME/bin:$PATH
GIT_REPO=$HOME/alexdico-com.git
TMP_GIT_CLONE=$HOME/tmp/myrepo
GEMFILE=$TMP_GIT_CLONE/Gemfile
PUBLIC_WWW=/var/www/html
git clone $GIT_REPO $TMP_GIT_CLONE
BUNDLE_GEMFILE=$GEMFILE bundle install
BUNDLE_GEMFILE=$GEMFILE JEKYLL_ENV=production bundle exec jekyll build -s $TMP_GIT_CLONE -d $PUBLIC_WWW
rm -Rf $TMP_GIT_CLONE
exit
Sur votre machine locale :
votre_machine_locale$ git remote add deploy deployer@ma_vm:~/mon-site.git
Maintenant, la commande qui déploiera les mises à jour de votre site sur le serveur et les rendra disponible sur Internet.
Pour déployer votre site :
votre_machine_locale$ git push deploy master
Pour valider, il vus suffit de taper l’adresse IP de votre VM dans votre navigateur.
Nom de Domaine (Pour les utilisateurs avancés)
Attention : cette partie s’adresse plutôt à des utilisateurs sachant ce qu’ils font.
IP Fixe
Votre site Web est maintenant publié sur le serveur. Je vais vous montrer comment le rendre publique sur Internet.
La première se passe sur espace abonné Free pour obtenir une adresse IP fixe. Sans une adresse IP fixe, vous ne pourrez pas exposer votre sur les ports http et https standards (80 et 443). Dans votre espace : MA FREEBOX -> Fonctionnalités avancées -> Demander une adresse IP fixe V4 full-stack
Au bout de quelques minutes, vous aurez une adresse IP fixe pour votre Freebox.
Ensuite, vous devez paramétrer la redirection des ports 80 & 443 par portail d’administration de votre Freebox dans la partie réseau - redirection port. Il faut mettre en place les deux redirections (80 & 443) vers la VM, comme ceci :
Normalement, votre site est accessible par Internet avec votre adresse IP fixe. Pour moi : http://82.64.166.214
Nom de Domaine
Si vous avez un nom de domaine (sinon OVH est très bien pour en acquérir).
C’est encore dans votre espace abonné que vous pourrez configurer votre DNS.
Avec mon DNS : http://www.alexdico.com
SSL
Il est bien d’exposer son site Web de manière sécurisé avec un certificat SSL.
Grâce à un projet Open Source, il est facile d’obtenir son certificat SSL valide : Let’s Encrypt
L’opération est assez simple et est à réaliser dans la VM :
$ git clone https://github.com/letsencrypt/letsencrypt
$ cd letsencrypt
$ ./letsencrypt-auto
Conclusion
Voilà votre site Web est en ligne !
Quelques remarques :
- Il ne faut pas oublier de se connecter de temps en temps sur votre VM pour effectuer les mises à jour de sécurité.
- Pour les sauvegardes, la solution présentée ici vous permet d’avoir une copie du site en locale sur votre machine et une autre sur le serveur. Vous pouvez revenir sur des versions précédentes facilement grâce à Git. S’il faut réinstaller la VM, vous avez cette page !