Eclipse Loves JavaScript slides for the Eclipse Con Europe 2016 Conf. see: https://www.eclipsecon.org/europe2016/session/eclipse-loves-javascript-using-and-contributing-jsdt-20

1. Eclipse loves JavaScript,
using and contributing to JSDT 2.0
Patrik Suzzi, Theater - Wednesday, October 26, 17:45

2. About this talk
• Patrik Suzzi,
• Software Engineer, Consultant
• Eclipse Platform UI Committer
• Eclipse JSDT Contributor
• Agenda
• Modern JavaScript and JSDT
• JSDT 2.0 usage examples
• Contribute
• Audience
• How many are using JS ?
• Frontend? backend? Fullstack?

3. JavaScript is evolving
• Initially, it was just for client-side scripting
• Web page manipulation, validation, computation
• Modern JavaScript is more..
• Programming language of the web.
• Mobile, desktop and containers.
• Client, server and middleware.
• i.e. web and mobile UIs; browser apps; streaming,
IoT and large-scale applications; REST APIs;
database; etc.
One of the most commonly used languages

4. JavaScript Development Tools (JSDT)
• JSDT 1.0
• Support ES 3 (ECMAScript 1999)
• JavaScript:
• Increasing importance also in back-end
• JSDT 2.0
• Support ES6 (ECMAScript 2015)
• Nodejs & tools, Chromium (debug).
• .. Fullstack development
(limited resources, slow development)
(new investments, total reboot )

5. JSDT 2.0 - Neon
• (ES6) Esprima parser running on Nashorn
• Run and debug Node.js applications
• JSON editor
• Package managers integration: Bower / npm
• Task Runners integration: Gulp, Grunt
• New Package: JavaScript IDE

6. JSDT 2.0 - Neon.1
• Main enhancements
• Oomph installer to simplify contribute to JSDT
• Node.js debugger improvements
• New JavaScript debugger improvements:
• Quick Access for Gulp/Grunt tasks
• Npm scripts support

7. Demos
• Get JSDT for JavaScript project
• Verify you have Node and tools
• Try the demos
• Simple Angular JS frontend
• Simple Node JS fullstack app
• JS Frontend with Java Backend
• Code here
• https://github.com/psuzzi/jsdt-demo-neon

8. Demo 01: simple frontend
• Angular single page App with
• With routing & templating
• Bootstrap and Fontawesome dependencies
• installed via bower
• Content assist
• Scope variables
• ES2015 specifics *class declar
• JSON Editor with content assist (file assist)
• Npm install, bower install
• Download of all dependencies.
• launch

9. Demo 02: FullStack Angular/Node
• Frontend: Angular/Bootstrap
• Bower
• Backend: Node.js / Express / MongoDB
• Npm install
• Gulp launch
• Debug Node backend
• Breakpoint
• Hotswap: change a value on the fly

10. Demo 03: Debug JS on Java backend
• JS frontend (Angular)
• Java backend (SpringBoot)
• Debug JS and Java
• Cool thing: Check JHipster app generator, i.e. Angular+ SpingBoot

11. Demo 04: Contribute to JSDT
• Install Oomph
• Build the IDE to develop on JSDT
• Find a bug
• Fix it
• Push the code

12. JSDT 2.0 - Beyond
• Closure Compiler:
• From Google, written in java, supports ES6
• better parsing, active community, Eclipse IP approved.
• Language Services:
• VSCode Server Language Protocol
• RedHat, Microsoft, Codenvy, IBM, Typefox, ...
• Typescript 2 not supported (CQ..)
• Aim using TypeScript 2 Language Servces
• Typescript support
• Aim to support TS 2
• Nice to have, post oxygen.
•  we need more committers

13. Thanks
• Ilya, Gorkem, Victor, Angel, Denis, Mickael (RedHat)
• Chuck, Orlando, Adalberto, Alina, Nitin (IBM)
• Angelo (Independent)
• Esteban (Obeo)
• Pavel (Google)