eclipse loves-java script

Eclipse loves JavaScript,using and contributing to

JSDT 2.0Patrik Suzzi, Theater - Wednesday, October 26, 17:45

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?

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

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 )

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

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

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

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

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

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

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

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

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