Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 15KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="fr">
  4. <!-- Has to be within the first 1024 bytes, hence before the `title` element
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset="utf-8">
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name="viewport" content="width=device-width,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Qualité — David Larlet</title>
  13. <meta name="description" content="Quiconque cherche à circonscrire une discipline en lui imposant un cadre ne cherche généralement qu’à protéger son œuvre, et il le fait en perpétuant les standards qui ont permis son émergence. Celui-ci essaie de convaincre les générations à venir qu’elles doivent suivre les règles qu’il a édictées si elles comptent parvenir à l’excellence. Mais, comme disait Charles Bukowski, « il est quatre heures et demie du matin, il sera toujours quatre heures et demie du matin… ».">
  14. <!-- That good ol' feed, subscribe :). -->
  15. <link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
  16. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  17. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
  18. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
  19. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
  20. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  21. <link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
  22. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  23. <meta name="msapplication-TileColor" content="#f7f7f7">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
  26. <meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
  27. <!-- Documented, feel free to shoot an email. -->
  28. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  29. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  30. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  31. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  32. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  36. <script>
  37. function toggleTheme(themeName) {
  38. document.documentElement.classList.toggle(
  39. 'forced-dark',
  40. themeName === 'dark'
  41. )
  42. document.documentElement.classList.toggle(
  43. 'forced-light',
  44. themeName === 'light'
  45. )
  46. }
  47. const selectedTheme = localStorage.getItem('theme')
  48. if (selectedTheme !== 'undefined') {
  49. toggleTheme(selectedTheme)
  50. }
  51. </script>
  52. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  53. <article>
  54. <header>
  55. <h1>Qualité</h1>
  56. </header>
  57. <nav>
  58. <p class="center">
  59. <a rel="prev" href="/david/2023/01/09/" title="Publication précédente : Indépendant·e">← Précédent</a> •
  60. <nobr>
  61. <a href="/david/" title="Aller à l’accueil"
  62. ><svg class="icon icon-home">
  63. <use
  64. xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-home"
  65. ></use>
  66. </svg>
  67. Accueil</a
  68. >
  69. </nobr>
  70. <nobr>
  71. <a href="/david/recherche/" title="Aller à la page de recherche"
  72. ><svg class="icon icon-search">
  73. <use
  74. xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-search"
  75. ></use>
  76. </svg>
  77. Recherche</a
  78. >
  79. </nobr>
  80. • <a rel="next" href="/david/2023/01/11/" title="Publication suivante : Suspendu">Suivant →</a>
  81. </p>
  82. </nav>
  83. <hr>
  84. <blockquote>
  85. <p>Quiconque cherche à circonscrire une discipline en lui imposant un cadre ne cherche généralement qu’à protéger son œuvre, et il le fait en perpétuant les standards qui ont permis son émergence. Celui-ci essaie de convaincre les générations à venir qu’elles doivent suivre les règles qu’il a édictées si elles comptent parvenir à l’excellence. Mais, comme disait Charles Bukowski, «&nbsp;il est quatre heures et demie du matin, il sera toujours quatre heures et demie du&nbsp;matin…&nbsp;».</p>
  86. <p>Nous sommes à ce point focalisés sur le chemin que nous nous efforçons de suivre, en voulant toujours tout faire au mieux, armés d’une dévotion sans faille pour notre discipline <mark>alors que les œillères de la peur nous empêchent d’envisager des terrains inconnus,</mark> que nos yeux restent fixés sur cette route, sur ces mains qui prennent appui sur des genoux. Et nous ne réalisons pas que nous ne faisons que suivre les règles promulguées par un homme qui a un jour disputé une course contre des chevaux, ou par un autre qui s’est frotté à un sommet de plus de huit mille mètres sans oxygène, ou par un autre encore qui a décidé de laisser chez lui ses pitons, ses cordes et la sécurité pour ne faire qu’un avec les murs à escalader. Nous suivons les lois de ceux qui en ont enfreint de plus&nbsp;anciennes.</p>
  87. <p><cite><em>Au-delà des sommets</em>, Kilian&nbsp;Jornet</cite></p>
  88. </blockquote>
  89. <p>On parlait de code et de qualité avec <a href="https://thom4.net/">Thomas</a>. Je lui faisais part de ma frustration vis-à-vis d’un code qui n’avait pas été écrit par moi et que je trouvais problématique. En creusant un peu (merci&#8239;!), je réalise que ce qui coince est au niveau de la pérennité et de la transmission. Et j’ai aussi conscience de produire moi-même du code qui serait difficile à reprendre par d’autres personnes n’ayant pas les mêmes&nbsp;aspirations/compétences.</p>
  90. <p>En Python, on a la chance de pouvoir automatiser certaines conversions/vérifications qui tendent à aller vers une certaine uniformisation (et donc universalité&#8239;?)&nbsp;: <a href="https://github.com/psf/black">black</a>, <a href="https://flake8.pycqa.org/">flake8</a>, <a href="https://pypi.org/project/isort/">isort</a> ou <a href="https://mypy.readthedocs.io/">mypy</a> par&nbsp;exemple.</p>
  91. <p>Pour aller plus loin, le code en lui-même n’est peut-être pas si critique, mais ce que l’on a appris en le concevant et l’utilisant l’est bien davantage. C’est cette transmission qu’il est important de rendre possible au sein de l’équipe. Outiller la base commune est un moyen de <strong>plus rapidement</strong> passer à l’étape de partage des concepts importants/métiers, en ce souciant moins de la&nbsp;forme.</p>
  92. <p>Et peut-être au contraire, que cette <strong>vitesse</strong> acquise nous empêche d’échanger sur des concepts importants&#8239;? Des envies différentes&#8239;? Des choix à côté desquels on peut passer par manque&nbsp;d’attention.</p>
  93. <blockquote lang="en">
  94. <p>Tradition (n.): Peer pressure from dead&nbsp;people.</p>
  95. <p><cite><em>Lu plusieurs fois sur&nbsp;masto</em></cite></p>
  96. </blockquote>
  97. <hr />
  98. <blockquote>
  99. <p>🦋 Depuis quelques années, j’essaie d’écrire un code le plus direct&nbsp;possible.</p>
  100. <p>Mon objectif&nbsp;: diminuer au maximum ma charge&nbsp;cognitive.</p>
  101. <p><cite><em><a href="https://sklein.xyz/garden/020-keep-it-simple-stupid-le-plus-longtemps-possible/">Keep it simple, stupid le plus longtemps possible</a></em>&nbsp;(<a href="/david/cache/2023/646ebfa25432bc6b653e524b52d25c9a/">cache</a>)</cite></p>
  102. </blockquote>
  103. <blockquote lang="en">
  104. <p>⛵️ Many of the tools that we thought we could rely on broke down, whether it is Apple products, or software that require subscription services, DRM, etc. As an artist you spend time developing a skill, <mark>you become a Photoshop illustrator.</mark> When your connection to the internet fails and that the software locks up, that skill that you thought was yours was actually entirely owned by someone, and can be taken&nbsp;away.</p>
  105. <p>Even though we’ve been paying for this sort of software for years, the moment that you can’t have access to authenticate yourself that skill is gone. We didn’t expect this, it scared&nbsp;us.</p>
  106. <p><cite><em><a href="https://100r.co/site/weathering_software_winter.html">weathering software winter</a></em>&nbsp;(<a href="/david/cache/2023/c564325b28ec854b6b098950df5c8c8f/">cache</a>)</cite></p>
  107. </blockquote>
  108. <blockquote lang="en">
  109. <p>🔎 It’s important to remember concepts and high level approaches, but don’t worry about remembering the details. You can always look that stuff up when you need&nbsp;it.</p>
  110. <p><cite><em><a href="https://gomakethings.com/you-dont-have-to-remember-everything-to-be-a-good-programmer/">You don’t have to remember everything to be a good programmer</a></em>&nbsp;(<a href="/david/cache/2023/2f4b8ec8f6fd2cbc48a04dcac2cc7d24/">cache</a>)</cite></p>
  111. </blockquote>
  112. <nav>
  113. <p>
  114. <a href="/david/2023/accompagnement/"
  115. title="Liste de tous les articles 2023 associés à cette étiquette"
  116. >#accompagnement</a>
  117. <a href="/david/2023/qualite/"
  118. title="Liste de tous les articles 2023 associés à cette étiquette"
  119. >#qualité</a>
  120. <a href="/david/2023/technique/"
  121. title="Liste de tous les articles 2023 associés à cette étiquette"
  122. >#technique</a>
  123. <a href="/david/#tags-2023"
  124. title="Liste de toutes les étiquettes 2023"
  125. ><svg class="icon icon-tags">
  126. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-tags"></use>
  127. </svg>
  128. tous ?</a
  129. >
  130. </p>
  131. </nav>
  132. <nav>
  133. <p class="center">
  134. <a rel="prev" href="/david/2023/01/09/" title="Publication précédente : Indépendant·e">← Précédent</a> •
  135. <a href="/david/2023/" title="Liste des publications récentes">↑ En 2023</a>
  136. • <a rel="next" href="/david/2023/01/11/" title="Publication suivante : Suspendu">Suivant →</a>
  137. </p>
  138. </nav>
  139. </article>
  140. <hr>
  141. <footer>
  142. <p>
  143. <nobr>
  144. <a href="/david/" title="Aller à l’accueil"
  145. ><svg class="icon icon-home">
  146. <use
  147. xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-home"
  148. ></use>
  149. </svg>
  150. Accueil</a
  151. >
  152. </nobr>
  153. <nobr>
  154. <a href="/david/log/" title="Accès au flux RSS"
  155. ><svg class="icon icon-rss2">
  156. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-rss2"></use>
  157. </svg>
  158. Suivre</a
  159. >
  160. </nobr>
  161. <nobr>
  162. <a href="http://larlet.com" title="Go to my English profile" data-instant
  163. ><svg class="icon icon-user-tie">
  164. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-user-tie"></use>
  165. </svg>
  166. Pro</a
  167. >
  168. </nobr>
  169. <nobr>
  170. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"
  171. ><svg class="icon icon-mail">
  172. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-mail"></use>
  173. </svg>
  174. Email</a
  175. >
  176. </nobr>
  177. <nobr>
  178. <abbr
  179. class="nowrap"
  180. title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"
  181. ><svg class="icon icon-hammer2">
  182. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-hammer2"></use>
  183. </svg>
  184. Légal</abbr
  185. >
  186. </nobr>
  187. </p>
  188. <template id="theme-selector">
  189. <form>
  190. <fieldset>
  191. <legend><svg class="icon icon-brightness-contrast">
  192. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-brightness-contrast"></use>
  193. </svg> Thème</legend>
  194. <label>
  195. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  196. </label>
  197. <label>
  198. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  199. </label>
  200. <label>
  201. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  202. </label>
  203. </fieldset>
  204. </form>
  205. </template>
  206. </footer>
  207. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  208. <script>
  209. function loadThemeForm(templateName) {
  210. const themeSelectorTemplate = document.querySelector(templateName)
  211. const form = themeSelectorTemplate.content.firstElementChild
  212. themeSelectorTemplate.replaceWith(form)
  213. form.addEventListener('change', (e) => {
  214. const chosenColorScheme = e.target.value
  215. localStorage.setItem('theme', chosenColorScheme)
  216. toggleTheme(chosenColorScheme)
  217. })
  218. const selectedTheme = localStorage.getItem('theme')
  219. if (selectedTheme && selectedTheme !== 'undefined') {
  220. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  221. }
  222. }
  223. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  224. window.addEventListener('load', () => {
  225. let hasDarkRules = false
  226. for (const styleSheet of Array.from(document.styleSheets)) {
  227. let mediaRules = []
  228. for (const cssRule of styleSheet.cssRules) {
  229. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  230. continue
  231. }
  232. // WARNING: Safari does not have/supports `conditionText`.
  233. if (cssRule.conditionText) {
  234. if (cssRule.conditionText !== prefersColorSchemeDark) {
  235. continue
  236. }
  237. } else {
  238. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  239. continue
  240. }
  241. }
  242. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  243. }
  244. // WARNING: do not try to insert a Rule to a styleSheet you are
  245. // currently iterating on, otherwise the browser will be stuck
  246. // in a infinite loop…
  247. for (const mediaRule of mediaRules) {
  248. styleSheet.insertRule(mediaRule.cssText)
  249. hasDarkRules = true
  250. }
  251. }
  252. if (hasDarkRules) {
  253. loadThemeForm('#theme-selector')
  254. }
  255. })
  256. </script>
  257. </body>
  258. </html>