Webbrowser-Programmierung in Java
Seite 3: Integration des Taschenrechners in JavaScript
GWT übersetzt mit dem Maven-Plugin die Taschenrechner-Klasse in eine JavaScript-Datei mit dem Namen calculator.nocache.js. Anschließend können Entwickler sie in der HTML-Datei index.html folgendermaßen verwenden:
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;
charset=UTF-8"><title>Demo GWT Webapp</title>
<!-- This is the transpiled Java files included the
Calculator class into JavaScript -->
<script type="text/javascript" language="javascript"
src="calculator.nocache.js"></script>
</head>
<body>
<!-- Here you use the Calculator class as usual
in JavaScript -->
<button onclick="console.log(new Calculator().calculateSum(
[10, 20, 30]));">Calculate!</button>
</body>
</html>
Starten von GWT-Transpiler als Jetty-Prozess
Damit Java-Entwickler Änderungen des Java-Codes just-in-time übersetzen können, muss sie den GWT-Transpiler innerhalb eines Jetty-Prozesses starten. Das geht mit folgendem Maven-Aufruf:
mvn gwt:generate-module gwt:devmode
Um das Ergebnis anschließend zu sehen, müssen Nutzer lediglich in einem Webbrowser diese Adresse eingeben: http://127.0.0.1:8888/calculator/.
Das Ergebnis stellt die Konsole dar, nachdem Anwender den Knopf "Calculate!" drücken (Abbildung 4). Dann kann man den Java-Code stetig verändern. Ein Browser-Reload übersetzt den Code automatisiert in JavaScript und macht ihn sofort verfügbar.
Das Debuggen des Java-Rechners können Entwickler direkt in Chrome und vollständig in Java durchführen (Abbildung 5).
