Don't Panic @ Fronteers Conference 2017

Don't Panic @ Fronteers Conference 2017

10 years is a long time. You can change the world in less. So what have we done over the last decade? And more importantly, what lessons have we learned?

De023a9aff4c7a5ede3a81e8c76f17b5?s=128

Niels Leenheer

October 05, 2017
Tweet

Transcript

  1. don't panic don't panic

  2. don't panic don't panic

  3. don't panic don't panic

  4. don't panic don't panic

  5. don't panic don't panic

  6. chriet titulaer
 1943 — 2017

  7. None
  8. None
  9. None
  10. wubbo ockels
 1946 — 2014

  11. None
  12. None
  13. None
  14. None
  15. 110 meters tall

  16. 2.58 km/s top speed

  17. 384,400 km from home

  18. 384,400

  19. 384,400 almost identical websites B

  20. None
  21. BREAK THE INTERNET

  22. None
  23. None
  24. None
  25. None
  26. None
  27. None
  28. None
  29. None
  30. None
  31. None
  32. None
  33. None
  34. None
  35. None
  36. None
  37. None
  38. always bet 
 on the web

  39. the golden age 
 of frontend 
 development

  40. platforms

  41. platforms

  42. platforms

  43. platforms

  44. platforms

  45. compatiblity

  46. None
  47. None
  48. developer tools

  49. frameworks

  50. frameworks dhtml

  51. frameworks prototype

  52. frameworks mootools

  53. frameworks jquery

  54. frameworks yui

  55. frameworks dojo

  56. frameworks ext

  57. frameworks flex

  58. frameworks flex?

  59. frameworks flex

  60. frameworks unified

  61. frameworks amber.js

  62. frameworks bootstrap

  63. frameworks backbone.js

  64. frameworks nuclear.js

  65. frameworks knockout.js

  66. frameworks angular-js

  67. frameworks angular 2

  68. frameworks sencha touch

  69. frameworks vanilla js

  70. frameworks polymer

  71. frameworks react

  72. frameworks preact

  73. frameworks vue

  74. frameworks hyperhtml

  75. frameworks

  76. None
  77. features

  78. features

  79. features dom html tokeniser and tree builder, svg without plugins

    and inline in html5, custom elements, shadow dom and templates
  80. features elements new semantic elements like section, nav, article, aside,

    header, footer and more, new form fields types for search, telephone numbers, urls, email, dates, month, week, time, number, range and color
  81. features video the video element, subtitles, track selection, 
 video

    streaming and drm plugins
  82. features audio the audio element, generating audio using 
 web

    audio, speech recognition and 
 speech synthesis
  83. features graphics responsive images, improvements to canvas, web animation, requestanimationframe,

    webgl and webvr
  84. features storage web sql database and indexeddb

  85. features network server send event, beacon, fetch, web sockets, streams,

    webrtc, peer to peer messaging, csp and sub resource integrity
  86. features devices gamepad control, pointer lock, access to the webcam,

    device motion, device orientation, sensor api, web bluetooth and web usb
  87. features offline support service workers, cache api, push messages

  88. features scripting mutations observer, url api, encoding api, modules, classes,

    arrow functions, promises, template strings, typed arrays, internationalisation, async and await
  89. features css gradients, transforms, transition, animations, shadow, fonts, media queries,

    selectors, flex box, grid
  90. features

  91. None
  92. None
  93. None
  94. None
  95. goodbye
 internet 
 explorer

  96. internet explorer
 is a good browser

  97. internet explorer 6
 is a good browser

  98. internet explorer 6
 is a great browser

  99. internet explorer 6
 is a great browser (15 years ago)

  100. None
  101. None
  102. None
  103. None
  104. it's okay to build 
 a website that 
 doesn't

    work without
 javascript
  105. None
  106. None
  107. the tinfoil hat
 approach to
 javascript

  108. the tinfoil hat
 approach to
 javascript developers, 
 developers,
 developers

  109. progressive 
 enhancement

  110. None
  111. None
  112. a bad 
 user experience 
 is just bad

  113. it's okay to build 
 a websiteapp that 
 doesn't

    work without
 javascript
  114. the web consists of 
 three pillars and
 javascript 


    is one of them
  115. users over authors 
 over implementors 
 over specifiers over

    theoretical purity – w3c html5 design principles
  116. None
  117. browser
 diversity

  118. None
  119. None
  120. None
  121. None
  122. None
  123. best viewed with

  124. we don't develop
 for browsers...
 
 we develop for
 the

    web
  125. ten good 
 things about 
 bootstrap

  126. #1 consistency

  127. cheap #2

  128. free #2

  129. cheap #3

  130. easy #4

  131. #5

  132. None
  133. delight your 
 users

  134. make things 
 a little bit 
 better

  135. experiment

  136. be happy

  137. None