davidbgk
/
larlet-fr-david-cache


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767
							<!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>Introduction à secure-scuttlebutt (SSB) (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="https://git.scuttlebot.io/%253qtmFApy1Es5BVA7JIhrlfahcWqBp%2F7I391i%2BxQ1HP8%3D.sha256">

<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>
  Introduction à secure-scuttlebutt (SSB) (archive)
  <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>
</h1>
<section>
  <article>
    <h3><a href="https://git.scuttlebot.io/%253qtmFApy1Es5BVA7JIhrlfahcWqBp%2F7I391i%2BxQ1HP8%3D.sha256">Source originale du contenu</a></h3>
    <h1>Introduction à secure-scuttlebutt (SSB)</h1>
<p>Vous trouverez mes autres repos git-ssb dans <a href="https://git.scuttlebot.io/%40dcWOOqyFtY1sEXv%2BrM0MzdINiYyIFFwom1NfmP4aMFo%3D.ed25519">ssb:millette</a>.</p>
<p>Le document actuel se trouve à <a href="https://git.scuttlebot.io/%253qtmFApy1Es5BVA7JIhrlfahcWqBp%2F7I391i%2BxQ1HP8%3D.sha256">ssb, une intro</a>.</p>
<h2>Préambule</h2>
<p>Sautez à la section <strong>C'est quoi SSB?</strong> pour passer le préambule.</p>
<h3>Décentralisé</h3>
<p>J'ai toujours été attiré par les aspects décentralisés du web
et de l'internet en général. J'hébergeais déjà un serveur web
chez moi à partir des années 1990, sur ma petite ligne ADSL
à 1Mbps et mon Pentium 90MHz et ses 24MiB de RAM. J'ai même été
<em>slashdotté</em> comme on le disait à l'époque.</p>
<h3>Silos</h3>
<p>Avec le temps, le web s'est refermé sur lui-même, on a vu des silo
de plus en plus gros marquer leurs territoires sur le web. On n'a
qu'à penser à Google ou Facebook. J'ai toujours un compte Google,
mais ça fait des années que j'ai détruit mon compte Facebook.</p>
<h3>Expériences</h3>
<p>Il y a quelques mois, j'ai un peu expérimenté avec <a href="https://zeronet.io/">ZeroNet</a>
et plus récemment avec le <a href="https://datproject.org/">datproject</a>. Il y a quelques jours,
je redécouvrais <a href="http://scuttlebot.io/">secure-scuttlebutt</a> suite au tapage
entourant la sortie de <a href="https://mastodon.social/">mastodon</a>.</p>
<h3>Mastodon et fédération</h3>
<p>Mastodon et ses cousins GNU Social et StatusNet reposent
tous sur le protocole OStatus, qui lui-même est composé
de protocoles et standards plus anciens comme PubSubHubbub,
Salmon, Webfinger et ActivityStreams. Je suis assez bien placé
pour en parlé puisque j'étais un des développeur de StatusNet
il y a une dizaine d'années.</p>
<p>OStatus permet la fédération, au même titre que le email qu'on
utilise couramment (on peut envoyer un mail du service de Google
et il sera reçu par un utilisateur de Yahoo) ou encore les <em>pods</em>
de Diaspora ou Jabber/XMPP pour <em>chatter</em>. Dans le cas de fédération,
la relation P2P repose entre les serveurs et non les utilisateurs
eux-mêmes, bien que ces derniers soient tout à fait libres
d'héberger leurs propres serveurs.</p>
<h3>P2P</h3>
<p><a href="https://zeronet.io/">ZeroNet</a>, <a href="https://datproject.org/">datproject</a> et <a href="http://scuttlebot.io/">secure-scuttlebutt</a> quand à eux
proposent de véritables réseaux P2P, au même titre que BitTorrent
et Bitcoin par exemple. <strong>Dans les réseaux P2P, il n'y a plus de
distinction entre les clients et les serveurs</strong>. Les utilisateurs
prennent donc part entière aux échanges.</p>
<h2>C'est quoi SSB?</h2>
<p>SSB, scuttlebutt, secure-scuttlebutt, scuttlebot... c'est un peu mêlant.
Sans trop aller dans les détails, disons pour commencer que les termes
SSB, scuttlebutt et secure-scuttlebutt sont à peu près interchangeables.</p>
<h3>Scuttlebutt</h3>
<p>En gros, il s'agit d'une base de données <em>append-only</em> qui facilite la
réplication et la consistence éventuelle. <em>Append-only</em> signifie
que l'information n'est jamais modifiée ou effacée, mais seulement
ajoutée.</p>
<p>Cette base de donnée va contenir les données que vous y mettez
ainsi que les données que vous allez répliquer à partir d'autres
instances scuttlebutt.</p>
<p>Quels genres de données? Des messages, des identifiants, des <em>blobs</em>,
bref, un peu de tout.</p>
<h3>Scuttlebot</h3>
<p>Pour simplifier la réplication, le service scuttlebot est disponible.
C'est le logiciel P2P responsable de partager vos données et de
récupérer les données qui vous intéressent.</p>
<p>En suivant des utilisateurs, scuttlebot s'occupera de recevoir
les données de ces utilisateurs, et vice-versa.</p>
<p>Le réseau P2P utilise <em>gossip</em>. Concrètement, les ordinateurs doivent
être connectés entre-eux à un certain moment (mais pas tout le temps)
pour échanger des données. Disons qu'on a les utilisateurs
Pierre, Jean et Jacques.</p>
<ul>
<li>Pierre suit Jean et Jacques</li>
<li>Jean suit Jacques</li>
<li>Jean se connecte à Jacques et obtient ses données</li>
<li>Pierre se connecte à Jean et obtient les données de Jean et Jacques,
  transitivement</li>
</ul>
<p>Dans ce scénario, Pierre ne s'est pas connecté directement à Jacques,
mais il a quand même pu obtenir les données de Jacques, via Jean.
C'est ce qu'on veut dire par <em>gossip</em>, ou commérages, potins, rumeurs.</p>
<p>Mieux que des rumeurs, SSB est sécure et garanti que les données de
Jacques obtenues via Jean seront intègres.</p>
<h3>Patchwork</h3>
<p>Si la réplication est basée sur un réseau social (ceux que vous
suivez et qui vous suivent), une application évidente de SSB est
un réseau social en bonne et due forme. Le logiciel patchwork est
la réalisation de cette application.</p>
<p>Jusqu'ici, scuttlebutt et scuttlebot sont des logiciels «système».
Ils offrent une interface à la ligne de commande générique de
bas niveau.</p>
<p>Patchwork est une application desktop, un GUI qui donne forme au
réseau social et permet de suivre et lire les messages, photos, <em>likes</em>
des autres utilisateurs qui vous intéressent.</p>
<p>C'est la façon recommandée de faire ses premiers pas dans le
<em>scuttleverse</em>, bien qu'il existe d'autres clients plus légers
comme on le verra plus loin dans ce document.</p>
<p>Notez cependant qu'il s'agit d'un éxécutable de 50-70 MiB basé sur
electron, qui lui-même est basé sur chromium et sur node, ces deux
derniers reposant sur V8 pour l'engin JavaScript. Cette application
inclut aussi scuttlebutt et scuttlebot. Autrement dit, ça prend
pas mal de ressources en RAM et en CPU. Chez moi, ça fait monter
la température de façon critique.</p>
<h2>Installation</h2>
<p>Nous allons installer quelques logiciels. Vous aurez besoin d'une
version récente (6.x) de NodeJS.</p>
<p>Si vous n'avez pas déjà node 6.x ou mieux, installez n pour gérer
les versions de node:
<code>curl -L https://git.io/n-install | bash</code></p>
<p>Vous devez relancer le terminal pour utiliser n. Voir les détails:
<a href="https://github.com/mklement0/n-install">https://github.com/mklement0/n-install</a></p>
<h3>patchwork</h3>
<p>Téléchargez patchwork à partir de <a href="https://github.com/ssbc/patchwork/releases">https://github.com/ssbc/patchwork/releases</a></p>
<p>Au démarrage, une fenêtre devrait s'ouvrir sur votre <em>desktop</em> offrant
le GUI.</p>
<p><img alt="Capture d'écran Patchwork" src="patchwork-screenshot.jpg" /></p>
<p>S'il y a d'autres utilisateurs de scuttlebot sur votre réseau local (LAN),
peut-être en classe, au travail ou dans un café, votre instance
commencera automatiquement à recevoir les données du réseau et vous
pourrez chercher du contenu et des utilisateurs et les suivre,
même s'il ne sont pas sur votre LAN. C'est l'effet <em>gossip</em>.</p>
<p>Autrement, si vous êtes seul sur votre LAN, vous devrez vous connecter
à un <strong>Pub</strong> public.</p>
<p>Vous obtiendrez une invitation sur un des <a href="https://github.com/ssbc/scuttlebot/wiki/Pub-Servers">pubs publics sur le wiki</a>.</p>
<p>Dans patchwork, cliquez sur «+ Join Pub» et copiez-y le code d'invitation
que vous avez obtenu.</p>
<p>Ainsi, vous suivrez ce <strong>Pub</strong> et vice-vera. Si vous n'avez pas encore
synchronisé avec le réseau social, ça prendra quelques minutes pour
vous mettre à jour.</p>
<p>À partir d'ici, vous prenez par au scuttleverse. Vous pouvez me suivre:</p>
<ul>
<li>@dcWOOqyFtY1sEXv+rM0MzdINiYyIFFwom1NfmP4aMFo=.ed25519</li>
<li><a href="http://viewer.scuttlebot.io/%25xLwTdQULCtpiRtRGKH3vETWDtaMPNrAc0ns4QjHrv3o%3D.sha256">http://viewer.scuttlebot.io/%25xLwTdQULCtpiRtRGKH3vETWDtaMPNrAc0ns4QjHrv3o%3D.sha256</a></li>
</ul>
<p>Personnellement, je n'utilise pas beaucoup le client Patchwork
puisqu'il prend trop de ressources pour mon ordinateur. Les prochaines
sections proposeront deux autres clients plus légers. Je mentionne
quand même Patchwork puisque c'est une porte d'entrée facile.</p>
<p>Le réseau supporte les messages publics et privés.</p>
<h4>Messages publics</h4>
<p>Tout ce que vous publierez sera disponible pour l'éternité sur le réseau,
ainsi que les utilisateurs que vous mentionnerez, alors pensez-y bien
avant d'écrire tout ce qui vous passe par la tête :-)</p>
<h4>Messages privés</h4>
<p>Vous pouvez aussi échanger des messages privés. Ces derniers ne pourront
être lus que par leurs destinataires et la liste des destinataires
demeure aussi privée (encryptée).</p>
<p>Le réseau verra cependant que vous avez envoyé un message privé, sans
connaitre son contenu ou destinataires, et pourra faire suivre ce
message comme les autres en P2P avec <em>gossip</em>.</p>
<h3>scuttlebot</h3>
<p>Les prochains clients proposés reposent sur le logiciel scuttlebot,
ou sbot à la ligne de commande. Node est installé? Parfait,
on peut procéder à l'installer et démarrer le serveur:
<code>npm install --global scuttlebot
sbot server</code></p>
<p>Si vous avez installé Patchwork à l'étape précédente, votre nouvelle
instance de scuttlebot devrait se connecter et synchroniser en
priorisant les utilisateurs suivis.</p>
<p>Un <em>log</em> devrait rapidement remplir le terminal où vous avez lancé
<strong>sbot server</strong>. Mais pas de GUI, c'est normal.</p>
<p>Vous avez tout de même une interface complète pour accéder et participer
au scuttleverse, à la ligne de commande. Pour obtenir la liste de
toutes les commandes:
<code>sbot --help</code></p>
<p>Par exemple, pour confirmer que vous utilisez la bonne identité:
<code>sbot whoami # afficher votre clé publique (identifiant)</code></p>
<p>Vous pouvez lire des messages, en envoyer, suivre des utilisateurs
et ainsi de suite, mais ça prend des commandes plutôt fastidieuses
à taper.</p>
<p>sbot offre aussi une interface RPC sur le port 8008 par défaut, qui
sera utilisée par les prochains clients.</p>
<h4>Plugins scuttlebot</h4>
<ul>
<li>ssb-notifier</li>
<li>ssb-links</li>
<li>ssb-query</li>
<li>ssb-ws</li>
<li>ssb-fulltext</li>
<li>patchfoo</li>
<li>dnssb</li>
</ul>
<h3>patchbay</h3>
<h3>patchfoo</h3>
<p>Client simple qui s'utilise via votre fureteur préféré (incluant dillo).</p>
<h2>Plus qu'un réseau social</h2>
<p>Si patchwork, patchbay et patchfoo offrent des représentations du
scuttleverse de type réseau social, d'autres types d'applications
sont possible, qui reposent sur la même architecture P2P.</p>
<h3>ssb-git</h3>
<p>git est un gestionnaire de code, décentralisé par nature. Pour accéder
à un dépot, il faut en connaitre l'adresse, souvent par les protocoles
http/https ou ssh. On peut cloner ce dépot plus ou moins manuellement à
une autre adresse. Ainsi, on peut continuer de coder sur un vol de 5h
sans wifi. Avant git, cvs et svn étaient la norme, mais avec ces derniers
on ne pouvait faire de commit sans connection. C'était complètement
centralisé.</p>
<p>Par leur nature, les dépots ont chacun une forme de centralisation,
c'est à dire un auteur, <em>maintainer</em> ou un groupe qui est responsable
de ce qui sera commis dans la version dite officielle de dépot.</p>
<p>Si un dépot est sur notre laptop et qu'un autre utilisateur veut
en faire un clone, il doit y avoir accès d'une certaine façon. Peut-être
par ssh ou un autre protocole. Mais le plus souvent, on fera nous
même un clone de notre dépot qu'on tiendra à jour sur un service public
(ou non) et accessibles en ligne. GitHub, GitLab et BitBucket sont des
options fréquentes.</p>
<p>Avec ssb-git, on fera un clone de notre dépot et on le publiera dans le
scuttleverse.</p>
<p>Pour installer ssb-git:</p>
<p><code>npm install --global git-ssb</code></p>
<h4>Usage</h4>
<blockquote>
<p>Tiré de <a href="https://github.com/clehner/git-ssb/blob/master/README.md#usage">https://github.com/clehner/git-ssb/blob/master/README.md#usage</a></p>
</blockquote>
<p>Vous pouvez utiliser un <em>remote</em> <code>ssb://</code> comme n'importe quel autre
<em>remote</em> git. Un dépot sur ssb est identifé par un message ID.
Pour créer un nouveau dépot git sur ssb, utilisez la commande
<code>git ssb create</code>. Vous ne pouvez <em>pusher</em> que sur les dépots ssb git
que vous avez créé et non sur les dépots des autres.</p>
<h4>Exemples</h4>
<p>Publier un dépot existant sur ssb:
<code>cd repo
git ssb create ssb my-cool-repo
git push --tags --set-upstream ssb master</code></p>
<p>Pour cloner un dépot à partir de ssb:
<code>git clone ssb://&lt;msgId&gt; repo</code></p>
<p>*Fork un dépot ssb git que vous avez cloné:
```
cd repo
git ssb fork mine</p>
<h1>edit and commit, then push changes:</h1>
<p>git push mine
```</p>
<p>Démarrer un serveur web pour browser (à la github):
<code>git ssb web</code></p>
<h1>Alternatives</h1>
<ul>
<li>Matrix (riot)</li>
<li>dat project (hypercore/hyperdrive)</li>
<li>ZeroNet</li>
<li>CouchDB (mécanisme de réplication éventuellement consistent)</li>
<li>Et bien plus!</li>
</ul>
<h2>Todo</h2>
<ul>
<li>Liens ssb vs liens http</li>
</ul>
  </article>
</section>


<nav id="jumpto">
  <p>
    <a href="/david/blog/">Accueil du blog</a> |
    <a href="https://git.scuttlebot.io/%253qtmFApy1Es5BVA7JIhrlfahcWqBp%2F7I391i%2BxQ1HP8%3D.sha256">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>