This starter provides the building blocks for integrating React in Enonic XP on client- and serverside.
This covers build steps and runtime: a Gradle/NPM build setup with a library and a few companion NPM packages. Compiles and serves standard JSX-format React components from XP.
A simple example XP part with React rendering and a barebone page controller is included.
See the react4xp introduction for a tutorial and more comprehensive documentation or check out the developer portal to learn more about the enonic ecosystem.
Requires: installed Enonic XP 7.15.1 with Gradle and Node/NPM.
- The three usual options:
- install the starter from Enonic Market,
- or clone it down from the github repo,
- or use the Enonic CLI:
enonic project create -r starter-react4xp - Build it locally:
enonic project deploy
NOTE: if you use a version of the starter with version 1.1.2 or lower, you will need to run npm install before "enonic project deploy" or other gradle/enonic CLI commands.
For complete setup info, see the react4xp introduction.
Crash course, after getting this starter running:
- Start XP
- Enter Content Studio
- Add a Site. Give it a display name and activate this starter app.
- Follow this tutorial and select the "Default Page" page controller (and apply/save).
This is version 6.0.0.
| Version / tag | Minimum XP version | Notes |
|---|---|---|
| 6.0.0 | 7.15.1 | Updates to [email protected], npm-@enonic/[email protected], switches to rspack with css modules, and implements component registry and datafetcher. |
| 2.0.0 | 7.6.0 | Updates to [email protected] and [email protected], for using webpack 5 and webpack-cli 4. |
| 1.7.1 | 7.6.0 | Bugfixes |
| 1.5.0 | 7.6.0 | Version leap: sync with versions of lib-react4xp (1.5.0) and npm-react4xp (1.5.4), which bring SSR-engine improvements to error reporting and concurrent multi-thread rendering. |
| 1.2.1 | 7.6.0 | Update XP version, remove unused libraries |
| 1.2.0 | 7.5.0 | Easier build: no longer needs "npm install" before gradle tasks or "enopnic project deploy". |
| 1.1.0 | 7.3.0 | Easy-to-set-up guillotine: adds a ready-to-map guillotine API for backend and frontend queries, and a frontend request wrapper. NPM package [email protected] replaces a lot of build setup in this parent project's build.gradle with one line (apply from:...), and bugfixes style handling in client-side `.renderWithDependencies. |
| 1.0.1 | 7.3.0 | First full release, compatible with updated guide. |
| 0.6.3 | 7.0.0 | Lazy-loading assets on server-side rendering. Collected all the react4xp NPM packages into one. Support: CSS modules with asset handling. |
| 0.6.1 | 7.0.0 | Fixed Page/Layout support. Free structure of entry and chunk directories. Babel upgrade. |
| 0.2.10 | 7.0.0 | Fixes windows build issue #18. |
| 0.2.8 | 7.0.0 | Beta release for XP7 |
This table (and the master branch) covers XP7.15.1-compatible code.
React4xp is a work in progress and frequently updated.
For now there are some known issues we are looking into. Feedback, suggestions, uncovered use cases, problems or stories of ensuing hilarity are very welcome here - it will hugely help us improve the React support in XP!
-
You may also have noticed that it took a little time for the first server-side rendering to be displayed. That’s the server-side rendering engine warming up. It reads and caches the basics (notably, some necessary polyfilling, react and react-dom) for performance.
-
This delay only happens when your app is restarted, i.e. you restart XP entirely, or redeploy the app.