Synopsis
The project shows how to integrate React components into GWT application. GWT backend consists of Login service which allows users to create login sessions.
Adding React component
EmbeddedReact.ReactComponentProps componentProps = new EmbeddedReact.ReactComponentProps(); componentProps.onGoToGWTAppClicked = new MouseEventHandler() { @Override public void onMouseEvent(MouseEvent event) { setReactComponentVisibility(false); String sessionID = Cookies.getCookie("sid"); if (sessionID == null) setLoginFormVisibility(true); else checkWithServerIfSessionIdIsStillLegal(sessionID, false);
}
}; componentProps.currentLoggedUser = result.getUserName(); ReactDOM.render(React.createElement(EmbeddedReact::loggedInComponent, componentProps), Document.get().getElementById("reactAppDiv"));
Build and run solution
In Eclipse go to Build Path -> Configure Build Path, select Java Build Path on the right and Libraries in top panel. Select Add JARS and add
- gwt-interop-utils-0.4.0.jar
- gwt-react-0.6.0.jar
- gwt-servlet.jar
Libraries located in /GWTReactApp/war/WEB-INF/lib/ folder.
Right click on project folder and select Run As -> Web Application (GWT Super Dev Mode)
Adding addition React modules
- Step 6 explained in details in in gwt-react library documentation file given at https://github.com/GWTReact/gwt-react/blob/master/DOCUMENTATION.md
- Add updated .js file to the project (add it as static <script> tag to projects html, or inject it on run time)