davidbgk
/
larlet-fr-david-cache

<!doctype html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang=fr>
<!-- Has to be within the first 1024 bytes, hence before the <title>
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
<meta charset=utf-8>
<!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
<!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
<meta name=viewport content="width=device-width,minimum-scale=1,initial-scale=1,shrink-to-fit=no">
<!-- Required to make a valid HTML5 document. -->
<title>Comment ne pas se laisser dévorer par la veille techno ? (archive) — David Larlet</title>
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="/static/david/icons/favicon.ico">
<meta name="apple-mobile-web-app-title" content="David Larlet">
<meta name="application-name" content="David Larlet">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">
<meta name="theme-color" content="#f0f0ea">
<!-- That good ol' feed, subscribe :p. -->
<link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">

  <meta name="robots" content="noindex, nofollow">
  <meta content="origin-when-cross-origin" name="referrer">
  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="http://www.miximum.fr/veille-techno-efficace.html">

<style>
/* http://meyerweb.com/eric/tools/css/reset/ */
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, img, ins,
small, strike, strong, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* http://practicaltypography.com/equity.html */
/* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
/* https://www.filamentgroup.com/lab/js-web-fonts.html */
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'ConcourseT3';
  src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
       url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}


/* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
body {
  /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  font-family: "EquityTextB", Palatino, serif;
  background-color: #f0f0ea;
  color: #07486c;
  font-kerning: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: optimizeLegibility;
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: "kern", "liga", "clig", "calt";
}
pre, code, kbd, samp, var, tt {
  font-family: 'TriplicateT4c', monospace;
}
em {
  font-style: italic;
  color: #323a45;
}
strong {
  font-weight: bold;
  color: black;
}
nav {
  background-color: #323a45;
  color: #f0f0ea;
  display: flex;
  justify-content: space-around;
  padding: 1rem .5rem;
}
  nav:last-child {
    border-bottom: 1vh solid #2d7474;
  }
  nav a {
    color: #f0f0ea;
  }
  nav abbr {
    border-bottom: 1px dotted white;
  }

h1 {
  border-top: 1vh solid #2d7474;
  border-bottom: .2vh dotted #2d7474;
  background-color: #e3e1e1;
  color: #323a45;
  text-align: center;
  padding: 5rem 0 4rem 0;
  width: 100%;
  font-family: 'ConcourseT3';
  display: flex;
  flex-direction: column;
}
  h1.single {
    padding-bottom: 10rem;
  }
  h1 span {
    position: absolute;
    top: 1vh;
    left: 20%;
    line-height: 0;
  }
    h1 span a {
      line-height: 1.7;
      padding: 1rem 1.2rem .6rem 1.2rem;
      border-radius: 0 0 6% 6%;
      background: #2d7474;
      font-size: 1.3rem;
      color: white;
      text-decoration: none;
    }
h2 {
  margin: 4rem 0 1rem;
  border-top: .2vh solid #2d7474;
  padding-top: 1vh;
}
h3 {
  text-align: center;
  margin: 3rem 0 .75em;
}
hr {
  height: .4rem;
  width: .4rem;
  border-radius: .4rem;
  background: #07486c;
  margin: 2.5rem auto;
}
time {
  display: bloc;
  margin-left: 0 !important;
}
ul, ol {
  margin: 2rem;
}
ul {
  list-style-type: square;
}
a {
  text-decoration-skip-ink: auto;
  text-decoration-thickness: 0.05em;
  text-underline-offset: 0.09em;
}
article {
  max-width: 50rem;
  display: flex;
  flex-direction: column;
  margin: 2rem auto;
}
  article.single {
    border-top: .2vh dotted #2d7474;
    margin: -6rem auto 1rem auto;
    background: #f0f0ea;
    padding: 2rem;
  }
  article p:last-child {
    margin-bottom: 1rem;
  }
p {
  padding: 0 .5rem;
  margin-left: 3rem;
}
  p + p,
  figure + p {
    margin-top: 2rem;
  }

blockquote {
  background-color: #e3e1e1;
  border-left: .5vw solid #2d7474;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem;
  margin: 1.5rem;
}
  blockquote cite {
    font-style: italic;
  }
  blockquote p {
    margin-left: 0;
  }

figure {
  border-top: .2vh solid #2d7474;
  background-color: #e3e1e1;
  text-align: center;
  padding: 1.5rem 0;
  margin: 1rem 0 0;
  font-size: 1.5rem;
  width: 100%;
}
  figure img {
    max-width: 250px;
    max-height: 250px;
    border: .5vw solid #323a45;
    padding: 1px;
  }
figcaption {
  padding: 1rem;
  line-height: 1.4;
}
aside {
  display: flex;
  flex-direction: column;
  background-color: #e3e1e1;
  padding: 1rem 0;
  border-bottom: .2vh solid #07486c;
}
  aside p {
    max-width: 50rem;
    margin: 0 auto;
  }

/* https://fvsch.com/code/css-locks/ */
p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  font-size: 1rem;
  line-height: calc( 1.5em + 0.2 * 1rem );
}
h1 {
  font-size: 1.9rem;
  line-height: calc( 1.2em + 0.2 * 1rem );
}
h2 {
  font-size: 1.6rem;
  line-height: calc( 1.3em + 0.2 * 1rem );
}
h3 {
  font-size: 1.35rem;
  line-height: calc( 1.4em + 0.2 * 1rem );
}
@media (min-width: 20em) {
  /* The (100vw - 20rem) / (50 - 20) part
     resolves to 0-1rem, depending on the
     viewport width (between 20em and 50em). */
  p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
    font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
    margin-left: 0;
  }
  h1 {
    font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
  h2 {
    font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
  h3 {
    font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
}
@media (min-width: 50em) {
  /* The right part of the addition *must* be a
     rem value. In this example we *could* change
     the whole declaration to font-size:2.5rem,
     but if our baseline value was not expressed
     in rem we would have to use calc. */
  p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
    font-size: calc( 1rem + .6 * 1rem );
    line-height: 1.5em;
  }
  p, li, pre, details {
    margin-left: 3rem;
  }
  h1 {
    font-size: calc( 1.9rem + 1.5 * 1rem );
    line-height: 1.2em;
  }
  h2 {
    font-size: calc( 1.5rem + 1.5 * 1rem );
    line-height: 1.3em;
  }
  h3 {
    font-size: calc( 1.35rem + 1.5 * 1rem );
    line-height: 1.4em;
  }
  figure img {
    max-width: 500px;
    max-height: 500px;
  }
}

figure.unsquared {
  margin-bottom: 1.5rem;
}
  figure.unsquared img {
    height: inherit;
  }


@media print {
  body { font-size: 100%; }
  a:after { content: " (" attr(href) ")"; }
  a, a:link, a:visited, a:after {
    text-decoration: underline;
    text-shadow: none !important;
    background-image: none !important;
    background: white;
    color: black;
  }
  abbr[title] { border-bottom: 0; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  img { page-break-inside: avoid; }
  @page { margin: 2cm .5cm; }
  h1, h2, h3 { page-break-after: avoid; }
  p3 { orphans: 3; widows: 3; }
  img {
    max-width: 250px !important;
    max-height: 250px !important;
  }
  nav, aside { display: none; }
}

ul.with_columns {
  column-count: 1;
}
@media (min-width: 20em) {
  ul.with_columns {
    column-count: 2;
  }
}
@media (min-width: 50em) {
  ul.with_columns {
    column-count: 3;
  }
}
ul.with_two_columns {
  column-count: 1;
}
@media (min-width: 20em) {
  ul.with_two_columns {
    column-count: 1;
  }
}
@media (min-width: 50em) {
  ul.with_two_columns {
    column-count: 2;
  }
}

.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
  .gallery figure img {
    margin-left: 1rem;
    margin-right: 1rem;
  }
  .gallery figure figcaption {
    font-family: 'ConcourseT3'
  }

footer {
  font-family: 'ConcourseT3';
  display: flex;
  flex-direction: column;
  border-top: 3px solid white;
  padding: 4rem 0;
  background-color: #07486c;
  color: white;
}
  footer > * {
    max-width: 50rem;
    margin: 0 auto;
  }
  footer a {
    color: #f1c40f;
  }
  footer .avatar {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    float: left;
    -webkit-shape-outside: circle();
    shape-outside: circle();
    margin-right: 2rem;
    padding: 2px 5px 5px 2px;
    background: white;
    border-left: 1px solid #f1c40f;
    border-top: 1px solid #f1c40f;
    border-right: 5px solid #f1c40f;
    border-bottom: 5px solid #f1c40f;
  }
</style>

<h1>
  <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  Comment ne pas se laisser dévorer par la veille techno ? (archive)
  <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>
</h1>
<section>
  <article>
    <h3><a href="http://www.miximum.fr/veille-techno-efficace.html">Source originale du contenu</a></h3>
    <div class="figure align-center">
<a class="reference external image-reference" href="http://www.tripodocus.fr/pictures/toits-parisiens/"><img alt="Photographie des toits de la ville de Paris" class="full border shadow" src="http://www.tripodocus.fr/thumbs/i/2015/toits-parisiens_medium.jpg"/></a>
</div>

<p>L'obsolescence des compétences est l'un des dangers qui guettent le vaillant
travailleur du Web.  Notre domaine d'activité évolue tellement vite, tant au
niveau des outils, des méthodes, des pratiques, des technologies… que rester à
la page est un défi permanent.</p>

<p>Si, fraîchement émoulu de son école, notre jeune Webie·ne se lancera à corps
perdu dans l'apprentissage du x-ième framework Javascript avec un enthousiasme
toujours renouvelé, le senior finira peut-être par ressentir ennui et lassitude
face à la répétitivité de la chose.</p>

<p>Comment prendre de la distance avec sa veille techno sans pour autant se
laisser distancer par le Web ?</p>

<div class="section" id="denver-le-dernier-dinosaure-du-web">
<h2>Denver, le dernier dinosaure du Web</h2>
<p>N'avons nous pas tous déjà rencontré l'un ou l'une de ces <a class="reference external" href="http://www.miximum.fr/quel-developpeur-etes-vous.html">vieux schnocks</a> tellement engoncé
dans ses vieilles habitudes, ses vieux outils, ses vieilles méthodes, qu'il est
devenu incapable d'apporter la moindre contribution utile à un projet moderne ?</p>
<p>Ces dinosaures du Web se sont reposés sur leurs lauriers tellement longtemps
qu'on dirait que le monde a continué de tourner sans eux, qu'ils sont restés
coincés à une autre époque. Pour un peu, on les verrais porter un haut de
forme, priser du tabac et entendrais proférer des expressions comme Diante ! et
Morbleu !</p>
<p>Je précise à l'égard de mes éventuels pairs plus âgés qu'il ne s'agit
absolument pas d'une question d'années. J'ai connu des ingénieurs obsolètes à
25 ans.</p>
<p>S'ils peuvent encore se rendre utile en se chargeant de la maintenance de
projets antédiluviens (coucou le Cobol !), leur intervention sera désastreuse
sur les projets récents dans lesquels ils importent leurs sales habitudes et
leurs pratiques obsolètes.</p>
<p>C'est encore pire quand ces néandertaliens du code pervertissent les vierges
esprits des stagiaires et nouvelles recrues en répandant leurs compétences
véreuses comme la parole du messie, et s'arrogent des rôles de décideurs en
invoquant des préceptes fumeux tel que le « respect dû aux aînés ».</p>
<p>Bref ! S'il a de la chance, le dinosaure se fait des couilles en or en
travaillant sur des projets poussiéreux pour l'industrie financière, mais il
finit la plupart du temps dans un placard, là ou il sera le moins nuisible.</p>
</div>

<div class="section" id="fast-and-furious-veille-techno">
<h2>Fast and furious veille techno</h2>
<div class="figure align-center">
<a class="reference external image-reference" href="http://i.miximum.fr/images/YJ46DBBTLS/"><img alt="Un pigeon méditatif" class="full border shadow" src="http://i.miximum.fr/i/2015/02/YJ46DBBTLS_l.png"/></a>
</div>
<p>Si elle est essentielle, la veille techno est exigeante. Parce que oui, tester
un nouvel outil, un nouveau framework, une nouvelle librairie, une nouvelle
méthode, ça prend du temps (du moins, <a class="reference external" href="http://www.commitstrip.com/fr/2013/03/20/jfais-pas-rien-jfais-de-la-veille/">quand on le fait sérieusement</a>).
Et le temps, plus ça va, moins on en a.</p>
<p>Sans oublier le côté répétitif de la chose. Apprendre à utiliser son premier
framework Js, c'est fun. Se plonger dans la doc du quinzième, c'est franchement
barbant.</p>
<p>Ã titre personnel, 2014 a été une année charnière. J'ai découvert, un peu
étonné, que l'idée de passer un week-end entier à manger des chips et jouer
avec une nouvelle librairie Python ne provoquait plus en moi cet enthousiasme,
cette drôle d'excitation (oserais-je dire presque charnelle ?) dont j'avais
l'habitude. Cette lassitude s'est doublée par une volonté de <a class="reference external" href="http://www.tripodocus.fr">consacrer plus de
temps à d'autres passions</a>.</p>
<p>Une nuit, j'ai fait un cauchemar. Je suis vu moi même, 20 ans plus tard, en
cardigan et pantalon en velours côtelé, recouvert par une épaisse couche de
poussière, corrigeant des bugs vieux de plusieurs décennies dans des langages
depuis longtemps disparus.</p>
<p>Réveillé en sursaut et en sueur, je me suis alors rendu compte qu'il fallait
que je change ma manière d'aborder la veille technologique. Voici quelques unes
des stratégies que j'essaye de mettre en place.</p>
</div>

<div class="section" id="donner-plus-de-valeur-a-son-temps">
<h2>Donner plus de valeur à son temps</h2>
<p>J'avais l'habitude de me lancer dans <a class="reference external" href="http://www.commitstrip.com/fr/2014/11/25/west-side-project-story/">d'innombrables side projects</a>, parfois
sans autre motivation que l'excitation de l'idée, et toujours avec l'inavouable
espoir de devenir riche et célèbre. Que d'heures perdues sur des projets jamais
terminés !</p>
<p>Aujourd'hui, le temps libre est devenue une ressource (très) rare (et j'exprime
mon profond respect à mes collègues qui en plus ont des gosses). Par
conséquent, j'essaye de le dépenser à meilleur escient.</p>
<p>Ãa signifie que je ne démarre plus un <em>side project</em> sur un coup de tête. Quand
je me lance dans un développement personnel, j'ai laissé mûrir l'idée, défini
des objectifs, et je sais à l'avance la valeur que je vais en retirer (cf. plus
bas).</p>
</div>

