SlideShare a Scribd company logo

NetBeans Support for EcmaScript 6

•
•
Kostas Saidis
Kostas Saidis

This presentation provides a brief overview of the history of JavaScript and its ecosystem and highlights the excellent JS support provided by the latest NetBeans IDE. You can find the examples on github: https://github.com/saikos/NetBeansES6Support

1 of 40
Download to read offline
NetBeans support for EcmaScript 6 Kostas Saidis @saikos NetBeans Day Athens 2017 April 21, 2016
About Me Software and Data Architect Adjunct Lecturer @ di.uoa.gr (University of Athens) teaching Software Engineering Managing Director @ niovity.com Early Java enthusiast (since 1997) Diving into JavaScript since 2010 2
The JavaScript Ecosystem 3
Brief history 1993: First web browser Mosaic by NCSA, University of Illinois 1994: Netscape browser Netscape Navigator (code named Mozilla) 1995: Brendan Eich develops JavaScript Netscape Navigator 2.0 & Netscape Enterprise Server 4
The core of JavaScript A dynamically typed, interpreted language that was intentionally designed to look like Java supporting Scheme-like functions (functional paradigm) and Self-like prototypes (object-oriented paradigm) Douglas Crockford, "JavaScript: The good parts", 2008, O'Reilly Media 5
Example https://github.com/monsur/jscache function Cache(maxSize, debug, storage) { this.maxSize_ = maxSize || -1; this.debug_ = debug || false; this.storage_ = storage || new Cache.BasicCacheStorage(); this.fillFactor_ = .75; this.stats_ = {}; this.stats_['hits'] = 0; this.stats_['misses'] = 0; } 6
The rst 20 years 1996 Microsoft JScript engine (in IE 3.0 & IIS) Mozilla SpiderMonkey JavaScript engine (Netscape Navigator 3.0) Submission of JavaScript to ECMA International Opera Browser NetBeans IDE! 7
The rst 20 years 1997 Dynamic HTML (IE 4) ES1 (ECMA-262 standard) 8
The rst 20 years 1998 Netscape releases the source of Navigator Mozilla Foundation Gecko HTML engine Rhino JavaScript engine (Java) ES2 (ISO/IEC 16262 standard) 9
The rst 20 years 1999 AJAX, XMLHTTPRequest (IE 5) Macromedia Flash ES3 Regular expressions Exceptions, try/catch blocks do...while , in , instanceof Enhancements in arrays, strings, numbers 10
The rst 20 years 2000 ES4 (Never released, abandoned) Adobe ActionScript, ES4 derivative (classes, static typing, etc) 11
The rst 20 years 2001 Douglas Crockford The World's Most Misunderstood Programming Language JSON 12
The rst 20 years 2002 Mozilla Suite 1.0 Firefox Outlook Web App (AJAX goes mainstream) JSON.org 13
The rst 20 years 2003 Safari Web Browser WebKit & Nitro engines (forks of KDE HTML/JS engines) 14
The rst 20 years 2004 Google Mail (AJAX for the masses) Dojo toolkit 15
The rst 20 years 2005 Jesse James Garrett, Ajax: A New Approach to Web Applications prototype.js, the dollar function $() 16
The rst 20 years 2006 jQuery Yahoo! User Interface library 17
The rst 20 years 2007 PC World, Netspace Navigator: the best tech product of all time 18
The rst 20 years 2008 Google Chrome V8 JavaScript engine Chromium Project 19
The rst 20 years 2009 ES5 (ES3.1 essentially) node.js (server-side JS) CommonJS (JS modules) AngularJS PhoneGap, hybrid JS apps (now Apache Cordova) 20
The rst 20 years 2009 CoffeeScript, the rst language to transpile to JS underscore.js, functional programming in JS (superseded by lodash.js) 21
The rst 20 years 2010 Backbone.js, MVC library Express.js, Web framework for node.js Knockout.js, MVVM library PhantomJS, Headless Webkit 22
The rst 20 years 2011 Data-driven documents with D3.js Asynchronous Module De nitions (AMD) with require.js Ember.js, MVC library 23
The rst 20 years 2012 Oracle releases Nashorn JavaScript engine (Java), the default JavaScript engine in Java 8 Meteor.js, web framework (node.js, hybrid, reactive) TypeScript by Microsoft (transpiled to JS) 24
The rst 20 years 2013 React framework by Facebook asm.js by Mozilla ElectronJS by Github (atom-shell) 25
The rst 20 years 2014 HTML5 - APIs everywhere The (unof cial) death of XML? 26
The rst 20 years 2015 ES6 (Harmony, ES2015) React Native (hybrid apps) WebAssembly (assembly for the web) 27
JavaScript is here to stay! JavaScript is the lingua franca of the Web rapidly turning into a general-purpose programming language with a massive usage base ES2016 (minor additions to ES6) ESNext (next features, like async/await) 28
Apache NetBeans is here to stay, too! 29
JavaScript Support in NetBeans 8.2 Built-in support for JS and a multitude of tools, libraries and frameworks Support for ES6 and beyond 30
Built-in JS Support Syntax highlighting Code folding Code completion and analysis Refactoring Structural navigation Lints/Hints Integrated debugger 31
And more Bracket matching Go to declaration JSDoc JSON JS embedding (HTML, PHP, etc) 32
Developing JS with Netbeans Embedded web server (run your apps from within the IDE) Automagical update in the web browser (Embedded Webkit or Chrome with plugin) 33
Tools and Libraries Inherent support for JS libs/tools at the source level Node.js and npm Grunt, Gulp, Bower, Require.js, Karma, Express.js, Babel, Webpack, ... LESS, SASS Apache Cordova Oracle JET NB Plugins 34
ES6 Features Modules with import and export Constants with const Block scoped variables with let Arrow functions with => Classes with class and extends and super String interporation with `${var}` 35
ES6 Features Default parameter values, rest & spread operators Desctructuring of objects and arrays Promises Enhanced object literals New collections (Set, Map, WeakSet, WeakMap) 36
Not covered here Generators & iterators Various other goodies, such as Symbols Metaprogramming (Proxies & Re ection) Math, String, Number enhancements Binary and octal literals and more... 37
Example github repo 38
References A brief history of JavaScript A re-introduction to JavaScript ECMAScript 6 New Features: Overview & Comparison NB Wiki ECMAScript 6, Modules, Babel, Webpack, and NetBeans IDE 39
Thank you! @saikos Linkedin 40

More Related Content

NetBeans Support for EcmaScript 6

  • 1. NetBeans support for EcmaScript 6 Kostas Saidis @saikos NetBeans Day Athens 2017 April 21, 2016
  • 2. About Me Software and Data Architect Adjunct Lecturer @ di.uoa.gr (University of Athens) teaching Software Engineering Managing Director @ niovity.com Early Java enthusiast (since 1997) Diving into JavaScript since 2010 2
  • 4. Brief history 1993: First web browser Mosaic by NCSA, University of Illinois 1994: Netscape browser Netscape Navigator (code named Mozilla) 1995: Brendan Eich develops JavaScript Netscape Navigator 2.0 & Netscape Enterprise Server 4
  • 5. The core of JavaScript A dynamically typed, interpreted language that was intentionally designed to look like Java supporting Scheme-like functions (functional paradigm) and Self-like prototypes (object-oriented paradigm) Douglas Crockford, "JavaScript: The good parts", 2008, O'Reilly Media 5
  • 6. Example https://github.com/monsur/jscache function Cache(maxSize, debug, storage) { this.maxSize_ = maxSize || -1; this.debug_ = debug || false; this.storage_ = storage || new Cache.BasicCacheStorage(); this.fillFactor_ = .75; this.stats_ = {}; this.stats_['hits'] = 0; this.stats_['misses'] = 0; } 6
  • 7. The rst 20 years 1996 Microsoft JScript engine (in IE 3.0 & IIS) Mozilla SpiderMonkey JavaScript engine (Netscape Navigator 3.0) Submission of JavaScript to ECMA International Opera Browser NetBeans IDE! 7
  • 8. The rst 20 years 1997 Dynamic HTML (IE 4) ES1 (ECMA-262 standard) 8
  • 9. The rst 20 years 1998 Netscape releases the source of Navigator Mozilla Foundation Gecko HTML engine Rhino JavaScript engine (Java) ES2 (ISO/IEC 16262 standard) 9
  • 10. The rst 20 years 1999 AJAX, XMLHTTPRequest (IE 5) Macromedia Flash ES3 Regular expressions Exceptions, try/catch blocks do...while , in , instanceof Enhancements in arrays, strings, numbers 10
  • 11. The rst 20 years 2000 ES4 (Never released, abandoned) Adobe ActionScript, ES4 derivative (classes, static typing, etc) 11
  • 12. The rst 20 years 2001 Douglas Crockford The World's Most Misunderstood Programming Language JSON 12
  • 13. The rst 20 years 2002 Mozilla Suite 1.0 Firefox Outlook Web App (AJAX goes mainstream) JSON.org 13
  • 14. The rst 20 years 2003 Safari Web Browser WebKit & Nitro engines (forks of KDE HTML/JS engines) 14
  • 15. The rst 20 years 2004 Google Mail (AJAX for the masses) Dojo toolkit 15
  • 16. The rst 20 years 2005 Jesse James Garrett, Ajax: A New Approach to Web Applications prototype.js, the dollar function $() 16
  • 17. The rst 20 years 2006 jQuery Yahoo! User Interface library 17
  • 18. The rst 20 years 2007 PC World, Netspace Navigator: the best tech product of all time 18
  • 19. The rst 20 years 2008 Google Chrome V8 JavaScript engine Chromium Project 19
  • 20. The rst 20 years 2009 ES5 (ES3.1 essentially) node.js (server-side JS) CommonJS (JS modules) AngularJS PhoneGap, hybrid JS apps (now Apache Cordova) 20
  • 21. The rst 20 years 2009 CoffeeScript, the rst language to transpile to JS underscore.js, functional programming in JS (superseded by lodash.js) 21
  • 22. The rst 20 years 2010 Backbone.js, MVC library Express.js, Web framework for node.js Knockout.js, MVVM library PhantomJS, Headless Webkit 22
  • 23. The rst 20 years 2011 Data-driven documents with D3.js Asynchronous Module De nitions (AMD) with require.js Ember.js, MVC library 23
  • 24. The rst 20 years 2012 Oracle releases Nashorn JavaScript engine (Java), the default JavaScript engine in Java 8 Meteor.js, web framework (node.js, hybrid, reactive) TypeScript by Microsoft (transpiled to JS) 24
  • 25. The rst 20 years 2013 React framework by Facebook asm.js by Mozilla ElectronJS by Github (atom-shell) 25
  • 26. The rst 20 years 2014 HTML5 - APIs everywhere The (unof cial) death of XML? 26
  • 27. The rst 20 years 2015 ES6 (Harmony, ES2015) React Native (hybrid apps) WebAssembly (assembly for the web) 27
  • 28. JavaScript is here to stay! JavaScript is the lingua franca of the Web rapidly turning into a general-purpose programming language with a massive usage base ES2016 (minor additions to ES6) ESNext (next features, like async/await) 28
  • 29. Apache NetBeans is here to stay, too! 29
  • 30. JavaScript Support in NetBeans 8.2 Built-in support for JS and a multitude of tools, libraries and frameworks Support for ES6 and beyond 30
  • 31. Built-in JS Support Syntax highlighting Code folding Code completion and analysis Refactoring Structural navigation Lints/Hints Integrated debugger 31
  • 32. And more Bracket matching Go to declaration JSDoc JSON JS embedding (HTML, PHP, etc) 32
  • 33. Developing JS with Netbeans Embedded web server (run your apps from within the IDE) Automagical update in the web browser (Embedded Webkit or Chrome with plugin) 33
  • 34. Tools and Libraries Inherent support for JS libs/tools at the source level Node.js and npm Grunt, Gulp, Bower, Require.js, Karma, Express.js, Babel, Webpack, ... LESS, SASS Apache Cordova Oracle JET NB Plugins 34
  • 35. ES6 Features Modules with import and export Constants with const Block scoped variables with let Arrow functions with => Classes with class and extends and super String interporation with `${var}` 35
  • 36. ES6 Features Default parameter values, rest & spread operators Desctructuring of objects and arrays Promises Enhanced object literals New collections (Set, Map, WeakSet, WeakMap) 36
  • 37. Not covered here Generators & iterators Various other goodies, such as Symbols Metaprogramming (Proxies & Re ection) Math, String, Number enhancements Binary and octal literals and more... 37
  • 39. References A brief history of JavaScript A re-introduction to JavaScript ECMAScript 6 New Features: Overview & Comparison NB Wiki ECMAScript 6, Modules, Babel, Webpack, and NetBeans IDE 39