Introduction

React4j is an opinionated abstraction on top of ReactJS that allows you to use Java to build a web application using the React component model. The React component model defines components that are passed props by their container, manage their own state and can be composed to make complex UIs.

React4j uses J2CL to compile the Java code to Javascript.

The "Hello World" of React4j that just returns a header is as simple as:

ReactDOM.render(h1("Hello World"), WindowGlobal.document().getElementById("app"));

The Java entry point is exported with @JsMethod and invoked by a Closure entry module. Bazel builds the Java sources, annotation processor output and J2CL bundle together. See Project Setup for the build and nullness requirements.

Components compose through Renderable: either a native ReactNode or a ready Buildable. See composing ready builders to nest components without explicit build() calls.

package react4j.examples.hello_world;

import static react4j.dom.DOM.*;

import jsinterop.annotations.JsMethod;
import react4j.dom.ReactDOM;

public final class HelloWorld {
    private HelloWorld() {}

    @JsMethod
    public static void bootstrap() {
        ReactDOM.render(h1("Hello World"), WindowGlobal.document().getElementById("app"));
    }
}