<div class="section" id="privilegier-la-qualite-a-la-quantite">
<h2>Privilégier la qualité à la quantité</h2>
<p>Quand une personne sans doute bien intentionnée décide de publier un n-ième
clone de Grunt ou Backbone.js, j'avoue que je dois pallier à de pressantes
pulsions meurtrières en me gavant de beurre de cacahuètes.</p>
<p>J'ai arrêté d'essayer de me tenir à la page sur la dernière techno à la mode ou
le dernier framework top tendance.</p>
<p>Aujourd'hui, si je prends le temps de tester / apprendre un nouvel outil /
langage / techno / truc, c'est pour l'une de ces deux raisons :</p>
<ul class="simple">
<li>C'est quelque chose de totalement différent par rapport à ce que je
maîtrise, porteur de concepts qui me sont étrangers, et qui va m'ouvrir
l'esprit (<a class="reference external" href="http://www.miximum.fr/tag/android.html">Android</a>, <a class="reference external" href="http://www.miximum.fr/tag/bitcoin.html">Bitcoin</a>, programmation fonctionnelle, etc.) ;</li>
<li>C'est une techno fiable et mature <strong>répondant à un besoin réel</strong> et que je
vais pouvoir intégrer directement dans ma trousse à outil.</li>
</ul>
<p>Si je n'apprends rien, je perds mon temps. J'agis en conséquence.</p>
</div>

