A place to cache linked articles (think custom and personal wayback machine)
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

index.html 12KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214
  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>
  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>Home .git (archive) — David Larlet</title>
  13. <meta name="description" content="Publication mise en cache pour en conserver une trace.">
  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="#f0f0ea">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f0f0ea">
  26. <!-- Documented, feel free to shoot an email. -->
  27. <link rel="stylesheet" href="/static/david/css/style_2020-06-19.css">
  28. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  29. <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>
  30. <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>
  31. <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>
  32. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <script type="text/javascript">
  36. function toggleTheme(themeName) {
  37. document.documentElement.classList.toggle(
  38. 'forced-dark',
  39. themeName === 'dark'
  40. )
  41. document.documentElement.classList.toggle(
  42. 'forced-light',
  43. themeName === 'light'
  44. )
  45. }
  46. const selectedTheme = localStorage.getItem('theme')
  47. if (selectedTheme !== 'undefined') {
  48. toggleTheme(selectedTheme)
  49. }
  50. </script>
  51. <meta name="robots" content="noindex, nofollow">
  52. <meta content="origin-when-cross-origin" name="referrer">
  53. <!-- Canonical URL for SEO purposes -->
  54. <link rel="canonical" href="https://martinovic.blog/post/home_git/">
  55. <body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick">
  56. <article>
  57. <header>
  58. <h1>Home .git</h1>
  59. </header>
  60. <nav>
  61. <p class="center">
  62. <a href="/david/" title="Aller à l’accueil">🏠</a> •
  63. <a href="https://martinovic.blog/post/home_git/" title="Lien vers le contenu original">Source originale</a>
  64. </p>
  65. </nav>
  66. <hr>
  67. <main>
  68. <p>Git is an incredibly useful tool for a programmer, you use it to version the work you do and distribute it easily on other computers.
  69. But over the years, I&rsquo;ve found that a lot of my workflow depends on various configurations and helper scripts I have in my path.
  70. So why not version those as well, it does allow you to get started in seconds in a very familiar environment on every new computer or even a server if you spend a lot of your time in SSH sessions.
  71. Bonus points for making it a public repository so others can take a look at your stuff and possibly get inspiration for improvements in their workflow, just make sure you don&rsquo;t commit any private keys.</p>
  72. <h1 id="the-setup">The setup</h1>
  73. <p>Feel free to check out my home repository over <a href="https://github.com/tophatcroat/home">here</a>. As you can see, it contains my <code>.zshrc</code>, <code>.vimrc</code> a <code>bin</code> directory with various scripts, dotfiles and some other stuff I&rsquo;ve curated while doing what I do best, fidgeting around a computer.</p>
  74. <p>You can start your own version by simply initializing a Git repository in your home directory.</p>
  75. <div class="highlight"><pre style="color:#272822;background-color:#fafafa;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-sh" data-lang="sh"><span style="color:#111">cd</span> ~ <span style="color:#f92672">&amp;&amp;</span> git init</code></pre></div>
  76. <p>Now your directory will be full of stuff you probably don&rsquo;t want to commit, like your downloads, pictures, private keys, shell history or what have you.
  77. So it&rsquo;s important to set up the <code>~/.gitignore</code> file immediately to stop you from accidentally committing stuff you didn&rsquo;t want to.</p>
  78. <p>Most importantly, you should ignore everything by default in your <code>~/.gitignore</code>:</p>
  79. <div class="highlight"><pre style="color:#272822;background-color:#fafafa;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-sh" data-lang="sh"><span style="color:#75715e"># Blacklist all in this folder</span>
  80. /*
  81. <span style="color:#75715e"># Except for these</span>
  82. !.gitignore
  83. !.gitconfig
  84. !.notes/
  85. !bin/
  86. !Development/Sh</code></pre></div>
  87. <p>This will instruct Git to keep its hands off all files except for the <code>.gitignore</code>, <code>.gitconfig</code> and the files in the <code>.notes</code>, <code>bin</code> and <code>Development/Sh</code> directories.
  88. So now, when you want to add any other file or directory you will require a force flag like so</p>
  89. <div class="highlight"><pre style="color:#272822;background-color:#fafafa;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-sh" data-lang="sh">git add -f path_to_file</code></pre></div>
  90. <p>And that&rsquo;s basically all you need to do to set this up, it&rsquo;s now up to you to add and commit all you want and push it to the Git hosting service of your choice.</p>
  91. <h1 id="the-cloning">The cloning</h1>
  92. <p>So now it&rsquo;s time to clone this into your new home directory, but if you try cloning it using <code>git clone</code> command it will complain that it can&rsquo;t do that in an non empty directory.
  93. To get around this, you need to initialize it first then manually add the remote and finally force a checkout like so:</p>
  94. <div class="highlight"><pre style="color:#272822;background-color:#fafafa;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-sh" data-lang="sh"><span style="color:#111">cd</span> ~
  95. <span style="color:#75715e"># Create an empty git repository in your home folder</span>
  96. git init
  97. <span style="color:#75715e"># Add the remote</span>
  98. git remote add origin https://github.com/TopHatCroat/home
  99. <span style="color:#75715e"># Get the stuff from up there</span>
  100. git fetch
  101. <span style="color:#75715e"># Be careful! This will overwrite any local files existing on remote!</span>
  102. git reset --hard origin/master</code></pre></div>
  103. <p>Running the last command will basically checkout all the files from the origin master branch and overwrite any files with the same path, so be careful if you already did some setup on the new machine.</p>
  104. <p>And that&rsquo;s it, you&rsquo;ve saved yourself the bother of copying over the config files.
  105. The only thing that remains is to install the tools that use the configs you&rsquo;ve just brought over.
  106. If you are feeling adventurous you could make a script that will do that for you like I did in <a href="https://github.com/TopHatCroat/home/blob/master/Development/Sh/setup.sh">here</a>, but that is up to you.</p>
  107. <p><em>EDIT:</em> As a response to this blog post others have pointed out <a href="https://www.atlassian.com/git/tutorials/dotfiles">another viable solution</a>, or by using <a href="https://protesilaos.com/codelog/gnu-stow-dotfiles/">GNU stow</a>, or <a href="https://github.com/technicalpickles/homesick">homesick</a> or <a href="https://github.com/thoughtbot/rcm">rcm</a>.
  108. Still, the solution presented here is the simplest to setup and understand and it does not depend on any other tool besides Git.
  109. All in all, there are a bunch of ways to do this and a lot more resources are available <a href="https://dotfiles.github.io/">here</a>.</p>
  110. </main>
  111. </article>
  112. <hr>
  113. <footer>
  114. <p>
  115. <a href="/david/" title="Aller à l’accueil">🏠</a> •
  116. <a href="/david/log/" title="Accès au flux RSS">🤖</a> •
  117. <a href="http://larlet.com" title="Go to my English profile" data-instant>🇨🇦</a> •
  118. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">📮</a> •
  119. <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">🧚</abbr>
  120. </p>
  121. <template id="theme-selector">
  122. <form>
  123. <fieldset>
  124. <legend>Thème</legend>
  125. <label>
  126. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  127. </label>
  128. <label>
  129. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  130. </label>
  131. <label>
  132. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  133. </label>
  134. </fieldset>
  135. </form>
  136. </template>
  137. </footer>
  138. <script type="text/javascript">
  139. function loadThemeForm(templateName) {
  140. const themeSelectorTemplate = document.querySelector(templateName)
  141. const form = themeSelectorTemplate.content.firstElementChild
  142. themeSelectorTemplate.replaceWith(form)
  143. form.addEventListener('change', (e) => {
  144. const chosenColorScheme = e.target.value
  145. localStorage.setItem('theme', chosenColorScheme)
  146. toggleTheme(chosenColorScheme)
  147. })
  148. const selectedTheme = localStorage.getItem('theme')
  149. if (selectedTheme && selectedTheme !== 'undefined') {
  150. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  151. }
  152. }
  153. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  154. window.addEventListener('load', () => {
  155. let hasDarkRules = false
  156. for (const styleSheet of Array.from(document.styleSheets)) {
  157. let mediaRules = []
  158. for (const cssRule of styleSheet.cssRules) {
  159. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  160. continue
  161. }
  162. // WARNING: Safari does not have/supports `conditionText`.
  163. if (cssRule.conditionText) {
  164. if (cssRule.conditionText !== prefersColorSchemeDark) {
  165. continue
  166. }
  167. } else {
  168. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  169. continue
  170. }
  171. }
  172. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  173. }
  174. // WARNING: do not try to insert a Rule to a styleSheet you are
  175. // currently iterating on, otherwise the browser will be stuck
  176. // in a infinite loop…
  177. for (const mediaRule of mediaRules) {
  178. styleSheet.insertRule(mediaRule.cssText)
  179. hasDarkRules = true
  180. }
  181. }
  182. if (hasDarkRules) {
  183. loadThemeForm('#theme-selector')
  184. }
  185. })
  186. </script>
  187. </body>
  188. </html>