Simple, because of my standard tooling and the compile time checking.
The complete example in this article can be found at https://github.
com/lofidewanto/jsinterop-simple-exampleLet’s imagine you have a nice Java calculator which you want to reuse in your JavaScript app.
This Calculator.
java implements a calculateSum method like below:.
public double calculateSum(Double[] values) { List<Double> doubles = Arrays.
asList(values); if (values != null) { logger.
info("Values size: " + doubles.
size()); Double sum = doubles.
stream().
mapToDouble( Double::doubleValue).
sum(); return sum; } else { logger.
info("Values: null"); return 0.
0; }}.
To reuse your Calculator class, you need to use JsInterop in GWT or J2CL.
JsInterop is a framework for JavaScript Interoperability within Java.
Both GWT and J2CL use this framework to access JavaScript or to be accessed by JavaScript.
You can find some good information about JsInterop in following sites:http://bit.
ly/JsInteropDochttp://bit.
ly/JsInteropGwthttp://bit.
ly/JsInteropExampleIn our simple case we need to export our Java Calculator into a JavaScript file.
For this purpose you just need to mark the Calculator class with a @JsType annotation which should be available globally with “Calculator” as a name:.
@JsType(namespace = JsPackage.
GLOBAL)public class Calculator { public double calculateSum(Double[] values) { .
}}.
GWT translates the Java class into a JavaScript file named as calculator.
nocache.
js and afterwards you can use this JavaScript in your index.
html like this:<!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>Now you can use your Calculator Java class in the web browser.
You can implement and test the Calculator class just as usual using JUnit and Mockito as needed.
You can use your Java IDE like Eclipse, IntelliJ or VSCode for Java to write the CalculatorTest.
java:Programming with Java and GWT in VSCode for JavaTo see the result you just need a web browser, the result will be printed out in the console after you push the button Calculate!:Running GWT Webapp in ChromeIf you need to debug your Java Calculator you can directly do this in Chrome, completely in Java:Debugging your Java Calculator in ChromeThat’s it!In this article I’ve shown you how easy to reuse your Java code in your JavaScript world.
You can just test your Java code as usual with Java tooling and integrate it smoothly in your JavaScript web apps.
JsInterop makes this easily possible.
So as Java developers you don’t have to give up your Java tooling and frameworks, also you can still depend on the compile time checking from Java.
The complete example in this article can be found at https://github.
com/lofidewanto/jsinterop-simple-exampleIf you interested in more information about GWT and J2CL you could read this longer article about Modern GWT, First Step (http://bit.
ly/ModernGwt)If you have any questions just go to GWT /J2CL Gitter Chat (https://gitter.
im/gwtproject/gwt).
The community is very active and they’ll answer all your question in context of GWT and J2CL.
Enjoy playing with GWT and J2CL!.