Les SSG (ou static site generator)?

Assistance technique
#1

Bonjour à toutes et tous,

Pour les créateurs de sites web, que pensez-vous des générateurs de sites statiques de type Jekyll et autres ?

Des gens comme Bertrand Keller (intégrateur frontend senior) en parlent pas mal comme de la nouvelle génération de sites qui va monter et remplacer au moins en partie les CMS (ou en tout cas, les forcera à évoluer pour intégrer les SSG dans leur mode de fonctionnement).

Apparemment, ce même Bertrand Keller met en avant ces technologie car elles permettraient un déployemment plus facile et rapide, surtout pour faire des sites dits “low tech”.

Merci pour vos avis.

Hebergement page web economique (pro)
#2

Salut @aliko,

à titre personnel, j’utilise un générateur de site statique pour ma page professionnelle.
le moteur que j’utilise est : vuepress
il me convient pour le moment.
Difficile d’en dire plus car je reste en phase d’apprentissage.

pour ma part, le cœur de l’information c’est du markdown.
un peu comme le site de Libre.re :eyes:

1 « J'aime »
#3

Merci Philippe pour ton retour.

#4

Coucou ici

Pour ma part ayant utiliser hugo jekyll et autres générateur de site statique je pense que c’est l’avenir effectivement .
Je t’invite également a te renseigner sur un des nouveaux paradygme de conception web qui risque de devenir rapidement un nouveau standard : la jamstack qui consiste a utiliser par dessus des front end statique des micro-services relier les un aux autres ce qui garantie d’eviter ce que l’on appelle dans jargon le plat de spaggettis autrement dit quand on a du dynamics avec des services en cascades si un services dans la stack tombe tout le reste tombe ce qui n’est pas le cas dans le cadre de la jamstack je n’avais pas approffondie tant que ca mais j’avais trouver ca super interressant

je vous mets ici quelques liens ressources
https://jamstack.wtf/ vous remarquerez l’extension qui me fait penser a la licences libre du meme nom :rofl:
https://jamstatic.fr/2019/02/07/c-est-quoi-la-jamstack/
ainsi que quelques sites static sur github ou netlify :

1 « J'aime »
#5

Merci @JulienV pour les tuyaux,

Perso, je ne suis qu’infographiste et les langages dynamiques me donnant des boutons, je préfère essayer d’appréhender la chose via les headless CMS qui ont l’air plus abordables.

Sous les conseils d’un bon codeur, je me suis penché un moment sur Strapi qui a l’air extrêmement efficace, et bien que l’installation a l’air très simple, je n’ai quand pas pu le faire dû à des problèmes de dépendances.

Mais je ne perd pas espoir car je viens de voir le nombre impressionnant de headless CMS qui existent actuellement, et il doit bien y avoir quelque chose de suffisamment accessible pour moi.

Encore merci pour tout ça. Bonne soirée à toi.

1 « J'aime »
#6

Salut,
Que me conseillez vous pour générer un site pour présenter les projets de ma compagnie artistique ?
@pvincent m’a parlé de Grav, j’ai vu que @anna utilise Hugo et il y a encore d’autres références dans ce fil, je cherche un éclairage sur tout ca
Je crois qu’il est possible de générer le site depuis un gitlab, ca serait top ?

2 « J'aime »
#7

Hello @glungtung , il y a pleins de solutions gitlab c’est surtout une solution de stockage et de déploiement, il existe bon nombres de framework / librairies qui peuvent etre utiliser pour créer des sites facilement, Grav basé sur laravel un cms en php est trés pratique c’est pour du web dynamique , a titre d’exemple j’utilise Eleventy qui est basé sur du web statique et sur les concepts de jamstack il prend du markdown et fonctionne partielement avec javascript c’est trés complet, je ne vais pas détailler tout les solutions statiques ici car il en existe enormément

Grav
La jamstack
Eleventy

Pour le déploiement de solutions dynamique il est possible d’utiliser netlify qui generera l’environnement adequat node php python a partir de dépot gitlab, bien que la configuration puisse etre un peu spartiate quand il sagit de projet dynamique c’est trés interressant et aussi trés simple de déployer de simple page html ou markdown a partir de dépot gitlab, github ou encore bitbucket il suffit simplement de se connecter a netlify avec un compte sur une des plateformes citée ci-dessus
netlify

Autrement tu peux tout simplement ecrire une ou plusieurs page en markdown ou html et les déployers via gitlab sans aucuns autre intermediaires un peu sur le meme principe que les page github c’est relativement simple et des themes jekyll ou autres peuvent etre proposer pour styliser ton markdown tu a quelques configurations a faire dans le dépot et la rédaction d’un fichier .yaml et le tour est jouer ta page sera en ligne mais tu trouvera dans la documentation plusieurs sections dédier au générateur de site et aussi des explications sur les concepts dynamique vs statiques
La documentation GItlab

