Today headlines in Javascript, 2019

687ac25540fe35fcb5e828f75c4a6079?s=47 Jimmy Moon
September 27, 2019

Today headlines in Javascript, 2019

지금! 자바스크립트 하려면 알아야 할 것들

687ac25540fe35fcb5e828f75c4a6079?s=128

Jimmy Moon

September 27, 2019
Tweet

Transcript

  1. ૑Ә! ੗߄झ௼݀౟ ೞ ۰ݶ ঌইঠ ೡ Ѫٜ Today headlines in

    Javascript, 2019
  2. None
  3. ੗߄झ௼݀౟ Javascript

  4. One of Most Popular Programming Languages

  5. https://octoverse.github.com/projects#languages

  6. None
  7. TIOBE programming community index is a measure of popularity of

    programming languages
  8. Javascript Running on manywhere

  9. https://en.wikipedia.org/wiki/JavaScript Initially only implemented client-side in web browsers, JavaScript engines

    are now embedded in many other types of host software, including server-side, databases, and in non-web programs, mobile and desktop applications.
  10. https://en.wikipedia.org/wiki/JavaScript Initially only implemented client-side in web browsers, JavaScript engines

    are now embedded in many other types of host software, including server-side, databases, and in non-web programs, mobile and desktop applications.
  11. https://en.wikipedia.org/wiki/JavaScript Initially only implemented client-side in web browsers, JavaScript engines

    are now embedded in many other types of host software, including server-side, databases, and in non-web programs, mobile and desktop applications.
  12. None
  13. None
  14. None
  15. None
  16. None
  17. None
  18. Community Driven Language

  19. ECMAScript/ES 20XX

  20. ECMAScript/ES 20XX == Javascript/JS

  21. https://en.wikipedia.org/wiki/JavaScript In November 1996, Netscape submitted JavaScript to ECMA International

    to carve out a standard specification, ... ECMAScript published in the first edition of the ECMA-262 standard in June 1997, ECMAScript 2 in June 1998, The release of ECMAScript 3 followed in December 1999, by 2003, the original ECMAScript 4 work was mothballed. The development of ECMAScript 4 was never completed. ... Alas, there was still turmoil between the various players ... While all of this was happening, the open source and developer communities set to work to revolutionize what could be done with JavaScript, in early 2009 to rename ECMAScript 3.1 to ECMAScript 5 and drive the language forward using an agenda that is known as Harmony. ECMAScript 5 was finally released in December 2009. In June 2011, ECMAScript 5.1 was released to fully align with the third edition of the ISO/IEC 16262 international standard. ECMAScript 2015 was released in June 2015. ECMAScript 2016 was released in June 2016. The current version is ECMAScript 2017, released in June 2017
  22. https://en.wikipedia.org/wiki/JavaScript In November 1996, Netscape submitted JavaScript to ECMA International

    to carve out a standard specification, ... ECMAScript published in the first edition of the ECMA-262 standard in June 1997, ECMAScript 2 in June 1998, The release of ECMAScript 3 followed in December 1999, by 2003, the original ECMAScript 4 work was mothballed. The development of ECMAScript 4 was never completed. ... Alas, there was still turmoil between the various players ... While all of this was happening, the open source and developer communities set to work to revolutionize what could be done with JavaScript, in early 2009 to rename ECMAScript 3.1 to ECMAScript 5 and drive the language forward using an agenda that is known as Harmony. ECMAScript 5 was finally released in December 2009. In June 2011, ECMAScript 5.1 was released to fully align with the third edition of the ISO/IEC 16262 international standard. ECMAScript 2015 was released in June 2015. ECMAScript 2016 was released in June 2016. The current version is ECMAScript 2017, released in June 2017
  23. None
  24. Stage 0: Strawman, submitting ideas and review Stage 1: Proposal,

    formal proposal for the feature
 Stage 2: Draft, first version of what will be in the specification Stage 3: Candidate, the proposal is mostly finished
 Stage 4: Finished, the proposal is ready to be included in the standard ECMAScript/ES 20XX
  25. None
  26. None
  27. None
  28. None
  29. Compiling, to Javascript

  30. None
  31. - TypeScript: TypeScript is a superset of JavaScript that compiles

    to clean JavaScript output - Flow: Flow is a static typechecker for JavaScript - ReasonML: Simple, fast & type safe code that leverages the JavaScript & OCaml ecosystems - PureScript: A strongly-typed language that compiles to Javascript, written in and inspired by Haskell https://hackernoon.com/the-status-of-javascript-libraries-frameworks-2018-beyond-3a5a7cae7513 ClojureScript
  32. None
  33. - Superset of JavaScript that brings users optional static types

    and solid tooling - Designed for development of large applications and transcompiles to JavaScript - Maintained by Microsoft, Backed by Google (Angular and other project) - Support in many mature IDEs - Annotations and Compile-time type checking, Interfaces, Enumerated, Generics, Namespaces, Tuples, Async/await, Classes Modules ...
  34. None
  35. None
  36. None
  37. None
  38. None
  39. https://hyunseob.github.io/2018/08/12/do-you-need-to-use-ts/

  40. ࠳ۄ਋੷ Browsers

  41. Browser, platform for Web Applications

  42. None
  43. None
  44. None
  45. None
  46. Engine, composing layout and running Javascript

  47. Blink V8 Webkit Nitro Gecko(Quantum) Spidermonkey EdgeHTML Chakra Blink V8

    Blink V8
  48. None
  49. Blink V8 Webkit Nitro Gecko(Quantum) Spidermonkey Blink V8 Blink V8

    Blink V8
  50. None
  51. Web Audio / Midi https://ryoyakawai.com/blog/2015/07/27/webmusic-hackathon-kyoto-en.html

  52. Web Assembly (aka, WASM)

  53. https://blog.logrocket.com/webassembly-how-and-why-559b7f96cd71

  54. https://blog.logrocket.com/webassembly-how-and-why-559b7f96cd71

  55. None
  56. https://developers.google.com/web/updates/2019/02/hotpath-with-wasm

  57. https://www.youtube.com/watch?v=njt-Qzw0mVY

  58. None
  59. https://hacks.mozilla.org/2019/03/standardizing-wasi-a-webassembly-system-interface/

  60. https://hacks.mozilla.org/2019/08/webassembly-interface-types/

  61. None
  62. None
  63. None
  64. None
  65. None
  66. Web Capabilities (aka, Fugu)

  67. https://www.youtube.com/watch?v=GSiUzuB-PoI

  68. https://www.youtube.com/watch?v=GSiUzuB-PoI

  69. None
  70. য೒ܻா੉࣌ Applications

  71. https://github.com/kamranahmedse/developer-roadmap

  72. None
  73. Workflow, whole development process of Javascript Application

  74. TOOLING ERA

  75. Init Dev Build Deploy

  76. None
  77. None
  78. Framework, is a starting point, not a goal

  79. REACT NEXT.JS VUE.JS NUXT.JS PREACT ANGULAR POLYMER EMBER (GLIMMER) GOOD

    OPTIONS WITH WORKFLOW
  80. None
  81. https://npmcharts.com/compare/react,angular,@angular/core,ember-cli,vue,@polymer/polymer,next,nuxt,preact

  82. - Best practices built with the framework - Zero configuration

    tooling - Customizable configs - Exporting static files - PWA supports - Optimized performance - Tutorials, books and videos for learning - Developer Experience
  83. None
  84. None
  85. Packages Manager

  86. 2018

  87. 2019

  88. None
  89. None
  90. None
  91. Tink 2

  92. None
  93. None
  94. None
  95. Data Management, manage multiple pieces of state scattered across many

    components
  96. https://facebook.github.io/flux/docs/in-depth-overview.html State Management, Flux

  97. https://www.jahia.com/about-us/news-events/blog/introduction-to-graphql GraphQL

  98. None
  99. None
  100. Bundling, tighten up your application for serving in production-ready version

  101. None
  102. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices

  103. None
  104. Tools, Editing, Debugging, Auditing and Testing

  105. None
  106. https://next-hnpwa.now.sh/ LIGHTHOUSE

  107. LIGHTHOUSE SCORE

  108. - Unit testing - E2E testing - UI Testing (Component)

    - Browser-side testing
  109. None
  110. ࢲߡ-ࢎ੉٘ Server-Side

  111. Node, one of popular solutions in front-end server

  112. - Node(node, Node.js) - V8 Engine for running Javascript out

    of browser - Light, fast, running on cross-platforms - Asynchronous I/O via libuv - Event-driven and Non-blocking I/O - Strong community, Node foundation and npm - Isomorphic (Universal) JavaScript Application
  113. https://medium.com/@addyosmani/progressive-web-apps-with-react-js-part-4-site-is-progressively-enhanced- b5ad7cf7a447

  114. None
  115. None
  116. None
  117. None
  118. None
  119. Deno, secure TypeScript run-time on V8

  120. https://www.youtube.com/watch?v=M3BM9TB-8yA 10 Things I Regret About Node.js - Ryan Dahl

    - JSConf EU 2018
  121. None
  122. None
  123. ݽ߄ੌ Mobile

  124. Native app w/ Javascript Mobile Web App vs

  125. Mobile Web Application, web application with a first-class mobile experience

  126. - App like
 - Secure - Installable - Offline working


    - Notification - Discoverable - Device features Progressive Web Apps
  127. None
  128. None
  129. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices

  130. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices

  131. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices

  132. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices

  133. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices

  134. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices

  135. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices

  136. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices

  137. Native Mobile App, w/ Javascript

  138. React Native Native Script Vue Native Ionic (Angular)

  139. None
  140. None
  141. None
  142. None
  143. None
  144. ؘझ௼఑ Desktop

  145. Electron Progressive Webapp

  146. Electron, the best way to make a desktop app in

    web technologies on multi-platform
  147. Practice on embedding Node.js into Atom Editor // Speaker Deck

    - https://goo.gl/ENyzp9
  148. None
  149. PWA for Desktop

  150. https://developers.google.com/web/updates/2018/05/dpwa

  151. None
  152. None
  153. None
  154. ੗߄झ௼݀౟ ೠߣ ೧ ࠁࣁਃ Try it! Now!