hscc

Soure code of <https://hugo.soucy.cc>.
git clone git://soucy.cc/hscc.git
Log | Files | Refs

commit 48b92812f31784905b41fd5d0ca1827c285625e7
parent a158a13378a12a346002df04177553fd05dd17c4
Author: Hugo Soucy <hugo@soucy.cc>
Date:   Thu, 15 Sep 2022 20:47:10 -0400

Modify several content.

Diffstat:
Mcontent/2021/nt/abolition-de-limpot-foncier.md | 3++-
Mcontent/2022/index.md | 4++--
Mcontent/2022/mp/smol-pub.lua | 2+-
Mcontent/humans.txt | 7+++----
Mcontent/index.html | 2+-
Mcontent/now.md | 85++++++++++++++++++++++++++++++++++---------------------------------------------
Mcontent/progpol.md | 97+++++++++++++++++++++++++++++++++++++++++++++++++++++++++----------------------
Mcontent/uses.html | 56+++++++++++++++++++++++++++++++++-----------------------
Dcontent/webdev-unix/css.lua | 5-----
Dcontent/webdev-unix/css.md | 165-------------------------------------------------------------------------------
10 files changed, 149 insertions(+), 277 deletions(-)

diff --git a/content/2021/nt/abolition-de-limpot-foncier.md b/content/2021/nt/abolition-de-limpot-foncier.md @@ -6,7 +6,8 @@ Dans le monde municipal il y a des gens qui militent ... * pour la protection des terres agricoles, * pour la protection des milieux humides, * pour le transport actif, -* pour la qualité de l'air. +* pour la qualité de l'air, +* etc. Les villes sont dépendantes de l'impôt foncier que sont les taxes municipales, et c'est ce qui entraîne les problèmes listés ci-dessus. diff --git a/content/2022/index.md b/content/2022/index.md @@ -1,5 +1,5 @@ <h1 class="p-name">Publications de <time>2022</time></h1> -Filtrer par <s>textes</s>, [notes](nt), [marques pages](mp), ou -<s>réponses</s>. Sinon il y a aussi la page des +Filtrer par [textes](tx), [notes](nt), [marques pages](mp)<s>, ou +réponses</s>. Sinon il y a aussi la page des [archives](/archives.html). diff --git a/content/2022/mp/smol-pub.lua b/content/2022/mp/smol-pub.lua @@ -4,5 +4,5 @@ return { date = "2022-02-11", datetime = "10:11:18", posttype = "bookmark", - keywords = { "service","gemini","gopher","smol web", } + keywords = { "service","gemini","gopher","smolnet", } } diff --git a/content/humans.txt b/content/humans.txt @@ -1,13 +1,12 @@ "humans.txt" <http://humanstxt.org/> -/* WebDev */ +/* Web developement and content */ Hugo Soucy -Email: hugo@soucy.cc +Email: hs0ucy@soucy.cc XMPP: hs0ucy@soucy.cc Mastodon: https://mastodon.sdf.org/@hs0ucy -Github: https://github.com/hs0ucy +Git forge: https://codeberg.org/hs0ucy From: Lévis, Québec, Canada -www: https://soucy.cc/ /* Profile picture */ Sophie Perreault-Allen diff --git a/content/index.html b/content/index.html @@ -28,7 +28,7 @@ <a class="u-url u-uid" href="#hs" rel="me">Je</a> suis ce qu'on appelle un humain (enfin, c'est ce qu'on m'a dit), et accessoirement un <a href="/file/curriculum-vitae.html#cv" property="sameAs"><span class="p-job-title" property="jobTitle" title="ou intégrateur web ou webmestre ou programmeur en robustesse esthétique">développeur web front-end</span></a>. Ici, se trouve mon port d'attache en ligne, où je me manifeste généralement sous le pseudo <strong class="p-nickname" property="foaf:nick" title="ou h50ucy">hs0ucy</strong>. Je suis surtout présent sur <span typeof="foaf:OnlineAccount" property="foaf:account"><a href="https://bandcamp.com/hs0ucy" property="foaf:accountProfilePage" rel="external nofollow me"><span property="dc:title">Bandcamp</span></a></span>, <span typeof="foaf:OnlineAccount" property="foaf:account"><a href="https://mastodon.sdf.org/@hs0ucy" property="foaf:accountProfilePage" rel="external nofollow me"><span property="dc:title">Mastodon</span></a></span>, <a href="/xmpp.html">XMPP</a>. J'ai quelques commits sur <a href="https://soucy.cc/git/" rel="external">Git</a>&hellip;<a href="https://codeberg.org/hs0ucy" rel="external">Git</a>&hellip;<span typeof="foaf:OnlineAccount" property="foaf:account"><a href="https://github.com/hs0ucy" property="foaf:accountProfilePage" rel="external nofollow me"><span property="dc:title">GitHub</span></a></span>. Hors ligne, on peut me croiser dans les rues de <span typeof="http://schema.org/PostalAddress" property="address"><strong class="p-locality" property="addressLocality">Lévis</strong></span> ou Québec. </p> - <p> Sinon, vous pouvez communiquer avec moi par courriel, à l'adresse <a href="mailto:hugo@soucy.cc" property="email" rel="me"> <span class="u-email">hugo@soucy.cc</span></a> ou par XMPP, à <a href="xmpp:hs0ucy%40soucy.cc" rel="me">hs0ucy@soucy.cc</a>. N'hésitez pas. Je suis aussi toujours partant pour aller prendre un <strong property="foaf:interest" resource="http://dbpedia.org/page/Coffee">café</strong> ☕ (ou quatre).</p> + <p> Sinon, vous pouvez communiquer avec moi par courriel, à l'adresse <a href="mailto:hs0ucy@soucy.cc" property="email" rel="me"> <span class="u-email">hs0ucy@soucy.cc</span></a> ou par XMPP, à <a href="xmpp:hs0ucy%40soucy.cc" rel="me">hs0ucy@soucy.cc</a>. N'hésitez pas. Je suis aussi toujours partant pour aller prendre un <strong property="foaf:interest" resource="http://dbpedia.org/page/Coffee">café</strong> ☕ (ou quatre).</p> <p> <a href="/2022">Dans ma soupe</a> je vois les <strong property="foaf:interest" resource="http://dbpedia.org/resource/FLOSS" title="FLOSS">logiciels libres et open-source</strong>, comme <strong property="foaf:interest" resource="http://dbpedia.org/resource/Emacs">Emacs</strong>, <strong property="foaf:interest" resource="http://dbpedia.org/resource/OpenBSD">OpenBSD</strong> 🐡, <strong property="foaf:interest" resource="http://dbpedia.org/resource/Manjaro_Linux">Manjaro</strong>, <strong property="foaf:interest" resource="http://dbpedia.org/page/Syncthing">Syncthing</strong>, etc; les <strong property="foaf:interest" resource="http://dbpedia.org/resource/Shell_script">shell scripts</strong>, le <strong property="foaf:interest" resource="http://dbpedia.org/page/Lua_(programming_language)">Lua</strong> script, le <strong property="foaf:interest" resource="http://dbpedia.org/resource/JavaScript">JavaScript</strong>; les <strong property="foaf:interest" resource="http://dbpedia.org/page/Web_standards">standards du Web</strong> et tout ce qui touche à l'<a href="/a-propos.html#ind">indépendance numérique</a> des utilisateurs. <a href="/now.html#jm">J'aime</a> la <strong property="foaf:interest" resource="http://dbpedia.org/resource/Politics">politique</strong> sans les politiciens, la <strong property="foaf:interest" resource="http://dbpedia.org/resource/Reading_(process)">lecture</strong>, la poésie, le <strong property="foaf:interest" resource="http://dbpedia.org/resource/Bicycle">vélo</strong>, la <strong property="foaf:interest" resource="http://dbpedia.org/page/Pizza">pizza</strong> 🍕 et les <strong property="foaf:interest" resource="http://dbpedia.org/resource/Sandwich">sandwichs</strong> 🥪. Wannabe <strong property="foaf:interest" resource="http://dbpedia.org/resource/Local_food">locavore</strong> et <em property="foaf:interest" resource="https://dbpedia.org/page/Canning">appertisan</em> (canneux) 🥫. diff --git a/content/now.md b/content/now.md @@ -6,45 +6,26 @@ page"?](https://nownownow.com/about)).* ## Professionnellement ## -Je [télé-]travaille 30 heures par semaine comme [développeur web -front-end](/file/curriculum-vitae.html "mon curriculum vitae") dans -une boîte en TI de la ville de Québec, qui s'appelle -[Toumoro](https://toumoro.com). - -Je programme des <strong title="responsive Web design">interfaces web -réactives</strong> et **accessibles**, avec HTML, CSS et -Javascript. Souvent pour des projets qui tournent sous le CMS Typo3. +Dernièrement, j'ai travaillé sur la refonte de la vitrine linguistique +<https://vitrinelinguistique-beta.oqlf.gouv.qc.ca/> de l'Office +québécois de la langue française. ## Personnellement ## Je suis papa de jeunes enfants, alors le *ici et maintenant* de ma compagne et moi, leur est souvent consacré. -## Temps de cerveau disponible ## - -### Lecture / écriture ### - -Ces temps-ci je lis beaucoup de poésie et d'essais politiques. - -[J'écris un peu ici](/2021), puis je griffonne un petit carnet noir. - -### Musique ### +--- -Je traîne toujours sur **bandcamp** à la recherche de nouvelles choses -à écouter. Sinon, -[Diorama](https://bonenfant.bandcamp.com/album/diorama) et l'album -éponyme de [Bon -enfant](https://bonenfant.bandcamp.com/album/bon-enfant), [Kaitlyn -Aurelia Smith](https://kaitlynaureliasmith.bandcamp.com/), [Tour de -machine](https://emerance.bandcamp.com/album/tour-de-machine) et -[Forêt mixte](https://emerance.bandcamp.com/album/for-t-mixte) -d'Émérance, sont souvent dans mes oreilles ces derniers temps. +Sinon, je m'intéresse de plus en plus aux plantes indigènes et +adventices, ainsi qu'aux champignons. Je suis d'ailleurs membre du +cercle de mycologie des Appalaches. -### Potagers ### - -Nos deux potagers sont maintenant sous la neige. Ces temps-ci nous -cusinons plutôt nos réserves [de tomates] et nous nous demandons si -nous ne devrions pas faire aussi pousser de la bouffe dans la maison. +Dans un avenir proche, j'aimerais suivre une formation en +**herboristerie**, et ensuite une formation spécialisée en <abbr +title="Produits forestiers non ligneux ou produits forestiers +comestibles et transformables">PFNL</abbr>, que l'on appelle aussi les +**forestibles**. ### Projets ### @@ -61,30 +42,38 @@ documentation en français et en anglais. de commande pour optimiser les fichiers CSS, en retirant les sauts de ligne, les commentaires et les espaces autour de certains symboles. -#### SDWD #### +#### Small Internet #### + +Ces temps-ci j'explore un peu les anciens protocoles de +l'Internet. J'ai installé un serveur gopher **geomyidae** et le +serveur finger d'OpenBSD. -Je travaille aussi à la mise sur pied, dans mon quartier, d'un groupe -d'entraide en conception de site web amateur, qui s'appellera [La -Société des Webmestres -Disparus](https://mobilizon.fedi.quebec/@sdwd). L'idée est de se -réunir au mois ou aux deux mois pour présenter un projet de site web, -poser des questions, demander de la rétroaction ou du soutient -technique. +Dans le même ordre d'idée, je crois que je vais installer aussi un +serveur gemini et un FTP pour partager des livres ou autres genre de +contenu. <a id="jm"></a> -## Soutiens et abonnements ## +## Soutiens et abonnements du moment ## -* <ins>[Small Technology Foundation](https://small-tech.org/)</ins> +* <ins>[Planet: Critical](https://www.planetcritical.com/)</ins> +* [FACiL](https://facil.qc.ca "FACIL, pour l'appropriation collective de l'informatique libre (FACIL) est un organisme sans but lucratif dont le mandat est de promouvoir l'adoption, l'usage et la démocratisation de l'informatique libre.") +* Cercle de mycologie des Appalaches +* [VéloCentrix](https://www.velocentrix.org/) +* [Pivot](https://pivot.quebec/) +* [Small Technology Foundation](https://small-tech.org/) * [Dino](https://dino.im/ "Dino is a modern open-source chat client for the desktop.") * [Le Filon](https://filon.ca/) * [Pirate Production](https://pirateproduction.ca/) -* <del>Fedi.quebec</del> (hors service) * [Wikimedia Foundation](https://wikimediafoundation.org/) * [SDF pubnix](https://sdf.org/?welcome "The Super Dimension Fortress is a networked community. It is operated -as a recognized non-profit 501(c)(7) and is supported by its members.") (membre MetaARPA) -* [Aeon Magazine](https://aeon.co/) -* [Revue À bâbord!](https://www.ababord.org/) -* [Le Soleil](https://www.lesoleil.com/) -* [Le Devoir](https://www.ledevoir.com/) -* <del>[La Presse](https://www.lapresse.ca)</del> <ins>[Pivot](https://pivot.quebec/)</ins> +as a recognized non-profit 501(c)(7) and is supported by its members.") + +### Passés + +* <del>[Revue À bâbord!](https://www.ababord.org/)</del> +* <del>[Aeon Magazine](https://aeon.co/)</del> +* <del>[Le Soleil](https://www.lesoleil.com/)</del> +* <del>[Le Devoir](https://www.ledevoir.com/)</del> +* <del>[La Presse](https://www.lapresse.ca)</del> +* <del>Fedi.quebec</del> diff --git a/content/progpol.md b/content/progpol.md @@ -3,10 +3,11 @@ *Ceci est (ou pas) un programme politique [en rédaction] qui ne cherche pas de parti politique*. ---- +<details> + <summary>Le mot *permablitz* est la contraction de **permaculture** et de +**blitz**.</summary> -Le mot *permablitz* est la contraction de **permaculture** et de -**blitz**, ici blitz signifie simplement un effort concentrer afin +Ici, blitz signifie simplement un effort concentrer afin d'accomplir une tâche précise. J'ai emprunté ce terme au monde de la permaculture, là où un @@ -18,6 +19,9 @@ etc. Ici la corvée est l'atténuation des effets de la descente énergétique et écologique qui se pointe à l'orizon. +Voir <https://www.permablitz.net/about-permablitz/what-is-a-permablitz/>. +</details> + --- * Suppression du ministère de l'environnement. Puisqu'il ne peut plus @@ -29,56 +33,94 @@ et écologique qui se pointe à l'orizon. la nature [planétaire] et l'épanouissement de ceux qui y vivent. * Cesser de gérer le territoire avec le PIB et la rareté ... Il n'y pas d'autre richesse que celle que peut nous offrir la nature (dont - les humains font parti). Il n'y a rien de rationnelle ou de logique + les humains font partie). Il n'y a rien de rationnel ou de logique à gaspiller ce qui devient irremplaçable. + * Le PIB ne peut exister sans la destruction de la nature, + les deux sont lié par un pacte de sang. * La rareté n'est pas le mode opératoire dans la nature, et il ne devrait pas être le nôtre non plus. Quand je vois un pommier dont - les branches croulent sous le poid des pommes, un pommier qui a + les branches croulent sous le poids des pommes, un pommier qui a poussé du pépin d'une seule pomme, je ne vois pas la rareté, je vois l'abondance que nous offre la nature. * Nous avons abusé de cette abondance en se l'appropriant pour aquérir de la puissance envers nos frères et nos soeurs et envers la nature elle-même. -* Le territoire et ses ressources doivent être gérer par et pour les - collectivités qui s'y trouvent. Répondre aux besoins primaires (voir - Maslow). Puis échanger ou vendre les surplus avec nos voisin(e)s. - * L'économie à la base est un mécanisme pour répondre à ces besoins +* Le territoire et ses ressources doivent être gérés par et pour les + collectivités qui s'y trouvent. Répondre aux besoins primaires. Puis échanger ou vendre les surplus avec nos voisines et nos voisins. + * L'économie à la base est un mécanisme pour répondre aux besoins primordiaux. * Ce que nous appelons de nos jours, économie c'est la machine financière qui se suffit à elle-même, et qui nous mène à notre perte en broyant notre héritage. -* Élimination de l'impôt foncier et tout ce qui mène à la spéculation +* Élimination de l'[impôt foncier](/2021/nt/abolition-de-limpot-foncier.html) et tout ce qui mène à la spéculation immobilière et de toute autre forme de spéculation sur ce qui est nécessaire pour vivre. -* L'éducation doit décloisonnée, libre et gratuite. Elle ne doit plus +* L'éducation doit être décloisonnée, libre et gratuite. Elle ne doit plus être en charge de reproduire la pyramide sociale. Elle ne doit plus - être au service des entreprises. Elle doit nourire la curiosité et - toutes les formes d'intelligence. Chacun(e) peut-être élève ou + être au service des entreprises. Elle doit nourrir la curiosité et + toutes les formes d'intelligence. Chacun(e) peut être élève ou maître selon l'endroit, le moment, ou la période de sa vie. - * Notre système a aussi créé la rareté des cerveaux, puisqu'en créant des conditions sociales qui compliquent l'accès à l'éducation, sans raisons valables, nous tournons collectivement le dos à l'apport de millions de cerveaux humains. + * Nous devons former des citoyens, pas des consommateurs. + * Notre système a aussi créé la rareté des cerveaux, puisqu'en créant des conditions sociales qui compliquent l'accès à l'éducation, sans raisons valables, en plus de perpétuer la misère et la soumission au marché, nous tournons collectivement le dos à des gens qui auraient sans doute voulu contribuer autrement à la société. * Certains parlent souvent de la créativité et de l'innovation qu'apporterait la compétition au sein du capitalisme, mais la compétition, n'est pas l'exclusivité du capitalisme, elle se trouve aussi sous d'autres formes, qui sont probablement moins destructrices. Il peut y avoir compétition en même temps que de la collaboration et elle peut-être non violente et inclusive sans empêcher des avancés spectaculaires. + * La soi-disant compétition de notre capitalisme n'existe pas vraiment, puisqu'au bout du compte elle ne sert qu'à créer des monopoles qui concentrent toujours davantage les pouvoirs. * La santé doit être l'affaire de tous et toutes. Elle doit d'abord - partir de nous même, de notre environment. Elle doit prévenir - d'abord et guérir ensuite. + partir de nous-mêmes, de notre environnement. Elle doit prévenir + d'abord et guérir ensuite. La grande majorité des peuples indigènes l'avaient compris et appliqués avec une grande sophistication. * Les actions politiques doivent êtres cohérentes avec la santé - publique ... Pourquoi subventionner un domaine qui contribut à - détérioé la santé des citoyens et alors à moyen et long terme + publique ... Pourquoi subventionner un domaine qui contribue à + détériorer la santé des citoyens et alors à moyen et long terme fragilisé le système de santé. -* Encourager l'utilisation et la recherche des énergies renouvelables - passives. -* Encourager l'utilisation et la recherche à propos des lowtechs. +* Encourager l'utilisation (et la recherche) des énergies renouvelables + **passives**. +* Encourager l'utilisation (et la recherche) des **lowtechs**. + * Filtration de l'eau, comme par exemple, avec des étangs intégrés dans les zones urbaine; + * décontamination par les plantes [hyperaccumulatrices] et les champignons; + * capteurs de brume communautaire ou domestique; + * Depuis des millénaires, les humains ont fait de la lowtech, et à la lumière de nos connaissances actuelles et futures, nous sommes en mesure de se les réapproprier. Voir <https://solar.lowtechmagazine.com/>, <https://lowtechlab.org/fr> ... + * Ce n'est pas du primitivisme, ni un retour en arrière, puisque nos connaissances ont progressé dans tous les domaines, nous sommes en mesure de faire évoluer ces techniques, de tester leur efficacité, d'en développer des nouvelles. Dans un monde qui aura moins d'apport en énergies fossiles et en matières premières, les lowtechs seront probablement un passage obligé. +* Encourager l'utilisation (et la recherche) des modes de gouvernances **glocales** ([penser fractal](https://www.radiofrance.fr/franceculture/podcasts/science-en-questions/comment-donner-du-gout-au-monde-de-demain-9372615)). + * Le but étant l'autonomisation politique. + * S'inspirer de pratiques dans la démocratie Athénienne; voir klérotèrion, ostracisme, ... + * L'intégration des premiers peuples dans les cercles de décisions est primordiale dans un avenir proche ... Une démocratie fractalisée permet cela. + * Je parle ici des abénaquis, algonquins, attikameks, cris, hurons-wendats, innus, inuits, malécites, micmacs, mohawks et naskapis. + * Nous avons déjà plusieurs niveaux de gourvernances: conseils de quartier, municipalités, municipalités régionales de comté (MRC), conférences régionales des élus (disparus depuis 2016), provinces, pays. Le problème c'est qu'ils ne sont pas tous reliés et que les décisions se prennent, la plupart du temps, du haut vers le bas de façon très centralisé. L'idée serait d'inverser la pyramide et de fédérer tous les paliers de gouvernances. * Désindustrialiser ce qui pourrait l'être. Comme une bonne partie de l'alimentation par exemple. -* Réduire la **surproduction** de produits de consommation "inutiles". Réaiguiller un fraction de cette énergie sauvée vers quelque chose de plus constructif? La recherche fondamentale? L'exploration spatiale? -* Combattre l'obsolescence programmée en randant responsables les +* Réduire la **surproduction** de produits de consommation "inutiles". Réaiguiller une fraction de cette énergie sauvée vers quelque chose de plus constructif? La recherche fondamentale? L'exploration spatiale? Il faut déterminer ensemble où doit être focalisé notre énergie. +* Combattre l'obsolescence programmée en rendant responsables les entreprises qui produisent des biens jetables qui ne durent pas. * Développer la distribution de biens en éliminant le plus possible l'emballage et réduire le transport. * Miser sur la préservation des parcs informatiques en encourageant la - préservation et la réparation du matériels. + préservation et la réparation du matériel. * Miser sur la préservation des parcs informatiques en supportant le logiciel libre, tant par la formation que la contribution financière et humaine. -* ... +* Modifier l'urbanisme de nos villes et l'aménagement de nos territoires pour favoriser leur renaturalisation, leur réensauvagement. +* Modifier l'urbanisme pour favoriser les transports collectifs (gratuits) et actifs ... + * Est-ce que le otransport des marchandises vers et à l'intérieur des localités pourraient s'intégrer aux réseaux de transport collectif? + * Sortir de l'auto-solo, car transporter moins de 200 kg dans un véhicule qui lui pèse près d'une tonne, ne fait pas beaucoup de sens. +* Favoriser dans les localités, la mise en place des communs et des systèmes d'échanges locales (SEL). +* Augmenter le nombre de bibliothèque et étendre leur mandat. En plus des livres et autres documents culturels, intégrer des bibliothèques d'outils (construction, mécanique, cuisine), de semences, d'instruments de musique; des ateliers de réparation, etc; puis proposer des volets éducatifs liés à ces domaines. + * À noter que c'est déjà le cas dans certaines bibliothèques. + * Les bibliothèques comme épicentres de la transmission des connaissances et de la transmission techniques et supporter les citoyens dans la mise en place de communs. + * Ils pourraient y avoir des écrivains publiques, des juristes publiques, de la littératie [numérique], etc. Les biblothèques seraient comme des universités populaires. +* Dans ce permablitz, une des mesures phare est la restauration des sols. La santé du sol est essentiel à notre survie à moyen-long terme. Depuis des décennies, il a été attaqué par le labour, les pesticides, la monoculture, etc. Voir <https://regenerationcanada.org/fr/>. + * Restaurer notre microbiote, en restaurant notre sol pour consommer de la nourriture régénératrice ... c'est aussi une mesure de santé public. + * C'est du développement économique, une économie basée sur la restauration de la nature et la collaboration avec celle-ci ... puisqu'en lui redonnant sa santé, elle nous rendra la notre également. +* Miser sur le développement des forêts nourricières partout, en ville, en banlieue, en campagne. +* Restaurer la santé de nos cours d'eau et celle de notre grand fleuve Saint-Laurent. Miser sur la production d'algue et autre produits marins le long de ses cotes. Refuser la sur-pêche. + * Il faut travailler avec nos territoires, nos géographies, vivre en symbiose, en interdépendance. +* ... à suivre. ---- +## Post-scriptum + +Bien sûr, toutes ces idées, je ne les ai pas inventé. Elles ont été +glané, ici et là, au fil du temps. Elles sont regroupées et remixées +ici, dans ce faux programme politique, parce qu'elles me paraissent +essentielles; parce qu'elles m'aident à vivre et à espérer une société +meilleure. Il faut imaginer et rêver son avenir, comme on imagine et +on rêve notre prochain festin d'anniversaire. Sans ce travail +d'inventivité, nous resterons toujours, loin de la coupe aux lèvres. -Source: <https://www.permablitz.net/about-permablitz/what-is-a-permablitz/> +Il y a des forces, en nous-même et en ce bas monde, qui font tout pour +être l'éteignoir de notre imaginaire. Il faut les combattre. +\ No newline at end of file diff --git a/content/uses.html b/content/uses.html @@ -5,7 +5,7 @@ <dt>Un portable <strong>Lenovo T430s</strong></dt> <dd> Il a été acheté usagé. Son système d'exploitation est <a href="https://www.openbsd.org/" rel="external nofollow">OpenBSD - 7.0</a> et son gestionnaire de fenêtre est <a href="https://man.openbsd.org/cwm.1" rel="external nofollow">cwm</a>. + 7.0</a> et son gestionnaire de fenêtre est <a href="https://man.openbsd.org/cwm.1" rel="external nofollow">cwm</a>. </dd> <dt>Un mini portable <strong>HP Mini 110</strong></dt> @@ -16,8 +16,8 @@ <dt>Un téléphone <strong>LG G5</strong></dt> <dd>C'est un téléphone android dont les bidules Google sont presque - tous désactivés. Mes applications viennent principalement de - F-Droid.</dd> + tous désactivés. Mes applications viennent principalement de + F-Droid.</dd> </dl> <h2>Logiciels</h2> @@ -27,31 +27,41 @@ <dd>Éditeur texte, lecteur <a href="https://fr.wikipedia.org/wiki/Gopher" rel="external nofollow">Gopher</a> et <a href="https://gemini.circumlunar.space/" rel="external nofollow">Gemini</a> (Elpher), etc.</dd> <dd><a href="https://soucy.cc/git/emacs.d/files.html" rel="external">Ma - configuration Emacs</a>.</dd> + configuration Emacs</a>.</dd> <dd>Parfois j'utilise aussi <b>mg</b> ou GNU/<b>nano</b>, et je suis - capable de sortir de vi[m] ;). + capable de sortir de vi[m] ;). - <dt>Mozilla <b>Firefox</b></dt> - <dd>Navigateur web.</dd> - <dd>Avec les extensions suivantes: Awesome RSS, DuckDuckGo Privacy - Essentials, Facebook Container, Flagfox, Grammalecte, humans.txt, - Privacy Badger, Tota11y, WAVE Evaluation Tool, Web Developer.</dd> + <dt>Mozilla <b>Firefox</b></dt> + <dd>Navigateur web.</dd> + <dd>Avec les extensions suivantes: Awesome RSS, DuckDuckGo Privacy + Essentials, Facebook Container, Flagfox, Grammalecte, humans.txt, + Privacy Badger, Tota11y, WAVE Evaluation Tool, Web Developer.</dd> - <dt><b>xterm</b> (avec tmux)</dt> - <dd>Émulateur de terminal.</dd> + <dt><b>xterm</b> (avec tmux)</dt> + <dd>Émulateur de terminal.</dd> - <dt><b>Alpine</b></dt> - <dd>Client courriel pour terminal.</dd> - <dd>En déplacement, j'utilise les clients web Rouncube ou SOGo.</dd> + <dt><b>Alpine</b></dt> + <dd>Client courriel pour terminal.</dd> + <dd>En déplacement, j'utilise les clients web Rouncube ou SOGo.</dd> - <dt><b>Dino</b></dt> - <dd>Client de messagerie instantanée <abbr title="Extensible Messaging and Presence Protocol">XMPP</abbr>.</dd> + <dt><b>Dino</b></dt> + <dd>Client de messagerie instantanée <abbr title="Extensible Messaging and Presence Protocol">XMPP</abbr>.</dd> - <dt><b>Inkscape</b></dt> - <dd>Création et édition de fichiers <abbr title="Scalable Vector Graphics">SVG</abbr>.</dd> + <dt><b>Inkscape</b></dt> + <dd>Création et édition de fichiers <abbr title="Scalable Vector Graphics">SVG</abbr>.</dd> - <dt><b>Gimp</b></dt> - <dd>Édition d'image matricielle.</dd> - - <dt>...</dt> + <dt><b>Gimp</b></dt> + <dd>Édition d'image matricielle.</dd> + + <dt>...</dt> </dl> + +<hr/> + +<p>Dans le temps, il y avait le site <a href="http://www.utilise.ca/" rel="external nofollow">utilise.ca</a>:</p> + +<blockquote> + <p>"Utilise.ca est un regroupement de mini-entrevues avec des geeks + francophones qui nous partagent les outils qu’ils utilisent au + quotidien pour accomplir leur travail."</p> +</blockquote> diff --git a/content/webdev-unix/css.lua b/content/webdev-unix/css.lua @@ -1,5 +0,0 @@ -return { - title = "CSS et Unix (le développement web sous Unix)", - date = "2022-03-24", - datetime = "15:10:22", -} diff --git a/content/webdev-unix/css.md b/content/webdev-unix/css.md @@ -1,165 +0,0 @@ -# CSS et Unix - -<!-- * Design system basé sous des fichiers CSV --> -<!-- * Surveiller les changements avec `entr`. --> - -## Regrouper plusieurs feuilles de styles ensemble sous Unix - -À des fins de performance, cela peut-être une bonne idée de regrouper -nos feuilles de styles pour réduire le nombre de requêtes HTTP. - -Si avec HTTP 1.1, c'était bien vue de ne servir qu'un seul fichier -CSS. Avec HTTP 2, il est conseillé de découper ses feuilles en -plusieurs ballots hiérarchisés, plutôt qu'en un seul gros bloc de -code. - -À ce sujet, voir le banc d'essai de Harry Roberts: [CSS and Network -Performance](https://csswizardry.com/2018/11/css-and-network-performance/). - -### Règle `@import` - -La règle CSS `@import`, n'est pas conseillé en production pour -justement une question de performance. - -Alors quelle autre option nous reste-t-il si on veut découper nos -styles sans passer par un préprocesseur? - -### Utilitaire `cat` - -Pour concaténer des fichiers ensemble sous Unix il faut utiliser -l'utilitaire `cat`. - - cat - concatenate and print files - -Avec peu de fichiers CSS, on peut simplement faire: - - cat a.css b.css c.css d.css e.css f.css > styles.css - -En voulant être plus concis cela serait: - - cat *.css > styles.css - -Mais en CSS l'ordre des déclarations est important. Nous ne voudrions -pas neutraliser ou déclasser certains styles. - -Dans les utilitaires du shell il y a un flux entrant (standard input ou -stdin) et un flux sortant (standard output ou stdout). La lecture se -fait par le **stdin** et l'écriture par le **stdout**. Il y a aussi un flux -sortant pour les erreurs (standard error ou stderr). - -Il est toutefois possible détourner ces flux. Comme par exemple avec -`<` ou `>` en appliquant des redirections vers un fichier, comme dans -mon exemple ci-haut, avec l'utilitaire `cat`, où l'on redirige la -sortie vers le fichier `styles.css`. Sans cette redirection le -résultat s'afficherait dans le terminal avec `stdout`. - -La redirection d'entrée utilise le symbole `<`. Cela permet d'indiquer -qu'un fichier sera passé en *stdin*. - -### Concaténer une liste de CSS avec `while`, `read` et `<` - -Maintenant nous allons utilser une boucle de type `while`, combiné -avec l'utilitaire `read`, pour concaténer un groupe de fichiers CSS. - -Notre liste se trouve dans un fichier nommé `global-styles.txt`. Nous -y avons inscrit une feuille de style par ligne: - - global/tokens/typography.css - global/tokens/colors.css - global/tokens/grid.css - - global/base.css - global/a11y.css - -Ensuite, notre script sera dans un autre fichier que nous appellerons -`css.sh`: - - #!/bin/sh - - while read -r line; do - [ -n "$line" ] && cat "./$line" - done < global-styles.txt - - -Attention, il est important de s'assurer que ce fichier soit -exécutable (`chmod u+x css.sh`), avant de lancer la commande: - - ./css.sh - -Si tout s'est bien passé, on constate que le contenu de toutes les -feuilles que nous avons listées s'affichent dans le terminal. - -Dans ce script, la valeur de chaque ligne est assignée à la variable -`line`. Puis `[ -n "$line" ]`, teste si la chaîne de caractère -retournée par `$line` n'est pas `null` avant de d'exécuter `cat`. Et -finalement, notre liste est dirigée dans la boucle avec `<`. - -L'étape suivante serait de rediriger `stdout` vers un fichier CSS avec -`>`: - - #!/bin/sh - - while read -r line; do - [ -n "$line" ] && cat "./$line" - done < global-styles.txt > global.css - - -On pourrait aussi ne pas vouloir de fichier `.txt` et lister -directement dans le script les fichier à concaténer: - - #!/bin/sh - - while read -r line; do - [ -n "$line" ] && cat "./$line" - done <<EOF - global/tokens/typography.css - global/tokens/colors.css - global/tokens/grid.css - - global/base.css - global/a11y.css - EOF - - -Ici `EOF` est une commande qui permet de faire une entrée -multiligne. Donc toutes les lignes qui se trouve entre `<<EOF` et -`EOF` est passé à `stdin`. - -## Minifier une feuille de style avec `tr` pour réduire son poid - -L'utilitaire `tr` sert à *traduire* ou éliminer des caractères. Il va -permettre de retirer les sauts de ligne et les retours dans notre CSS, -pour ramener toutes les règles sur une seule ligne. Le poid du fichier -sera donc un peu moindre: - - cat global.css | tr -d '\n\r' > "$global.min.css" - -Ce n'est pas la façon la plus optimale de minifier, mais avec -plusieurs feuilles style cela permet de faire des gains de plusieurs -kilooctets. Sinon avec l'utilitaire `sed`, il est sans doute possible -d'améliorer la soustraction. - -<!-- https://siongui.github.io/2016/03/11/makefile-concetenate-and-minify-css-via-sed-and-tr/ --> -<!-- https://www.tero.co.uk/scripts/minify.php --> -<!-- https://mohammadthalif.wordpress.com/2016/07/25/how-to-minify-css-using-simple-bash-commands/ --> - -Le caractère `|`, que l'on appelle *pipe*, sert à lier deux processus -en prenant le flux de sortie du premier, pour en faire le flux -d'entrée du second. - -Rendu ici, on peut mettre ensemble la concaténation et minification: - - #!/bin/sh - - while read -r line; do - [ -n "$line" ] && cat "./$line" - done <<EOF | tr -d '\n\r' > "global.min.css" - global/tokens/typography.css - global/tokens/colors.css - global/tokens/grid.css - - global/base.css - global/a11y.css - EOF - ----