Bon courage a toi en ésperant que tout cela te sera utile ^^

1 « J'aime »
#8

Salut Guillaume,
J’avais trouvé des super tutos pour générer un site via gitlab (https://docs.gitlab.com/ee/user/project/pages/). J’y suis arrivée sans trop de problèmes alors que je n’y connaissais que pouic, je pense que ça va être super simple pour toi.
Je pourrais te montrer pour le mien si tu veux : https://gitlab.com/doana-r/doana-r.gitlab.io/-/blob/master/.gitlab-ci.yml. Je l’ai fait via R parce que c’est mon dada, mais tu peux faire encore plus simple je suis sûre.

Ca c’est un exemple de thème Jeckyll minimaliste (sous MIT) que tu peux forker et générer par gitlab, j’aime bien les explications : https://github.com/AkshayAgarwal007/Jekyll-Mono/tree/master
Et celui-ci un template Hugo : https://pages.gitlab.io/hugo/
Il y en a des tonnes, et je sais qu’il y en a qui sont adaptés exprès pour la présentation de contenus artistiques.
Pour mon site, j’ai pris celui-ci : https://wowchemy.com/ (adapté en particulier aux contenus académiques/recherche)

1 « J'aime »
#9

Nos réponses se complètent bien @JulienV :wink:

1 « J'aime »
#10

coucou aha synchro a la minute @anna cool ta réponse ^^ c’est que la doc de gitlab est super bien faite et propose plein d’exemple

1 « J'aime »
#11

oui j’etait en train d’écrire a se propos également :joy: quel synchro dit donc ^^

#12

Me voilà :rofl:

1 « J'aime »
#13

Bonjour,

Pour les sites statiques minimalistes, il ne faut pas hésiter à construire sa page directement en html.
C’est souvent moins compliqué que d’apprendre à utiliser un SSG.
C’est plutôt bien expliqué ici : https://developer.mozilla.org/fr/docs/Web

Bon j’ai voulu mettre un exemple, mais pas moyen de mettre du code html ici sans qu’il soit interprété (même avec les balises ‘pre’ et ‘code’). Si quelqu’un sait comment faire…

#14

Simplement faire une capture d’écran et poster l’image dans ta réponse ?

C’est juste que ce sera plus embêtant pour la personne à devoir tout recopier à la main par après.

#15

hum, j’ai l’impression que tu n’as pas utilisé le didacticiel de Discourse, cf. premier message de discobot.
un exemple de code HTML

<div class="cooked"><p>Bonjour,</p>
<p>Pour les sites statiques minimalistes, il
 ne faut pas hésiter à construire sa page directement en html.<br>
C’est souvent moins compliqué que d’apprendre à utiliser un SSG.<br>
C’est plutôt bien expliqué ici : 
<a href="https://developer.mozilla.org/fr/docs/Web" 
rel="noopener nofollow ugc">
https://developer.mozilla.org/fr/docs/Web
</a></p>
<p>Bon j’ai voulu mettre un exemple, mais pas moyen de mettre du code html 
ici sans qu’il soit interprété (même avec les balises ‘pre’ et ‘code’).
 Si quelqu’un sait comment faire…</p></div>
#16

C’'est vrai je suis un mauvais élève. Mais n’y a t’il pas simplement une page de doc ?

#18

Pfffff ça y est j’ai réussi.

Un exemple de code html très basique :

<!DOCTYPE html>
<html>
<head>
	<title>Hello libre.re</title>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
	Bonjour <a href="https://www.libre.re/" target="_blank">libre.re</a>&nbsp; 😉
</body>
</html>

À sauvegarder sous un nom quelconque se terminant par .html et à ouvrir avec un navigateur internet.

1 « J'aime »
#19

en réalité, il faut apprendre le Markdown.
il y a des dizaines de documentations, en français, en anglais.
une au hasard https://commonmark.org/help/

en ce qui concerne Discourse, il utilise massivement Markdown + il rajoute des notions spécifiques à des outils type réseau social, utilisation de @ pour un auteur, # une catégorie, etc…

Pour le didacticiel intégré, lire Améliorations & Suggestions

#20

Pour apprendre le markdown j’avais trouver cet outil Markdown live Preview
c’est pratique car ca donne la syntaxe aux chargement de la page avec la majorité des possibilitées disponible en markdown c’est plutot cool pour apprendre

1 « J'aime »