Docs Developer Site
Developer Learn React4XP Tutorial 7.x

React4XP tutorial

Contents

Build, deploy and run server-side rendered React websites with Enonic.

What is React4XP

Basic React and Enonic knowledge is recommended before you dive into this tutorial.

React4XP is designed for React devs looking to use Enonic’s JS framework natively, rather than introducing a 3rd party front-end framework like Next.js in the stack.

  • 100% TSX/JSX rendering - Single React app

  • Based on the Enonic React component NPM

  • Works with CMS Schemas across multiple namespaces/apps

  • Isomorphic server side and client side rendering through hydration

  • Supports Enonic page templates and components

  • Fast and continuous builds

  • Production builds and static asset handling

Tutorial

tl;dr Try the React4XP demo instead.

r4xp demo

In this tutorial you will complete the following steps:

  • Set up the Enonic SDK and sample content

  • Create a new application based on the React4xp starter

  • Render content based on type

  • Render pages using different components

  • Use page templates

Get started by setting up the developer environment.

Dive deeper

Beyond the tutorial, the React4XP reference documentation covers the library API, SSR and hydration, build and configuration in depth.

Get in touch!

Questions, bug reports or suggestions are welcome!

Contents

Contents