davidbgk
/
larlet-fr-david-cache


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192
							<!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` element
  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,initial-scale=1">
<!-- Required to make a valid HTML5 document. -->
<title>Making Gemini Easy (archive) — David Larlet</title>
<meta name="description" content="Publication mise en cache pour en conserver une trace.">
<!-- That good ol' feed, subscribe :). -->
<link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
<link rel="manifest" href="/static/david/icons2/site.webmanifest">
<link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
<link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
<meta name="msapplication-TileColor" content="#f7f7f7">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
<!-- Documented, feel free to shoot an email. -->
<link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
<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>
<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>
<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>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<script>
    function toggleTheme(themeName) {
        document.documentElement.classList.toggle(
            'forced-dark',
            themeName === 'dark'
        )
        document.documentElement.classList.toggle(
            'forced-light',
            themeName === 'light'
        )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
        toggleTheme(selectedTheme)
    }
</script>

  <meta name="robots" content="noindex, nofollow">
  <meta content="origin-when-cross-origin" name="referrer">
  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="https://proxy.vulpes.one/gemini/tilde.team/~tomasino/journal/20211103-making-gemini-easy.gmi">

<body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">


<article>
  <header>
    <h1>Making Gemini Easy</h1>
  </header>
  <nav>
    <p class="center">
      <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
      </svg> Accueil</a> •
      <a href="https://proxy.vulpes.one/gemini/tilde.team/~tomasino/journal/20211103-making-gemini-easy.gmi" title="Lien vers le contenu original">Source originale</a>
    </p>
  </nav>
  <hr>
  <div class="section"><p class="section__content">In both #gemini IRC channels (tilde.chat and libera.chat) I had different conversations lead me to explaining the same vision I have for a way to make gemspace much easier for non-technical people. I thought I should write it up here for posterity.</p></div>
<p class="section"><span class="section__type"> ##</span><h2 class="section__content">Reading content</h2></p>
<div class="section"><p class="section__content">First of all, reading gemini is already easy. The only barrier to entry is getting a gemini client. This is not a real barrier, though. People the world over are already familiar with downloading a program to work on a non-web thing. Take BitTorrent for example. Still too techy? How about literally any game?</p></div>
<div class="section"><p class="section__content">We've also got proxies, but I don't think they're actually helping with the ease-of-use. They're a crutch preventing someone from the 2 minute task of "oh, let me download the app," which will have them connected going forward. Regardless, reading isn't hard and it's not the focus of my vision.</p></div>
<p class="section"><span class="section__type"> ##</span><h2 class="section__content">Authoring content</h2></p>
<div class="section"><p class="section__content">The more difficult task is authoring content. How do you pick a server? In this use case you are a non-technical user, so you're not looking for server software to install, but instead a host where you can put your content. There's not a good place to browse for that. Maybe you'll ask around, but where? You're not on the mailing list or in IRC. You'll probably ask whoever told you about gemini.</p></div>
<div class="section"><p class="section__content">So you pick a place to have your presence. Now how do you get your own space? There's no "register" button on Gemini, right? Do you need to email someone? Did you stumble into the tildeverse? Now you're reading about making public and private keys and the command line. This can't be right. Gemini is supposed to be easy. Your friend told you that you just write text files and had a special caret thing for links. Why are we calling up a terminal now?</p></div>
<div class="section"><p class="section__content">This is where things fall apart for many. In order to get them to use our very simple tool we have them jump through many non-simple hoops.</p></div>
<div class="section"><p class="section__content">We're capable of making this process easier for people. So much of what it takes to add content to a gemini capsule is things we can automate. So why don't we?</p></div>
<p class="section"><span class="section__type"> ##</span><h2 class="section__content">Making it easy</h2></p>
<div class="section"><p class="section__content">Imagine a new client. This client is a little different. When you launch it you can browse gemini like all good little clients. But there's another option here. You go to File -&gt; New, and choose "Capsule". You are presented a list of servers available to join. Ahh, there, "GemJournal". That sounds cute, sorta like LiveJournal. You select it and it prompts you for your capsule name. I'll call this one "Artemis". That sounds cool. You are prompted to create a password. Enter it twice to double check. There we go.</p></div>
<div class="section"><p class="section__content">What's this now? A little folder view on the side showing my capsule? I can click this button here to create a new gemlog, or maybe I'll just select one of these files and open it in the editor. Ahh, here's the gemtext that my friend was telling me about. I'll do a little doodle here. Maybe an ascii art bow as the symbol of Artemis. File -&gt; Save and... oh, it's published! I can click this link to jump right to the... oh wow, look what I made!</p></div>
<p class="section"><span class="section__type"> ##</span><h2 class="section__content">Automate away the crud</h2></p>
<div class="section"><p class="section__content">That experience I just described is something we're capable of making right now. Someone grab the source code to Kristall and start a new branch! User creation could be quietly creating SSH keys in the background. The folder list is an SFTP connection. The rest is just some pretty UI. Or maybe it's much more robust than that! Maybe this whole thing uses Titan and creates accounts through some neat one-off protocol handshakey stuff. It really doesn't matter at all. The point is that the user will have something that feels seamless. It feels easy and natural. And, quite importantly, the web had nothing to do with it.</p></div>
<div class="section"><p class="section__content">For a v1, maybe it doesn't have a list of hosts available. Maybe the app is hard-wired to work with GemJournal.com only, that way the client author can also be a server maintainer and build both halves together. But really, based on the amazing craziness you all do already I don't see any of this as far fetched.</p></div>
<p class="section"><span class="section__type"> ##</span><h2 class="section__content">Impact</h2></p>
<div class="section"><p class="section__content">This little app concept has some real potential for impact to our ecosystem as well. If people can join the space without any technical knowledge beyond the gemtext editor (hey, how about a WYSIWYG?) we can truly get beyond that frustrating limitation where we talk about our own protocol (like this gemlog!) all the time. We can get that influx of educators, of artists, of writers. </p></div>
<div class="section"><p class="section__content">A writing platform that cuts out all the cruft and tracking and ads? And all I need to do is download this app and join? Oh, it's free! Hell's yes! Thanks for making it so easy!</p></div>
<div class="section"><p class="section__content">Originally Published 2021-11-03 at:</p></div>
<div class="section"><p class="section__content">gemini://tilde.team/~tomasino/journal/20211103-making-gemini-easy.gmi</p></div>
<div class="section"><p class="section__content">If you have questions or thoughts to add please send me a link to your response.</p></div>
</article>


<hr>

<footer>
  <p>
    <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
      </svg> Accueil</a> •
    <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use>
      </svg> Suivre</a> •
    <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use>
      </svg> Pro</a> •
    <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use>
      </svg> Email</a> •
    <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use>
      </svg> Légal</abbr>
  </p>
  <template id="theme-selector">
      <form>
          <fieldset>
              <legend><svg class="icon icon-brightness-contrast">
                <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use>
              </svg> Thème</legend>
              <label>
                  <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
              </label>
              <label>
                  <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
              </label>
              <label>
                  <input type="radio" value="light" name="chosen-color-scheme"> Clair
              </label>
          </fieldset>
      </form>
  </template>
</footer>
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
<script>
    function loadThemeForm(templateName) {
        const themeSelectorTemplate = document.querySelector(templateName)
        const form = themeSelectorTemplate.content.firstElementChild
        themeSelectorTemplate.replaceWith(form)

        form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
        })

        const selectedTheme = localStorage.getItem('theme')
        if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
        }
    }

    const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
    window.addEventListener('load', () => {
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
            let mediaRules = []
            for (const cssRule of styleSheet.cssRules) {
                if (cssRule.type !== CSSRule.MEDIA_RULE) {
                    continue
                }
                // WARNING: Safari does not have/supports `conditionText`.
                if (cssRule.conditionText) {
                    if (cssRule.conditionText !== prefersColorSchemeDark) {
                        continue
                    }
                } else {
                    if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                        continue
                    }
                }
                mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }

            // WARNING: do not try to insert a Rule to a styleSheet you are
            // currently iterating on, otherwise the browser will be stuck
            // in a infinite loop…
            for (const mediaRule of mediaRules) {
                styleSheet.insertRule(mediaRule.cssText)
                hasDarkRules = true
            }
        }
        if (hasDarkRules) {
            loadThemeForm('#theme-selector')
        }
    })
</script>
</body>
</html>