Ma première approche du Framework HUGO

Mon quotidien professionnel et personnel c’est 90% WordPress. C’est un super outil pour créer et gérer des sites internet, mais pourquoi pas de pas tester autre chose ?

J’ai décidé de tester Hugo

Ma problématique à ce jour c’est les performances des sites internet. Bien souvent les sites que je réalise sont des environnement qui pourraient être plus rapide et qui ne nécessitent pas forcément d’un backoffice comme celui que propose WordPress.

Dans cette article j’ai utilisé la documentation officiel de Hugo , notamment celle l’installation rapide pour réaliser mes tests et l’écrire en français.

Créer un nouveau site internet avec Hugo

Première étape : L’installation de Hugo sur Mac

Sous MacOS la première étape pour installer Hugo va être de lancer votre terminal et d’installer le package Homebrew. Pour ma part le Package était déjà installé donc c’est naturellement qu’il vérifie les potentiels mises à jour.

brew install hugo

Deuxième étape : Installer un thème Hugo pour pouvoir commencer exploiter l’outil

Vous allez pouvoir créer un nouveau répertoire dans lequel tous éléments nécessaires vont être déposés pour avoir votre premier site internet qui roule avec Hugo. Dans notre cas nous l’appèleront « monsitehugo » et à la fin de l’exercice nous changerons le nom du site.

hugo new site monsitehugo

Félicitation vous venez de créer le dossier « monsitehugo » ! Encore une petite étape et vous votre première structure de site sera installée !

Troisième étape : Installer un Thème Hugo dans votre dossier

De nombreux thèmes Hugo sont déjà disponibles sur gohugo.io Nous allons donc en choisir un pour l’exemple et l’installer. J’ai fait le choix du thème présenté dans la documentation officielle pour des raisons de simplicités.

cd quickstart;\ 

git init;\ 

git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke;\ 

Quatrième et dernière étape : Ajouter votre premier contenu à Hugo

C’est la dernière étape, on a tout installé tout paramétré maintenant on va ajouter un article et lancer le serveur hugo pour tester tout ça.

Ajouter un article

hugo new posts/my-first-post.md

Lancer le serveur et tester votre site

hugo server -D

Pour tester c’est facile, une fois votre serveur lancé vous pouvez taper cette adresse dans votre navigateur : http://localhost:1313/.

Félicitation votre premier site avec Hugo est maintenant installé et il est fonctionnel. Il ne vous reste plus qu’a étudier l’ajout de contenu et la structure sur celui ci pour pouvoir le faire évoluer mais une partie de travail est faite !

Ça ressemble à ça :

Bon et maintenant …

Comment je paramètre mon thème Hugo ?

Dans votre éditeur « Sublim text » dans mon cas, ouvrez le fichier config.toml qui se trouve dans le dossier de votre site internet afin de pouvoir changer les informations de base de votre site internet tel que le titre ou la langue.

C’est magique, tant que votre serveur roule les changements sont immédiats !

Pour modifier votre premier article, c’est pareil : ouvrez-le, et ajoutez le contenu que vous souhaitez ajouter !

Maintenant je vous invite à aller voir la documentation pour comprendre comme modifier et ajouter du contenu avec Hugo.