Tweet
Tweet

Slide 1

Slide 1 text

No content

Slide 2

Slide 2 text

CONFIDENTIAL • © 2016 Sencha Inc. GWT Eclipse Plugin Brandon Donnelson @branflake2267 November 2016

Slide 3

Slide 3 text

CONFIDENTIAL • © 2016 Sencha Inc. 3 About Me • Sencha GXT Support Engineer • I’ve been working with GWT a long time • I enjoy working with structured GWT Apps • Passion for making development easier .

Slide 4

Slide 4 text

CONFIDENTIAL • © 2016 Sencha Inc. 4

Slide 5

Slide 5 text

CONFIDENTIAL • © 2016 Sencha Inc. 5

Slide 6

Slide 6 text

CONFIDENTIAL • © 2016 Sencha Inc. Thank you! Thanks to Sencha, Google Cloud Tools team and others for making this happen! 6

Slide 7

Slide 7 text

CONFIDENTIAL • © 2016 Sencha Inc. 7 What’s the Purpose • The GWT Eclipse Plugin features provide engineering conveniences you don’t get from the available text editors out there • I suspect you’ll find the features will make development easier • Consistent building, tooling and debugging Experience

Slide 8

Slide 8 text

CONFIDENTIAL • © 2016 Sencha Inc. 8 Brief History of the GWT Eclipse Tooling • Google Plugin for Eclipse (GPE) - 1.0 April, 2009 - 3.9 March, 2016 - 7 years later • Google Plugin for Eclipse Fork (GPE-Fork V2) - Forked April 2015 after a long dry spell in development • GPE deprecation End of 2016 • GWT Eclipse Plugin (V3) - Started development July 2016

Slide 9

Slide 9 text

CONFIDENTIAL • © 2016 Sencha Inc. 9 GWT Eclipse Tooling Evolution GPE (GWT & Cloud) Cloud Tools for Eclipse (Only Cloud) GPE Fork (V2) (GWT & Cloud) GWT Eclipse Plugin (V3) (Only GWT)

Slide 10

Slide 10 text

CONFIDENTIAL • © 2016 Sencha Inc. 10 GWT Eclipse Plugin Features • GWT features have not been removed between the GPE to GWT Eclipse Plugin morph • GWT SDK Selection • GWT Compiler Launcher • GWT Development Mode with Jetty Launcher (a.k.a DevMode Super Dev Mode) • GWT Development Mode Launcher (a.k.a CodeServer Super Dev Mode) • GWT Legacy Development Mode Launcher (a.k.a Classic Dev Mode or OOPHM Dev Mode) • GWT Java Editor • GWT UIBinder Editor • OOPHM for Legacy Dev Mode • CSS Resources Editor • New Documentation with Videos • Maven integration

Slide 11

Slide 11 text

CONFIDENTIAL • © 2016 Sencha Inc. 11 New Features • Icons changed to GWT logos • GWT Development Mode (CodeServer) launcher • GSS files will load the CSS Resources Editor - Partial support because it doesn’t support the GSS semantics yet • GWT Facet for Server runtime integration • TBroyer Maven Plugin project configuration support • Bug fixes • Build integration testing • GWT 2.7 & GWT 2.8 SDK • GWT Compiler launcher

Slide 12

Slide 12 text

CONFIDENTIAL • © 2016 Sencha Inc. 12 Extensions • From: com.google To com.gwtplugins • com.gwtplugins.gwt.eclipse.core.gwtNature • com.gwtplugins.gwt.facet Extension classes are the same. They didn’t get renamed.

Slide 13

Slide 13 text

CONFIDENTIAL • © 2016 Sencha Inc. 13 Wish List • Clean up GWT Site Eclipse Docs • Full GSS Support • Gradle Configurators Support • GWT Designer (Elemental) • … Find the list of wishes: https://github.com/gwt-plugins/gwt-eclipse-plugin/projects/2

Slide 14

Slide 14 text

CONFIDENTIAL • © 2016 Sencha Inc. See it to believe it 14

Slide 15

Slide 15 text

CONFIDENTIAL • © 2016 Sencha Inc. 15 Eclipse Marketplace Install

Slide 16

Slide 16 text

CONFIDENTIAL • © 2016 Sencha Inc. 16 Install Features

Slide 17

Slide 17 text

CONFIDENTIAL • © 2016 Sencha Inc. 17 Documentation

Slide 18

Slide 18 text

CONFIDENTIAL • © 2016 Sencha Inc. 18 Documentation - Videos Published a GWT Eclipse Plugin V3 playlist Lots of Videos https://goo.gl/pbjhdH

Slide 19

Slide 19 text

CONFIDENTIAL • © 2016 Sencha Inc. 19 GSS • CSS Highlighting • CSS Content Assist • CSS Color Chooser

