javascript no longer a “toy” language
TRANSCRIPT
![Page 1: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/1.jpg)
JAVASCRIPT NO LONGER A “TOY” LANGUAGE
AN LP NGUYENKMS TECHNOLOGY
19TH DEC 2015
![Page 2: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/2.jpg)
ICE BREAKER
• 6-PERSON GROUPS
• GET TO KNOW EACH OTHERS
• SHARE YOUR NAME
• FILL MEMBER NAMES AS GROUP NAME
• ASK 3 MOST VALUABLE QUESTIONS
![Page 3: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/3.jpg)
JAVASCRIPT - NO LONGER A “TOY” LANGUAGE
$whoami
▸ Front-end/backend developer in KMS Incubator
▸ Ruby lover since 2011
▸ Has been in a relationship with JavaScript since 2013
An LP [email protected]@crashbell
![Page 4: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/4.jpg)
JAVASCRIPT - NO LONGER A “TOY” LANGUAGE
$whoareyou
▸ var, function, callback
▸ hoisting, prototype, closure
▸ fat arrow function, generator, async/await
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 5: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/5.jpg)
JAVASCRIPT - NO LONGER A “TOY” LANGUAGE
AGENDA
▸ Javascript 90’s – A simple client-side scripting language
▸ Stacks Javascript has been involving
▸ Demo
▸ Significant updates from ES6 and ES7
▸ Quiz and Hands-on practices
▸ Takeaways
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 6: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/6.jpg)
6
JAVASCRIPT IS MOST COMMONLY USED AS A CLIENT SIDE SCRIPTING LANGUAGE.
What is Javascript language? - Quora
JAVASCRIPT 90’S – A SIMPLE CLIENT-SIDE SCRIPTING LANGUAGE
![Page 7: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/7.jpg)
JAVASCRIPT 90’S – A SIMPLE CLIENT-SIDE SCRIPTING LANGUAGE
Fun Facts
▸ Mocha, LiveScript and JavaScript
▸ “Java” in JavaScript was a marketing strategy
▸ JavaScript was developed at Netscape - Not Sun Microsystems
▸ JavaScript is nothing related to Java except C-like syntax
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 8: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/8.jpg)
8
JAVASCRIPT 90’S – A SIMPLE CLIENT-SIDE SCRIPTING LANGUAGE
The 90’s▸ Annoying popups
▸ Status bars
▸ Mouseovers
▸ Auto scrolling
▸ Blinking texts
▸ No DOM, No CSS, No Regex
JavaScript was used in website for fun and
"annoying"Source: http://www.makeuseof.com/
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 9: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/9.jpg)
9
JAVASCRIPT 90’S – A SIMPLE CLIENT-SIDE SCRIPTING LANGUAGE
Early 2000s
▸ Standardized by ECMA
▸ Add more features:
▸ Inline events
▸ DOM parser
▸ Window manipulation
▸ …
▸ Solve cross-browser compatibility problems (not all)
Source: http://www.w3devcampus.com/
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
Still for fun and "annoying"
![Page 10: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/10.jpg)
JavaScript was a “toy” language which was used to decorate a website and solve cross-browser compatibilities
![Page 11: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/11.jpg)
11
JAVASCRIPT IS EVERYWHERE. SO ARE WE ALL OK WITH THAT?
JavaScript Journey www.theregister.co.uk
STACKS JAVASCRIPT HAS BEEN INVOLVING
![Page 12: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/12.jpg)
STACKS JAVASCRIPT HAS BEEN INVOLVING
Soucre: http://githut.info
![Page 13: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/13.jpg)
13
STACKS JAVASCRIPT HAS BEEN INVOLVING
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
Source: http://www.newspindigital.com/
MEAN
![Page 14: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/14.jpg)
14
STACKS JAVASCRIPT HAS BEEN INVOLVING
Front-End
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
▸ HTML5
▸ Single Page Application frameworks
▸ Front-end workflow
![Page 15: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/15.jpg)
15
STACKS JAVASCRIPT HAS BEEN INVOLVING
SPA Frameworks
Source: http://brewhouse.io
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 16: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/16.jpg)
16
STACKS JAVASCRIPT HAS BEEN INVOLVING
Front-End Workflow
Source: http://joellongie.com/
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 17: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/17.jpg)
17
STACKS JAVASCRIPT HAS BEEN INVOLVING
Backend
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
▸ Only NodeJS
▸ But… NodeJS is not backend web application
![Page 18: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/18.jpg)
18
STACKS JAVASCRIPT HAS BEEN INVOLVING
NodeJS
▸ Was invented in 2009
▸ Cross-platform runtime environment
▸ Built on Chrome's V8 JavaScript engine
▸ V8 compiles JavaScript to native machine code
▸ Event-driven architecture
▸ Non-blocking I/O API
▸ Not only for server-side web application!
Source: http://code-maven.com
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 19: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/19.jpg)
STACKS JAVASCRIPT HAS BEEN INVOLVING
NodeJS – Event Loop
Source: http://softwareengineeringdaily.com
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 20: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/20.jpg)
20
STACKS JAVASCRIPT HAS BEEN INVOLVING
MongoDB
▸ A cross-platform document-oriented database (NoSQL)
▸ Store JSON-like documents
▸ JavaScript object querying
▸ A perfect fit for Node.JS applications
Source: https://www.mongodb.com
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 21: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/21.jpg)
21
STACKS JAVASCRIPT HAS BEEN INVOLVING
Mobile/Desktop Applications
▸ Build cross-platform web-based desktop application with Electron
▸ React Native: A framework to build native mobile apps using React (Not a cross platform framework)
▸ Ionic: A framework to build web-based mobile apps using HTML5 & AngularJS
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 22: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/22.jpg)
JavaScript can do almost everything now!
![Page 23: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/23.jpg)
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
DEMO
REALTIME EDITOR SUPPORTS MARKDOWN
ELECTRON + REDUX + NODE.JS + SOCKET.IO
![Page 24: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/24.jpg)
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
TEA BREAK
(IN 10 MINS)
![Page 25: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/25.jpg)
25
IT’S THE NEXT VERSION OF JAVASCRIPT, AND IT HAS SOME GREAT NEW FEATURES.
ECMAScript 6 (ES6): What’s New In The Next Version Of JavaScript
www.smashingmagazine.com
SIGNIFICANT UPDATES FROM ES6/7
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 26: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/26.jpg)
Here’s not a full walkthrough of ES6/7 features
![Page 27: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/27.jpg)
SIGNIFICANT UPDATES FROM ES6/7
What is ES6/7
▸ JavaScript has been standardized since 1998 under the name ECMAScript or ES
▸ ES has been designed by TC39 (Technical Committee 39)
▸ ES releases per year (since 2015)
▸ ES6 (ECMAScript 2015) was finalized on June 17, 2015
▸ ES7 (ECMAScript 2016) is work in process
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 28: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/28.jpg)
SIGNIFICANT UPDATES FROM ES6/7
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 29: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/29.jpg)
SIGNIFICANT UPDATES FROM ES6/7
MINOR UPDATES
▸ let and const
▸ let is var with block scope
▸ template literals
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 30: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/30.jpg)
SIGNIFICANT UPDATES FROM ES6/7
MINOR UPDATES
▸ fat arrow function
▸ () => {}
▸ For..Of
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 31: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/31.jpg)
SIGNIFICANT UPDATES FROM ES6/7
CLASSES
▸ Declare a class
▸ Initialize new object
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 32: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/32.jpg)
SIGNIFICANT UPDATES FROM ES6/7
ASYNC - CALLBACK HELL
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 33: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/33.jpg)
SIGNIFICANT UPDATES FROM ES6/7
ASYNC - PROMISE
▸ Simply understanding: it has success and failure callbacks
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 34: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/34.jpg)
SIGNIFICANT UPDATES FROM ES6/7
ASYNC - PROMISE
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 35: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/35.jpg)
SIGNIFICANT UPDATES FROM ES6/7
ASYNC - Chaining Promises
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 36: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/36.jpg)
SIGNIFICANT UPDATES FROM ES6/7
ASYNC - ASYNC/AWAIT
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
![Page 37: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/37.jpg)
For more ES6 features please find here: http://es6-features.org
For ES7 async/await feature: https://github.com/tc39/ecmascript-asyncawait
Can’t wait for your current project? Check out https://babeljs.io a JavaScript compiler
![Page 38: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/38.jpg)
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
HANDS-ON PRACTICES
![Page 39: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/39.jpg)
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
Q & A
Source: http://www.faithdeployed.com
![Page 40: JavaScript No longer A “toy” Language](https://reader034.vdocuments.mx/reader034/viewer/2022051706/58eb88f61a28ab99078b462b/html5/thumbnails/40.jpg)
40
JAVASCRIPT - NO LONGER A “TOY” LANGUAGE
TAKEAWAYS▸ JavaScript is no longer a toy and
amateur language. Let change your thought (if you have) about it.
▸ JavaScript has changed rapidly on many technology stacks
▸ New versions of JavaScript have come up very fast and a lot of changes on JavaScript.
▸ Get prepared yourself!
Source: http://99u.com
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE