A book about the command line for humans.
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.

316 lines
7.1 KiB

9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
  1. <!DOCTYPE html>
  2. <html lang=en>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>get you a shell</title>
  6. <link rel=stylesheet href="slides.css" />
  7. <link rel="alternate" type="application/atom+xml" title="changes" href="//p1k3.com/userland-book/feed.xml" />
  8. <script src="../js/jquery.js" type="text/javascript"></script>
  9. </head>
  10. <body>
  11. <section>
  12. <p style="font-size: 3em; margin-bottom: 0; text-align: center;">get you a shell</p>
  13. <pre class=noborder style="margin-left: auto; margin-right: auto; width: 50%;">
  14. \ ^__^
  15. \ (oo)\_______
  16. (__)\ )\/\
  17. ||----w |
  18. || ||
  19. </pre>
  20. </section>
  21. <section>
  22. <p>Last fall, I forgot my laptop at work, but I wanted to write something.</p>
  23. <p>And then I remembered that I had a Raspberry Pi sitting around.</p>
  24. <p>So I set it up and started writing things on it.</p>
  25. </section>
  26. <section>
  27. <p>And I got to thinking: This is just a stupid Linux computer without any graphics.</p>
  28. <p>There&rsquo;s nothing here but the command line and some programs that do stuff to
  29. plain text files.</p>
  30. <p>And this is how I am happiest as a writer.</p>
  31. <p>Not as a <em>programmer</em>, or a <em>clever unix dork</em>, but as a <em>writer</em>.</p>
  32. </section>
  33. <section>
  34. <!-- exec -->
  35. <pre><code>$ cowthink I should write a book about this.
  36. ___________________________________
  37. ( I should write a book about this. )
  38. -----------------------------------
  39. o ^__^
  40. o (oo)\_______
  41. (__)\ )\/\
  42. ||----w |
  43. || ||
  44. </code></pre>
  45. <!-- end -->
  46. </section>
  47. <section>
  48. <p>So here&rsquo;s my thesis:</p>
  49. <h1><a name=Unix-is-for-normal-humans href=#Unix-is-for-normal-humans></a> Unix is for normal humans.</h1>
  50. <p>Wizards are cool and all, but most of us aren&rsquo;t wizards.</p>
  51. <p>Most of us are just bumbling through life.</p>
  52. <p>A lot of us like to make stuff anyway.</p>
  53. <p>Unix is for that.</p>
  54. </section>
  55. <section>
  56. <h1><a name=cool-story-bro href=#cool-story-bro></a> cool story bro</h1>
  57. <h1><a name=wtf-is-unix href=#wtf-is-unix></a> wtf is unix?</h1>
  58. </section>
  59. <section>
  60. <!-- jurassic park -->
  61. <p style="text-align:center;"> <img src="../images/jp_unix.jpg"></p>
  62. </section>
  63. <section>
  64. <p>&hellip;except what classical Unix really looks like is this:</p>
  65. <p style="text-align:center;"> <img src="../images/blinking.gif" width="700"></p>
  66. </section>
  67. <section>
  68. <p>And a lot of the time, modern Unix-like systems look like this:</p>
  69. <p style="text-align:center;"> <img src="../images/debian.png"></p>
  70. <p>&hellip;which isn&rsquo;t actually that unfamiliar, right?</p>
  71. </section>
  72. <section>
  73. <ul>
  74. <li><p>At SparkFun, we do a lot of stuff over serial.</p></li>
  75. <li><p>Once upon a time, most of the interfaces to Really Serious Computers &ndash; the
  76. ones at universities and in government &ndash; worked like debugging Arduino
  77. code over a serial port.</p></li>
  78. <li><p>The computer prints stuff, you type stuff to the computer, the computer
  79. prints stuff. It&rsquo;s just text in a box.</p></li>
  80. <li><p>Even once we got PCs in our houses, a lot of the interfaces shared this
  81. heritage. Remember DOS? Ever have to fire up cmd.exe on Windows?</p></li>
  82. </ul>
  83. </section>
  84. <section>
  85. <p>In 2014, the Serious way you interact with Serious Computers &ndash; the ones that
  86. most of the internet runs on &ndash; is still through a text terminal.</p>
  87. <p>If you stop by my desk at work, my screen probably looks like this:</p>
  88. <p style="text-align:center;"> <img src=fake_desktop.png width=1200px></p>
  89. </section>
  90. <section>
  91. <p>But we&rsquo;re not here to talk about Serious Computers.</p>
  92. <p>We&rsquo;re here to talk about how the command line is for normal human beings.</p>
  93. </section>
  94. <section>
  95. <pre><code>YOU ARE STANDING AT THE END OF A ROAD BEFORE A SMALL BRICK BUILDING.
  96. AROUND YOU IS A FOREST. A SMALL STREAM FLOWS OUT OF THE BUILDING AND
  97. DOWN A GULLY.
  98. &gt; GO EAST
  99. YOU ARE INSIDE A BUILDING, A WELL HOUSE FOR A LARGE SPRING.
  100. THERE ARE SOME KEYS ON THE GROUND HERE.
  101. THERE IS A SHINY BRASS LAMP NEARBY.
  102. THERE IS FOOD HERE.
  103. THERE IS A BOTTLE OF WATER HERE.
  104. </code></pre>
  105. </section>
  106. <section>
  107. <p style="text-align:center;"> <img src="fuckit.jpeg" width=800></p>
  108. <p>Now is where Brennen goes to the shell and fumbles around in front of an
  109. audience.</p>
  110. </section>
  111. <section>
  112. <p>So that&rsquo;s the shell. Want a shell?</p>
  113. <p>I will give you a shell <em>right now</em>. Talk to me.</p>
  114. <blockquote><p>https://p1k3.com/userland-book/</p>
  115. <p>http://squiggle.city/</p></blockquote>
  116. </section>
  117. <script>
  118. $(document).ready(function () {
  119. // ☜ ☝ ☞ ☟ ☆ ✠ ✡ ✢ ✣ ✤ ✥ ✦ ✧ ✩ ✪
  120. // get all the "slides", hide them
  121. $sections = $('section');
  122. $sections.hide();
  123. var section_number = 0;
  124. var $cur_section = $( $sections.get(section_number) );
  125. $cur_section.toggle(); // show first slide
  126. var transit = function (jump) {
  127. $('button').hide();
  128. $cur_section.hide();
  129. section_number += jump;
  130. if (section_number > ($sections.length - 1)) {
  131. section_number = 0;
  132. }
  133. $cur_section = $( $sections.get(section_number) );
  134. $cur_section.toggle({
  135. duration: 200,
  136. done: function () { $('button').show(); }
  137. });
  138. };
  139. var $fwd_button = $('<button class=clicker-button>next</button>');
  140. var $bwd_button = $('<button class=clicker-button>prev</button>');
  141. $fwd_button.click(function (e) {
  142. e.preventDefault();
  143. transit(1);
  144. });
  145. $bwd_button.click(function (e) {
  146. e.preventDefault();
  147. transit(-1);
  148. });
  149. $(document).keydown(function(e) {
  150. switch(e.which) {
  151. case 8: // backspace
  152. case 37: // left
  153. $bwd_button.click();
  154. break;
  155. case 32: // spacebar
  156. case 39: // right
  157. $fwd_button.click();
  158. break;
  159. case 90:
  160. toggleFullScreen();
  161. break;
  162. default:
  163. return;
  164. }
  165. e.preventDefault();
  166. });
  167. $button_group = $('<div class=buttons/>');
  168. $button_group.append($bwd_button);
  169. $button_group.append($fwd_button);
  170. $('body').append($button_group);
  171. var toggleFullScreen = function () {
  172. if (!document.fullscreenElement && // alternative standard method
  173. !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement ) { // current working methods
  174. if (document.documentElement.requestFullscreen) {
  175. document.documentElement.requestFullscreen();
  176. } else if (document.documentElement.msRequestFullscreen) {
  177. document.documentElement.msRequestFullscreen();
  178. } else if (document.documentElement.mozRequestFullScreen) {
  179. document.documentElement.mozRequestFullScreen();
  180. } else if (document.documentElement.webkitRequestFullscreen) {
  181. document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
  182. }
  183. } else {
  184. if (document.exitFullscreen) {
  185. document.exitFullscreen();
  186. } else if (document.msExitFullscreen) {
  187. document.msExitFullscreen();
  188. } else if (document.mozCancelFullScreen) {
  189. document.mozCancelFullScreen();
  190. } else if (document.webkitExitFullscreen) {
  191. document.webkitExitFullscreen();
  192. }
  193. }
  194. };
  195. });
  196. </script>
  197. </body>
  198. </html>