GWT as a pure Java to JavaScript transpiler

Learn how to use GWT for leveraging the benefits of both worlds: Java and JavaScript.

Created byZakaria A.

Last updated 4/2018

English

English [Auto],

What you'll learn

Learn about the basics of GWT compiler
Learn how to use JsInterop for transpiling Java to JavaScript
Learn about the browser API and how to use Elemental to interact with the Dom
Learn how to wrap any JavaScript library to make it work with your Java code
Learn how to debug GWT applications in Devmode using Chrome dev tools

Course content

4 sections • 16 lectures • 3h 58m total length

Course objectives2:16
Explore course objectives for GWT, emphasizing interop, DOM interaction, and building user interfaces, compiler mechanics, future upgrades, breaking changes, and applicability to Java backend enterprise apps.
is GWT dead ?16:27
Explore whether GWT is dead and how the Java-to-JavaScript compiler, the GUI framework, and enterprise use cases influence its future.
Overview of GWT compiler - precompiling19:06
interesting presentation from Ray Cromwell: https://www.youtube.com/watch?v=n-P4RWbXAT8
Overview of GWT compiler - optimizations5:17
Explore how the GWT compiler applies optimizations after generating the Java abstract syntax tree, showing source code paths and examples such as dead code and the elimination method.
Overview of GWT compiler - compiling and linking8:21
The GWT compiler converts Java to JavaScript through compile and link phases, optimizes the code, and outputs a no-cache strapper script plus a permutation file for runtime loading.

GWT maven plugins29:01
Explore two maven plugins for GWT development, including a legacy plugin and the net.ltgt plugin. Learn how archetypes bootstrap projects, manage multi-module builds, and streamline configuration with IDE support.
Using Chrome dev tools to debug GWT applications8:15
Debug GWT applications in the browser using Chrome DevTools, simulate errors, and inspect stack traces with breakpoints, then map Java to JavaScript via source maps and workspaces.
Running GWT dev mode on any web server19:47
Discover how GWT dev mode uses a code server and a web server, with ports 9876 and 8888, and how to run it on any server like Nginx or Apache.

JsInterop Annotations12:26
Explore jsinterop annotations in gwt to replace jsni, learning how to export types with jsType, expose constructors, properties, methods, and overlays, and wrap native javascript objects.
Exporting Java types to use from JavaScript19:12
Learn to export Java types to JavaScript via just type notation, create an inventory item, and control exposure with namespace and public properties.
Wrapping JavaScript types for use in Java11:39
Learn to import and wrap JavaScript native types for use in Java with GWT, storing and managing items in local storage via set item, get item, and remove item.
Using @JsFunction19:16
Use the @JsFunction annotation to create JavaScript-like callbacks from Java, enabling flexible stock evaluation with a functional interface and multiple implementations. See inventory wrapping, evaluation, and console outputs in action.
Adding new functionality to native types6:19
Learn how overlay adds new methods to native types in GWT, enabling Java-side utilities like a static isPresent helper for local storage, without exposing them to JavaScript.
Example: wrapping a JavaScript library (Chart.js)23:24
wrap a JavaScript library in GWT to transpile Java to JavaScript, using Chart.js to render a bar chart on canvas with wrapper objects.

Elemental 2 and the browser API13:40
Elemental 2 wraps the browser API to replace legacy widgets, offering a generated, up-to-date dom API for fast, flexible web UI with elements.
Example: building a simple front end router using Elemental23:51
Create a simple front-end router with elemental to navigate a single-page app using hash-based links, showing and hiding sections to reflect the active route.

Requirements

good knowledge of Java
basics of JavaScript and browsers APIs
any IDE

Description

This course provides an overview of the latest GWT (2.8.x) version features such as JsInterop and also Elemental 2. It takes a different look at GWT in the way that it promotes its usage as a helper tool that converts Java to JavaScript rather than a full fledged web framework. The course is aimed at you, whether you are new or have already worked with GWT, and has as main objective to simplify GWT development, and to make your GWT applications maintainable and future proof. The course presents both theory and practice material, and comes with fun quizzes to help you learn better.

About myself: I am Full stack developer with over 8 years of experience working on various projects including GWT projects. I have also contributed to GWT documentation. I enjoy working with Java and open source stuff. I blog often about Java and GWT and I am Interested in the transpiling of all JVM languages to JavaScript.

Who this course is for:

Java backend developers willing to set foot in the front end
Java developers of who are compelled to work in the front end and need an alternative
curious Java developers
Java developers who think JavaScript sucks

GWT as a pure Java to JavaScript transpiler

What you'll learn

Explore related topics

Course content

Introduction to GWT compiler5 lectures • 51min

General setup and tips3 lectures • 57min

Overview of JsInterop6 lectures • 1hr 32min

Working with Elemental 22 lectures • 38min

Requirements

Description

Who this course is for: