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

10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 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>