Pendant longtemps mon site web était héberger chez OVH mais je devais à chaque livraison passer par FTP pour livrer manuellement le contenu. Nous pouvons faire beaucoup mieux…
J’ai donc décidé de migrer l’hébergement chez un autre prestataire français Clever Cloud. Leur créneau est de vous aider à déployer automatiquement votre projet à partir d’une branche Github. Dans mon cas je voulais que Clever cloud soit capable de
lancer un checkout de mon projet
d’éxécuter mon script Gulp de génération du site
de servir les pages générées via un serveur web (Apache ou autre)
J’ai eu quelques problèmes au départ mais le support est vraiment super et tout a pu être fait en quelques heures. Merci aussi à Philippe Charrière pour nos échanges sur le sujet.
Voici la procédure que j’ai suivie. J’ai tout d’abord créé un compte sur le site de Clever Cloud,et j’ai ajouté une application via la console.
Créer une application revient à pointer vers un répository Github. Par défaut Clever suit master et relancera un déploiement chaque fois qu’un nouveau commit sera poussé sur Github. Vous pouvez dans un second temps choisir une autre branche que master (ce qui peut être utile pour dissocier différents environnements développement, recette, prod…)
Vous devez ensuite sélectionner le type d’application. Dans mon cas c’est une application statique (dernière de la liste)
Vous pouvez ensuite choisir la taille du serveur. Bien évidemment le prix mensuel dépendra des ressources utilisées
Votre application peut utiliser ces propres services mais la plateforme peut aussi vous aider à ajouter des extensions pour facilement utiliser du stockage physique ou via des sources de données (MongoDB, MySql, PostgreSQL)….
Vous pouvez ensuite paramétrer différentes variables d’environnement. Les variables dont le nom commence par DEVMIND sont injectées dans le processus Gulp de construction
module.exports = {
"apiKey": process.env.DEVMIND_API_KEY,
"authDomain": process.env.DEVMIND_AUTH_DOMAIN,
"databaseURL": process.env.DEVMIND_DATABASE_URL,
"storageBucket": process.env.DEVMIND_STORAGE_BUCKET,
"user": process.env.DEVMIND_USER_MAIL,
"password": process.env.DEVMIND_PASSWORD
};
La variable d’environnement CC_PRE_BUILD_HOOK
est importante car elle permet d’indiquer quel script est lancé à l’installation. Dans mon cas je lance un npm install
. Npm permet de charger les différents plugins Node utilisés par Gulp et permet aussi de lancer Gulp (tâche paramétrée dans le fichier package.json
du projet).
{
"name": "dev-mind.com",
"repository": "https://github.com/Dev-Mind/dev-mind.com.git",
"scripts": {
"install": "gulp",
"dev": "gulp serve"
}
}
Il est intéressant de noter que vous pouvez lancer plusieurs hooks avant ou après l’exécution de votre script.
Pour que le serveur Apache fourni par Clever Cloud, soit capable de servir le répertoire généré, vous devez ajouter un fichier php.json
(dans un répertoire nommé clevercloud
à la racine de votre projet), avec le contenu suivant
{
"deploy": {
"webroot": "/build/dist"
}
}
La dernière étape consite à paramétrer votre nom de domaine. Vous devez aller sur le site sur lequel vous avez déclarez ce nom de domaine et faire pointer le DNS vers les IPS mises à dispostion par Clever Cloud. Dans la console Clever vous devez aussi déclarer vos noms de domaine
Dans mon cas le support m’a également activé la génération automatique de certificats via Lets' Encrypt.