Skip to content

Workflow pour Hugo avec Dokku

Ce tutoriel présente un workflow complet pour développer un site Web avec Hugo,
en isolant:
- le développement local (avec dokku)
- le déploiement du site en développement (avec Gitlab Pages)
- le déploiement sur un serveur multi-sites (avec dokku)

local dev prod
deploy tool dokku gitlab Pages dokku
deploy Url localhost gitlab.io my.server
root project project/public project project/public

1. Préparation dans Gitlab

Créez deux projets:
- <my-project> : contient le projet hugo
- <my-project.public> : submodule du 1er, contient le site généré.

Le projet appelé sera déployé avec Gitlab Pages.
Pour choisir le nom du projet en prenant en compte la manière dont Gitlab construit l'Url de déploiement, consultez la documentation

2. Déploiement local

2.1 Mise en place du projet

2.1.1 Clonez le projet Hugo

Si vous n'avez pas encore de projet Hugo, vous pouvez vous reporter au guide de démarrage

Choisissez de remplacer <appname> par le nom que vous voudrez voir apparaître en première partie de votre nom de domaine.
Par exemple, si vous remplacez <appname> par moncv, votre projet sera déployé sur moncv.domain.org

git clone https://gitlab.com/<path/to/my-project> <appname>
cd <appname>

2.1.2 Créez la branche local

git checkout -b local

2.1.3 Modifiez config.toml

baseurl = "http://<appname>.domain.local>

2.2 Déploiement

Pour le déploiement local vous avez deux options :
- Option 1: déploiement avec Hugo
- Option 2: déploiement avec Dokku (recommandé)

2.2.1 Déploiement avec Dokku

2.2.1.1 Installation de Dokku

Suivez ce guide et n'oubliez pas de configurer le DNS.

2.2.1.2 Appelez le buildpack Hugo

Créez le fichier .buildpacks à la racine du projet

.buildpacks

https://github.com/garagenum/heroku-buildpack-hugo

2.2.1.3 Créez une appli dokku pour le 1er déploiement
dokku apps:create <tmp-appname>
2.2.1.4 Déployez avec dokku
git remote add dokku dokku@<domain.local>:<tmp-appname>
git add config.toml .buildpacks 
git commit -m "<add local deployment>"
sudo git push dokku local:master

Vous pouvez voir votre site web à l'url http://<appname.domain.local>/public

3. Déploiement du site de dev sur le web avec Gitlab Pages

Gitlab Pages va nous permettre de mettre en ligne un site en développement, uniquement accessible avec authentification, pour le montrer aux points d'étape.

3.1 Mise en place du projet

3.1.1 Créez la branche dev

git checkout -b dev

3.1.2 Modifiez config.toml

baseurl = "http://<gitlab-user>.gitlab.io/<path/to/my-project>

3.1.3 Créez le fichier .gitlab-ci.yml

!!!note `.gitlab-ci.yml # All available Hugo versions are listed here: https://gitlab.com/pages/hugo/container_registry image: registry.gitlab.com/pages/hugo:latest

pages:
  script:
  - hugo
  only:
  - dev

3.2 Déploiement en ligne

git add .gitlab-ci.yml config.toml
git commit -m "<deploy dev hugo website>"
git push origin master

4. Déploiement du site en production sur un serveur avec Dokku

4.1 Configurer le dossier public pour les futurs déploiements

Si le déploiement local s'est bien déroulé, hugo a compilé le site et le dossier public a été créé.

Nous allons utilise ce dossier public comme module de notre projet, et c'est ce sous-projet que nous déploierons avec Dokku.

cd public
git init
#git remote add origin git@gitlab.com:<path/to/my-project.public>.git
git remote add dokku dokku@<domain.org>:<appname>
touch index.php composer.json

Modifiez les deux fichiers créés :

<?php header ( 'Location: /index.html' ); ?>
{
    "name": "<my-project.public>",
    "description": "<Name of my Website>"
}

4.2 Premier déploiement

git add *
git commit -m "first production deployement"
sudo git push dokku master

5. Ajout des modifications depuis local ou dev

Retour à la racine du projet

cd ..

5.2 Intégration des changements

git checkout master
git pull
git checkout dokku
git merge master
# A corriger : git submodule add dokku@<domain.org>:<appname> public

5.3 Déploiement

cd public
git add -A
git commit -m "some modifications"
sudo git push dokku master