<div class="section" id="laisser-murir-les-technos">
<h2>Laisser mûrir les technos</h2>
<p>Combien de temps perdu à tester des technos soi-disant révolutionnaires et qui
ont fini aux oubliettes de l'e-histoire.</p>
<p>La vérité est qu'une techno récente, quelque soit son aspect novateur, peut
rarement être intégrée dans un projet amené à passer en production.</p>
<p>Il y a toujours une phase de défrichage, de maturation, pendant laquelle les
<em>early adopters</em> paieront les pots cassés.</p>
<p>Aujourd'hui, j'attends qu'une techno soit mâture avant de m'y intéresser. Par
mâture, j'entends qu'elle réponde aux critères suivants :</p>
<ul class="simple">
<li>la techno est techniquement robuste (pas de bugs en pagaille) ;</li>
<li>la documentation et les différents tutoriels éparpillés sur le Web
permettent une prise en main rapide ;</li>
<li>il existe suffisamment de retours d'expérience pour que je puisse me faire
une idée claire des cas d'utilisation pertinents.</li>
</ul>
</div>

<div class="section" id="attacher-de-l-importance-aux-retours-d-utilisation">
<h2>Attacher de l'importance aux retours d'utilisation</h2>
<div class="figure align-center">
<a class="reference external image-reference" href="http://www.tripodocus.fr/pictures/des-amis-au-cap-dagde/"><img alt="Silhouette sur un ciel bleu" class="full border shadow" src="http://www.tripodocus.fr/thumbs/i/2015/des-amis-au-cap-dagde_medium.jpg"/></a>
</div>
<p>J'ai tendance à attribuer de plus en plus d'importance aux retours
d'utilisation plutôt qu'à l'aspect technique et fonctionnel de la techno.</p>
<p>Plutôt que de lire des tutoriels techniques, je préfère m'intéresser aux
expériences des <em>early adopters</em>. Dans quels cas cette techno est-elle
appropriée ou non ? Quels sont ses avantages et ses inconvénients ? Quelles
sont ses forces et ses faiblesses ? Quels gains <strong>réels</strong> espérer, et à quelles
galères s'attendre ?</p>
<p>L'exemple emblématique, c'est Docker. Docker, un outil qui permet de faire des
machines virtuelles de manière simple et rapide à l'échelle d'un processus. Sur
le papier, c'est génial. En démo, c'est étourdissant. En pratique, je n'ai
trouvé aucun retour d'utilisation décrivant comment Docker, mis en place sur un
projet en production, a enlevé de la complexité au lieu d'en rajouter.</p>
</div>

