Today, The Actions in Javascript

지금! 자바스크립트로 할수 있는 것 들.

Transcript

1. ૑Ә! ੗߄झ௼݀౟۽ ೡ ࣻ ੓ח Ѫٜ Today, The Actions in Javascript
2. ੗߄झ௼݀౟ Javascript
3. One of Most Popular Programming Languages
8. Running Javascript Application Manywhere
12. 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.
13. 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.
14. Browsers Server Desktop IoT Mobile
15. Community Driven Language
16. ECMAScript/ES 20XX
17. ECMAScript/ES 20XX == Javascript/JS
18. 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
19. 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
20. 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
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. 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. 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
25. 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
26. 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
28. 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
32. Compiling, to Javascript
33. - 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
34. - 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 ...
38. https://hyunseob.github.io/2018/08/12/do-you-need-to-use-ts/
39. ࠳ۄ਋੷ Browsers
40. Browser, platform for Web Applications
45. Engine, composing layout and running Javascript
46. Blink V8 Webkit Nitro Gecko(Quantum) Spidermonkey EdgeHTML Chakra Blink V8 Blink V8
47. - Chrome, Chromium, Opera and Samsung Mobile Browser - Developed for The Chromium Project for Google Chrome and Chromium web browsers - Used Node.js that are used server-side and CLI (terminal) - Enabling Ignition and TurboFan pipeline
48. Quantum - Firefox Browser - Builded for the next-generation web engine for Firefox users - Written in Rust Programming Language for better memory safety, concurrency, and parallelism on multiple CPU core than compiled C++ code
49. Chakra Core - Edge Browser - High-performance JavaScript engine that powers Microsoft Edge - Open-sourced - Microsoft created a PR in the Node.js GitHub repo to use ChakraCore instead of V8
50. - Web Components - Web Assembly - Web Worker, Worklet - Web Payment - WebVR / AR
53. https://blog.logrocket.com/webassembly-how-and-why-559b7f96cd71
54. https://blog.logrocket.com/webassembly-how-and-why-559b7f96cd71
56. য೒ܻா੉࣌ Applications
57. Workflow, whole development process of Javascript Application
58. https://github.com/kamranahmedse/developer-roadmap
59. TOOLING ERA
61. Init Dev Build Deploy
62. Init Scaffolding application that already work with solutions
63. Dev Iterated development with compile, linting, and reloading on dev server
64. Build Build production ready application
65. Deploy One command deploy to your server
68. REACT NEXT.JS VUE.JS NUXT.JS PREACT ANGULAR POLYMER EMBER (GLIMMER) GOOD OPTIONS WITH WORKFLOW
69. https://npmcharts.com/compare/react,angular,@angular/core,ember-cli,vue,@polymer/polymer,next,nuxt,preact
70. https://2017.stateofjs.com/
71. Framework, is a starting point, not a goal
72. - Best practices built with framework - Zero configuration tooling - Customizable configs - Exporting static files - PWA supports - Build with optimized performance like code- splitting - Good tutorials, books and videos for learning - Developer Ergonomics
73. Packages, reliability pattern is a design that result in reliable for production-ready application
79. CSS in JS, JavaScript as a language to describe and update styles
82. State Management, manage multiple pieces of state scattered across many components
83. https://facebook.github.io/flux/docs/in-depth-overview.html
85. Bundling, tighten up your application for serving in production-ready version
87. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices
89. Tools, Editing, Debugging, Auditing and Testing
91. https://next-hnpwa.now.sh/ LIGHTHOUSE
92. LIGHTHOUSE SCORE
93. SOURCE EDITING
94. EAGER EVALUATION
95. OVERRIDES
96. - Unit testing - E2E testing - UI Testing (Component) - Browser-side testing
98. ࢲߡ-ࢎ੉٘ Server-Side
99. Node, one of popular solutions in front-end server
100. - 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
101. https://www.youtube.com/watch?v=PNa9OMajw9w
102. https://medium.com/airbnb-engineering/isomorphic-javascript-the-future-of-web-apps-10882b7a2ebc
103. https://medium.com/@addyosmani/progressive-web-apps-with-react-js-part-4-site-is-progressively-enhanced- b5ad7cf7a447
104. 2018 Node.js User Survey Report - https://nodejs.org/en/user-survey-report/#profile2
108. Deno, secure TypeScript run-time on V8
109. https://www.youtube.com/watch?v=M3BM9TB-8yA 10 Things I Regret About Node.js - Ryan Dahl - JSConf EU 2018
110. - Bitcoin - Messaging server, MQTT - Bot Server - Game Server - Front-end app, auth server
 
 - AWS Lambda
111. ݽ߄ੌ Mobile
112. Native app w/ Javascript Mobile Web App vs
113. Mobile Web Application, web application with a first-class mobile experience
114. - App like
 - Secure - Installable - Offline working
 - Notification - Discoverable - Device features Progressive Web Apps
120. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices
121. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices
122. Usecase, @Pinterest
123. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices
124. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices
125. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices
126. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices
127. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices
128. https://speakerdeck.com/addyosmani/fast-by-default-modern-loading-best-practices
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. Native Mobile App, w/ Javascript
132. React Native Native Script Vue Native Ionic (Angular)
133. https://2017.stateofjs.com/2017/mobile/results
137. ؘझ௼఑ Desktop
138. Electron Nw.Js Progressive Webapp
139. Electron, the best way to make a desktop app in web technologies on multi-platform
140. Practice on embedding Node.js into Atom Editor // Speaker Deck - https://goo.gl/ENyzp9
143. PWA for Desktop
144. https://developers.google.com/web/updates/2018/05/dpwa
147. ই੉য়౭ IoT
148. - Not OS, runtime based - Using rich Javascript ecosystem, messaging protocols is already ready-for-production - Many of SDKs already support Javascript - Universal service for IoT, node based Server , and webapp, and device client - Support Native Interface JavaScript: The Perfect Language for the Internet of Things (IoT)
150. ੗߄झ௼݀౟ ೠߣ ೧ ࠁࣁਃ Try it! Now!