This slide was delivered at KMS public seminar on Dec 19, 2015 by An Nguyen - Senior Software Engineer at KMS

1. JAVASCRIPT
NO LONGER A “TOY” LANGUAGE
AN LP NGUYEN
KMS TECHNOLOGY
19TH DEC 2015

2. ICE BREAKER
• 6-PERSON GROUPS
• GET TO KNOW EACH OTHERS
• SHARE YOUR NAME
• FILL MEMBER NAMES AS GROUP NAME
• ASK 3 MOST VALUABLE QUESTIONS

3. 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 Nguyen
anlpnguyen@kms-technology.com
@crashbell

4. 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

5. 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

6. 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

7. 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

8. 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

9. 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"

10. JavaScript was a “toy” language which
was used to decorate a website and
solve cross-browser compatibilities

11. 11
JAVASCRIPT IS EVERYWHERE.
SO ARE WE ALL OK WITH
THAT?
JavaScript Journey www.theregister.co.uk
STACKS JAVASCRIPT HAS BEEN INVOLVING

12. STACKS JAVASCRIPT HAS BEEN INVOLVING
Soucre: http://githut.info

13. 13
STACKS JAVASCRIPT HAS BEEN INVOLVING
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
Source: http://www.newspindigital.com/
MEAN

14. 14
STACKS JAVASCRIPT HAS BEEN INVOLVING
Front-End
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
▸ HTML5
▸ Single Page Application frameworks
▸ Front-end workflow

15. 15
STACKS JAVASCRIPT HAS BEEN INVOLVING
SPA Frameworks
Source: http://brewhouse.io
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

16. 16
STACKS JAVASCRIPT HAS BEEN INVOLVING
Front-End Workflow
Source: http://joellongie.com/
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

17. 17
STACKS JAVASCRIPT HAS BEEN INVOLVING
Backend
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
▸ Only NodeJS
▸ But… NodeJS is not backend web application

18. 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

19. STACKS JAVASCRIPT HAS BEEN INVOLVING
NodeJS – Event Loop
Source: http://softwareengineeringdaily.com
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

20. 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

21. 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

22. JavaScript can do almost everything now!

23. JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
DEMO
REALTIME EDITOR SUPPORTS MARKDOWN
ELECTRON + REDUX + NODE.JS + SOCKET.IO

24. JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
TEA BREAK
(IN 10 MINS)

25. 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

26. Here’s not a full walkthrough of ES6/7
features

27. 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

28. SIGNIFICANT UPDATES FROM ES6/7
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

29. SIGNIFICANT UPDATES FROM ES6/7
MINOR UPDATES
▸ let and const
▸ let is var with block scope
▸ template literals
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

30. SIGNIFICANT UPDATES FROM ES6/7
MINOR UPDATES
▸ fat arrow function
▸ () => {}
▸ For..Of
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

31. SIGNIFICANT UPDATES FROM ES6/7
CLASSES
▸ Declare a class
▸ Initialize new object
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

32. SIGNIFICANT UPDATES FROM ES6/7
ASYNC - CALLBACK HELL
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

33. SIGNIFICANT UPDATES FROM ES6/7
ASYNC - PROMISE
▸ Simply understanding: it has success and failure
callbacks
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

34. SIGNIFICANT UPDATES FROM ES6/7
ASYNC - PROMISE
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

35. SIGNIFICANT UPDATES FROM ES6/7
ASYNC - Chaining Promises
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

36. SIGNIFICANT UPDATES FROM ES6/7
ASYNC - ASYNC/AWAIT
JAVASCRIPT – NO LONGER A “TOY” LANGUAGE

37. 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

38. JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
HANDS-ON PRACTICES

39. JAVASCRIPT – NO LONGER A “TOY” LANGUAGE
Q & A
Source: http://www.faithdeployed.com

40. 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

41. THANK YOU
© 2013 KMS Technology