<div class="section" id="aller-a-des-conferences-echanger">
<h2>Aller à des conférences, échanger</h2>
<p>Le meilleur moyen de discuter avec d'autres travailleur·se·s du Web, c'est
encore de trouver un nid.</p>
<p>En l'occurrence, les conférences sont un excellent moyen de cuisiner des
dévs, des admin sys, des intés, des agilistes… sur les derniers trucs qui
valent le coup qu'on s'y penche.</p>
<p>C'est quoi cette techno ? Est-ce que ça marche bien ? Quels sont les avantages
par rapport à X ? Autant de questions qui trouveront plus facilement réponse
autour d'un croissant ou d'une bière que derrière un clavier.</p>
</div>

<div class="section" id="conclusion">
<h2>Conclusion</h2>
<p>La veille techno est un processus essentiel, mais plus le temps passe, et plus
le besoin de s'y consacrer avec une certaine efficacité se fait sentir. Faute
de quoi, ennui et lassitude finiront par s'emparer de l'ingénieur·e.</p>
<p>Sur ces quelques réflexions, je vous laisse, je vais découper du saucisson.</p>
</div>
  </article>
</section>


<nav id="jumpto">
  <p>
    <a href="/david/blog/">Accueil du blog</a> |
    <a href="http://www.miximum.fr/veille-techno-efficace.html">Source originale</a> |
    <a href="/david/stream/2019/">Accueil du flux</a>
  </p>
</nav>

<footer>
  <div>
    <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
    <p>
      Bonjour/Hi!
      Je suis <a href="/david/" title="Profil public">David&nbsp;Larlet</a>, je vis actuellement à Montréal et j’alimente cet espace depuis 15 ans. <br>
      Si tu as apprécié cette lecture, n’hésite pas à poursuivre ton exploration. Par exemple via les <a href="/david/blog/" title="Expériences bienveillantes">réflexions bimestrielles</a>, la <a href="/david/stream/2019/" title="Pensées (dés)articulées">veille hebdomadaire</a> ou en t’abonnant au <a href="/david/log/" title="S’abonner aux publications via RSS">flux RSS</a> (<a href="/david/blog/2019/flux-rss/" title="Tiens c’est quoi un flux RSS ?">so 2005</a>).
    </p>
    <p>
      Je m’intéresse à la place que je peux avoir dans ce monde. En tant qu’humain, en tant que membre d’une famille et en tant qu’associé d’une coopérative. De temps en temps, je fais aussi des <a href="https://github.com/davidbgk" title="Principalement sur Github mais aussi ailleurs">trucs techniques</a>. Et encore plus rarement, <a href="/david/talks/" title="En ce moment je laisse plutôt la place aux autres">j’en parle</a>.
    </p>
    
    <p>
      Voici quelques articles choisis :
      <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
      <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
      <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
      <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
      <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
      <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
      <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
      <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
      <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
      <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
      <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
      <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
      <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
      <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
      <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
      et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
    </p>
    <p>
      On peut <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">échanger par courriel</a>. Si éventuellement tu souhaites que l’on travaille ensemble, tu devrais commencer par consulter le <a href="http://larlet.com">profil dédié à mon activité professionnelle</a> et/ou contacter directement <a href="http://scopyleft.fr/">scopyleft</a>, la <abbr title="Société coopérative et participative">SCOP</abbr> dont je fais partie depuis six ans. Je recommande au préalable de lire <a href="/david/blog/2018/cout-site/" title="Attention ce qui va suivre peut vous choquer">combien coûte un site</a> et pourquoi je suis plutôt favorable à une <a href="/david/pro/devis/" title="Discutons-en !">non-demande de devis</a>.
    </p>
    <p>
      Je ne traque pas ta navigation mais mon
      <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
      conserve des logs d’accès.
    </p>
  </div>
</footer>
<script type="text/javascript">
  ;(_ => {
    const jumper = document.getElementById('jumper')
    jumper.addEventListener('click', e => {
      e.preventDefault()
      const anchor = e.target.getAttribute('href')
      const targetEl = document.getElementById(anchor.substring(1))
      targetEl.scrollIntoView({behavior: 'smooth'})
    })
  })()
</script>