Un truc dans ce bout là ?
Accueil :
Tutoriel :
Eh bah !
Super boulot !
Salut à tous et bonne année
Bon, entre le chat et les forums je suis un peu paumé… Je met donc ici ce que j’ai écrit ailleurs :
Je suis arrivé trop tôt sur le festival de parisP2P, j’avais du temps à tuer et du coup j’ai commencé à jouer avec Silkaj, et en lisant la doc j’ai craqué. Je me suis mis à refaire le site avec vuepress…
Je ne savais pas que @anon88550267 étais aussi en train de refaire le site. On vient de me l’apprendre sur le chat axiom. Bref, désolé du doublon, j’arrive comme un cheuveux sur la soupe !
Faites ce que vous voulez de ce que j’ai fait, ça m’a pris 2h au festoch, puis je l’ai à moitié finit dans le train entre 2 sièstes… donc vraiment c’est pas bien grave si vous jetez tout…
J’ai utilisé vuepress. C’est un générateur de site statique en markdown utilisant vue.js, assez orienté documentation, mais on peut faire autre chose avec. J’ai gardé le thème officiel, très utilisé dans la communauté vue.js. Vue est surtout utile pour gérer le routage, le scroll, et le pwa (le site fonctionne hors ligne), le cache… mais on peut mettre des composants vue dans du markdown, et ça c’est cool…
C’est ici : https://mystifying-nobel-66ae54.netlify.com/fr/
Et le dépôt là avec instruction pour lancer en mode dev et avoir du hot reload pendant que l’on modifie le markdown : GitHub - ManUtopiK/doc_silkaj: Technical documentation for Silkaj, CLI for Duniter.
J’ai une webextension qui copie converti et colle en markdown, j’ai fait ça vite, avec quelques modifs, mais je me suis arrêté quand découvert qu’une parti de la doc était aussi sur le dépôt gitlab.
@moul @vit (coucou !) @anon88550267 et autres, dites moi ce que vous en pensez et surtout comment je peux aider ?
C’est quoi l’avantage par rapport à Pelican ?
C’est quoi des composants Vue ?
Top ce que tu as fait Manu !
Top, deux devs web sur le même projet !
Je vous laisse vous fritter sur la technique du site web.
Moi, je m’occupe du contenu
C’est quoi l’avantage par rapport à Pelican ?
Je ne connais pas Pelican, mais je viens de regarder la doc vite fait…
Bon c’est un peu compliqué de comparer les 2. Je ne sais pas ce que tu connais en webdev.
Vuepress et Pelican sont tous les 2 des générateurs de site statique (SSG). Un site statique peut être du simple html/js/css, mais aussi plus élaboré comme des sites SPA ou MPA, JamStack, headless…
Vuepress c’est du SPA (Single Page Application) de base. Sur le site que j’ai fait, si tu changes la langue par exemple, tu peux voir que le contenu du site et l’url change sans recharger la page. En fait, le contenu entier du site est chargé dans le navigateur, et c’est le navigateur avec vue.js qui change la page (c’est du MVVC) en contrôlant le routage avec l’api History HTML5 des navigateurs.
De plus, Vuepress est une PWA (Progressive Web App). Faut le configurer, pas fait pour l’instant. Comme tout le site est chargé dans le navigateur, tu peux être hors ligne et continuer à naviguer sur le site… Si tu vas sur un site PWA en mobile, tu peux installer le site sur ton écran d’accueil comme si c’était une appli mobile.
Aussi, Vuepress est préconfiguré avec tout ce qui va bien avec webpack/browserify pour développer le site. Tu lances vuepress dev
et tu peux modifier un fichier et voir les changements sans même aller rafraichir la page de ton navigateur.
Au vue de la doc pelican, je n’ai rien vu de tout ça. J’ai cherché vite fait sur GitHub - getpelican/pelican-themes: Themes for Pelican et rien vu non plus. Ils sont vieux les thèmes !
Aussi, je n’ai pas l’impression que pelican soit compatible front matter. Ça c’est un peu gênant si on veut migrer sur un autre SSG car la plupart des SSG le sont. Bon en même temps il y a 2 pages…
C’est quoi des composants Vue ?
Tu peux intégré n’importe quel composant au milieu du markdown. La liste est longue… Par exemple si l’on veut intégrer un composant d’upload de fichier drag&drop, il suffit de l’ajouter avec npm, puis l’appeler n’importe où dans la page. Tu peux même écrire du javascript directement dans le code. Ex: {{ 3*10 }}
va afficher 30 à la place. Ou écrire du vue directement. Ex: <div v-for="i in 3">{{ i }}</div>
va afficher 3 divs avec 1 2 3.
Il y a un composant qui permet de mettre le site en dark mode et qui utilise prefers-color-scheme
des navigateurs.
Bref, que de jargon technique…
Mon avis est que pelican est quand même moins avancé. Et puis vuepress est utilisé par des centaines de projet open source et quasi toute la communauté vue.js.
Je suis un peu embarrassé de voir que tu avais déjà fait des choses pour le site. Je ne savais pas. J’espère que tu n’as pas passé trop de temps dessus. Le top serait de mettre en commun tout ça !
Si tu veux je peux t’aider à installer et utiliser vuepress. Je te contact sur le chat…
J’ai pas fait grand chose, c’est le thème de base…
Tu dis que tu t’occupe du contenu. Tu peux installer vuepress et faire un pull du site ?
Ce serait peut-être mieux de le mettre sur le gitlab ?
C’est juste les métadonnées non ?
Effectivement, ça, ça peut être utile pour le site de Silkaj.
Là je ne vais pas avoir le temps de m’occuper du site de Silkaj dans les mois à venir ; je suis trop occupé à retaper le site de Duniter et j’ai d’autres projets sur le feu également. Et je n’ai aucune envie d’apprendre des connaissances dont je n’ai pas besoin ; j’ai déjà assez de boulot comme ça
Yep. Comme tu as retravaillé la partie technique et que j’ai retravaillé la partie marketing, ce que tu peux faire si tu as la motiv c’est choper le dépôt de ma version Pelican, récupérer contenus, templates et CSS et passer tout ça sous Vue.js
Je veux dire mettre à jour le contenu actuel du site web, car le logiciel évolue constamment.
Non, pour l’instant ça va.
Tu veux dire créer un dépôt git sur GitLab.
Sinon, je viens m’occuper de mettre en place la CI/CD/GitLab Pages en place pour le nouveau site web, bien que c’est déjà le cas pour le site web actuel en mode basique.
Et Vuepress c’est compatible hébergé sur IPFS !!!
Ils refont même leur doc avec ! https://github.com/ipfs/ipfs-docs-v2
Oui c’est ça.
Ok. Je regarderais tout ça la semaine prochaine, j’aurais plus de temps…
Cool ! Ça va être pratique ça
Du coup c’est quoi la page de silkaj pour l’instant ? Faut que je mette le lien dans ma mindmap…
Ça n’a pas changé : https://silkaj.duniter.org
Le projet est toujours en cours.
J’ai avancé sur le site. J’ai fouillé toute la doc pour trouver toutes les commandes, fait des zolies images !
Mais j’ai passé vuepress en version 1.3 et ça merde et je galère avec netlify… Jai posé des questions sur le discord de vuepress hier mais pas encore de réponse…
En fait j’avais mis le dawa sur mon ordi entre yarn, npm et pnpm…
Bref, j’ai résolu le problème moi-même.
Quand je me suis lancé à refaire le site, c’était pour avoir une doc technique de l’outil ; trouver rapidement toutes les commandes que l’on peut faire avec Silkaj.
J’ai donc fait une bref présentation sur la page d’accueil les principales fonctionnalités, comment démarrer rapidement et j’ai gardé le laïus sur à quoi ça sert.
C’est dans le guide que j’ai mis toutes les commandes dispos. Mais il en manque :
allSource
ni ce que fait outputBackChange
?silkaj net
qui est buggé…argos
et BitBar
?Cette page guide est un peu longue avec les images. Peut-être qu’il faudrait la splitter en plusieurs pages…
Perso, je ne suis vraiment pas fan des sites “dark”, mais comme vous avez l’air d’affectionner ce côté sombre, je l’ai laissé par défaut et ajouté une option qui permet de basculer en mode light ou dark. Vous pouvez même changer les couleurs…
N’hésitez pas à faire des remarques et suggestions.
N’hésitez pas aussi à apporter les corrections (surtout en anglais, je suis pas une brute…)
Rappel :
C’est parce que tu ne connais pas le côté obscur de la Force.