Today headlines in Javascript, 2019

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

Transcript

1. ૑Ә! ੗߄झ௼݀౟ ೞ ۰ݶ ঌইঠ ೡ Ѫٜ Today headlines in Javascript, 2019
3. ੗߄झ௼݀౟ Javascript
4. One of Most Popular Programming Languages
5. https://octoverse.github.com/projects#languages
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.
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
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
29. Compiling, to Javascript
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
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 ...
39. https://hyunseob.github.io/2018/08/12/do-you-need-to-use-ts/
40. ࠳ۄ਋੷ Browsers
41. Browser, platform for Web Applications
46. Engine, composing layout and running Javascript
47. Blink V8 Webkit Nitro Gecko(Quantum) Spidermonkey EdgeHTML Chakra Blink V8 Blink V8
49. Blink V8 Webkit Nitro Gecko(Quantum) Spidermonkey Blink V8 Blink V8 Blink V8
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
56. https://developers.google.com/web/updates/2019/02/hotpath-with-wasm
57. https://www.youtube.com/watch?v=njt-Qzw0mVY
59. https://hacks.mozilla.org/2019/03/standardizing-wasi-a-webassembly-system-interface/
60. https://hacks.mozilla.org/2019/08/webassembly-interface-types/
66. Web Capabilities (aka, Fugu)
67. https://www.youtube.com/watch?v=GSiUzuB-PoI
68. https://www.youtube.com/watch?v=GSiUzuB-PoI
70. য೒ܻா੉࣌ Applications
71. https://github.com/kamranahmedse/developer-roadmap
73. Workflow, whole development process of Javascript Application
74. TOOLING ERA
75. Init Dev Build Deploy
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
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
85. Packages Manager
91. Tink 2
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
100. Bundling, tighten up your application for serving in production-ready version
102. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices
104. Tools, Editing, Debugging, Auditing and Testing
106. https://next-hnpwa.now.sh/ LIGHTHOUSE
107. LIGHTHOUSE SCORE
108. - Unit testing - E2E testing - UI Testing (Component) - Browser-side testing
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
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
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
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)
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
149. PWA for Desktop
150. https://developers.google.com/web/updates/2018/05/dpwa
154. ੗߄झ௼݀౟ ೠߣ ೧ ࠁࣁਃ Try it! Now!