Slide 20

Slide 20 text

CONFIDENTIAL • © 2016 Sencha Inc. 20 Maven Integration • Both GWT Maven plugins are supported • TBroyer GWT Maven Plugin (recommended) • Mojo GWT Maven Plugin • Gradle support coming

Slide 21

Slide 21 text

CONFIDENTIAL • © 2016 Sencha Inc. 21 The Development Mode Launchers They come in two flavors: • GWT Development Mode (DevMode) • GWT Development Mode (CodeServer) What’s the difference???

Slide 22

Slide 22 text

CONFIDENTIAL • © 2016 Sencha Inc. 22 Legacy GWT Development Mode with Jetty Legacy GWT Development Mode is only supported in the older browsers. - Internet Explorer IE8 to IE11 - Firefox 26 Not supported In - Chrome - Safari - Edge (a.k.a Classic Dev Mode)

Slide 23

Slide 23 text

CONFIDENTIAL • © 2016 Sencha Inc. 23 GWT Development Mode with Jetty • (a.k.a Super Dev Mode) • Dev Mode runs both a Jetty server and Code Server.

Slide 24

Slide 24 text

CONFIDENTIAL • © 2016 Sencha Inc. 24 GWT Development Mode with Anything • Any Web Server • Any Device • Anywhere Anytime

Slide 25

Slide 25 text

CONFIDENTIAL • © 2016 Sencha Inc. 25 GWT Development Mode Launching • This will only run the Code Server • It only takes two arguments to run. -launcherDir and module name. • This will work with any browser • Copy the source war contents to the web app directory • Use –launcherDir to point to war output directory (exploded war dir) • (a.k.a Super Dev Mode)

Slide 26

Slide 26 text

CONFIDENTIAL • © 2016 Sencha Inc. 26 Launching Example • (a.k.a Super Dev Mode) • Dev Mode runs both a Jetty server and Code Server.

Slide 27

Slide 27 text

CONFIDENTIAL • © 2016 Sencha Inc. 27

Slide 28

Slide 28 text

CONFIDENTIAL • © 2016 Sencha Inc. 28 Running an External Web Server If the external web server has a different IP. • VM, docker, Kubernetes, some other server accessible on the network Issue • CodeServer has a hostname issue when not on the same ip • SolutionProxy, Tunnel back, Servlet • Change, Hack or PatchCode Server with -launcherDir on same ip • GWT Compiler - Super Flexible

Slide 29

Slide 29 text

CONFIDENTIAL • © 2016 Sencha Inc. 29 SSL • Debugging on an SSL server • Mixed Content Warning Possible Solutions • Turn of Security • Proxy, Tunnel, Code Server requests Ideally • Use the GWT Compiler launcher

Slide 30

Slide 30 text

CONFIDENTIAL • © 2016 Sencha Inc. 30 GWT Compiler Debugging • Compiler -incremental -setProperty user.agent=safari -war /path/to/war • Incremental • For Safari • Compilation is put into the hosted webapp directory

Slide 31

Slide 31 text

CONFIDENTIAL • © 2016 Sencha Inc. 31 GWT Compiler

Slide 32

Slide 32 text

CONFIDENTIAL • © 2016 Sencha Inc. 32

Slide 33

Slide 33 text

CONFIDENTIAL • © 2016 Sencha Inc. 33 IDE and Chrome Browser Integration • SDBG JavaScript Debugger makes JavaScript Debugging possible • Console output in IDE or Chrome • Breakpoints in IDE or Chrome • Variable inspection in IDE or Chrome • Stack inspection in IDE or chrome

Slide 34

Slide 34 text

CONFIDENTIAL • © 2016 Sencha Inc. 34 Breakpoints, Console, Variables and Stacks

Slide 35

Slide 35 text

CONFIDENTIAL • © 2016 Sencha Inc. 35

Slide 36

Slide 36 text

CONFIDENTIAL • © 2016 Sencha Inc. 36 Become Stargazers - Show your support I’d like to show management why investment is important! • Become a stargazer on github. • https://github.com/gwt-plugins/gwt-eclipse-plugin • Become a stargazer on the Eclipse Marketplace • https://marketplace.eclipse.org/content/gwt-eclipse-plugin

Slide 37

Slide 37 text

CONFIDENTIAL • © 2016 Sencha Inc. 37 Community Project • Come join the fun and help submit patches • Build project test cases I can use to test debugging • Submit issues • Submit feedback • Submit suggestions • Or just Comment and +1 threads

Slide 38

Slide 38 text

CONFIDENTIAL • © 2016 Sencha Inc. 38 Questions • Questions • Feedback • Suggestions • +Brandon.Donnelson • @branflake2267