This Web Site is a Tech Talk

  1. Created by zachleat. Code on GitHub. This will make a lot more sense if you watch the talk video.
  2. Caveat: due to the time constraints of developing this presentation, these slides are not touchscreen friendly. I consider this a bug—yet here we are.
  3. If you’re watching the talk you should not see this page. The talk begins on the next slide: Decoy.

    Keyboard commands:

    • Any key Reveal another character of code or text
    • ⌘← Previous slide
    • ⌘→ or Enter Next slide
    • ⌘↑ Back to index
    • ` Skip animation
  4. Decoy 0.0
  5. Typing 1.0
  6. 1.1
  7. HTML 2.0
  8. 2.1
  9. 2.11
  10. 2.2
  11. 2.3
  12. 2.4
  13. 3.0
  14. 3.1
  15. Add some CSS 3.2
  16. 3.3
  17. 3.4
  18. 3.5
  19. 3.6
  20. 3.7
  21. 4.0
  22. 4.1
  23. 4.2
  24. 4.3
  25. 4.4
  26. Netlify Drop 5.0
  27. 5.1
  28. 5.2
  29. 5.3
  30. 5.4
  31. 5.5
  32. 5.6
  33. 5.7
  34. 5.8
  35. 6.0
  36. Add Eleventy 6.1
  37. 6.2
  38. npm install @11ty/eleventy 6.3
  39. 6.4
  40. 6.5
  41. Move styles inline 7.0
  42. 7.1
  43. Add a layout 7.2
  44. 7.3
  45. 7.4
  46. 7.5
  47. 7.6
  48. 7.7
  49. React docs for Create React App 7.8
  50. Install all the dependencies 8.0
  51. npm install create-react-app 8.1
  52. 8.2
  53. 8.3
  54. 8.4
  55. Preview create-react-app output 8.5
  56. 8.6
  57. 8.7
  58. Preview create-react-app output 8.8
  59. 8.9
  60. 8.901
  61. Preview create-eleventy-site output 8.902
  62. 8.903
  63. Create Eleventy Site vs. Create React App 8.91
  64. Create Eleventy Site vs. Create React App 8.911
  65. Twitter SPA Redesign 8.912
  66. Preview Twitter Export output 8.92
  67. Preview twitter.com Tweet 8.93
  68. Tweet versus Export Filmstrip 8.94
  69. 9.0
  70. 9.01
  71. 9.02
  72. 9.03
  73. 9.1
  74. Framework JavaScript bundle sizes 9.2
  75. Tim Kadlec’s post The Cost of JavaScript Frameworks 9.3
  76. 9.5
  77. 9.6
  78. 9.61
  79. Framework JavaScript bundle sizes 10.0
  80. 10.1
  81. npm install @11ty/eleventy-plugin-syntaxhighlight 11.0
  82. 11.1
  83. Add .eleventy.js Config File 11.2
  84. Syntax Highlight 11.3
  85. Character Wrap Configuration 12.0
  86. Character Wrap example 12.1
  87. Add typing code 12.3
  88. Typing output 12.4
  89. Typing with JavaScript 12.5
  90. Live type the HTML 13.0
  91. 13.1
  92. 13.2
  93. Loop 14.0
  94. Loopty Loop 14.1
  95. Loopty Loopty Loop 14.2
  96. Conclusion 15.0
  97. 15.1
  98. 15.2
  99. 15.3
  100. 15.31
  101. 15.32
  102. 15.33
  103. 15.4
  104. Goodbye 16.0
  105. Decoy End 16.1