From 921396fa140077c63fd7d7b8aa30fee484156b51 Mon Sep 17 00:00:00 2001 From: Thomas Sigdestad Date: Thu, 4 Jan 2024 14:29:36 +0100 Subject: [PATCH] broken links + tuning --- docs/index.adoc | 36 +++++++++--------------------------- 1 file changed, 9 insertions(+), 27 deletions(-) diff --git a/docs/index.adoc b/docs/index.adoc index 2224ed9e..0395cb95 100644 --- a/docs/index.adoc +++ b/docs/index.adoc @@ -2,7 +2,7 @@ :toc: right :imagesdir: media/ -This tutorial will show you step-by-step how to build XP sites and apps with React rendering, helping you kickstart a React4xp project of your own. +Introduction to server side React rendering with the Enonic framework. {zwsp} + @@ -11,40 +11,30 @@ image:react4xp.svg[title="React4xp logo",width=256px] {zwsp} + -== Upgrade - -If you are upgrading to lib-react4xp 5.x.x, please read this <>. - == Introduction [NOTE] ==== -A little bare-bone knowledge of link:https://reactjs.org/tutorial/tutorial.html[React] and link:https://developer.enonic.com/start[Enonic XP] is recommended. +A little bare-bone knowledge of link:https://reactjs.org/tutorial/tutorial.html[React] and link:https://developer.enonic.com/start[Enonic XP] is recommended before you dive into this tutorial. ==== - -React4XP is a library (with a companion build structure) that facilitates advanced use of React in Enonic XP, and: +React4XP facilitates advanced use of React when rendering with Enonic XP * enables you to use TSX/JSX as a templating language, similar to other XP templating engines * supports isomorphic client- or serverside rendering and hydration, * handles build flow and compilation with automated optimized asset serving * is modular and flexible enough to cover many advanced use cases - -{zwsp} + - + == Tutorial overview -After <>, we'll begin with *3 basic lessons* - just the minimum of what you need to get started: +After <>, you start with *three basic lessons*: - <>: Meet the React4xp library and display a react component from content studio - first serverside rendered, then clientside. - <>: Use props to pass data - for example editorial data from XP - into the react component. - <>: Taking more advantage of the page-building powers in Content Studio - react rendering from any XP controller. - -{zwsp} + - -The next 5 lessons present a few more *advanced usages*: +The following five lessons present a more *advanced use cases*: - <>: Which react components are available to React4xp (called _entries_), and how to reference them. - <>: A more detailed and explicit syntax, for when your controller needs more control. @@ -52,21 +42,13 @@ The next 5 lessons present a few more *advanced usages*: - <>: Introduction of how to use React4xp in a headless-CMS context: set up a data endpoint that serves XP content as pure data, and have the already-rendered React4xp components add more content asynchronously with that content data. - <>: "pure headless" with preview - standalone webapps that take the same React4xp components out of Content Studio, and render the content with assets and data served from anywhere. -{zwsp} + - -== Details -If you *need to go deeper* after going through the lessons, the most important concepts you'll encounter along the way are explained on pages of their own: +== Dive deeper +Have an urge for details beyond the basic tutorial, check out the following: - <> - <> - <> - -There's also an <> for the methods that the react4xp library (link:https://market.enonic.com/vendors/enonic/react4xp-lib[_lib-react4xp_]) exposes to the XP controllers: - -- <> -- <> - -{zwsp} + +- <> for the (link:https://market.enonic.com/vendors/enonic/react4xp-lib[React4XP library]). == Issues? Questions, bug reports or suggestions are welcome!