Component confusion

[ComLock]

The word component is used in so many combinations I quickly get lost in what it's supposed to mean.

doc-starter-react4xp/build/docs/html5/index.html

This is the main folder for entry components - react components that can be used directly by React4xp, that is, they don’t need to be nested inside other react components.

So there are react components that cannot be directly used by React4xp?

What actually is React4xp? Is it an app engine? A tool. Does it use entry components runtime? I feel like term "Enonic XP" should be lifted up and the term "React4XP" should be more in the background, because what is it? It just confuses me.

https://github.com/enonic/lib-react4xp/blob/master/README.md#entries-and-dependency-chunks

React4xp components can import other components or JS code

What is an React4XP component?

What is the non react4xp component that is mentioned? I'm guessing it's an react component and not an Enonic XP component (page/layout/part).

[ComLock]

And having to leave the main documentation, to read some doc from lib-react4xp, in order to understand what the main documentation is talking about makes the main documentation feel incomplete. (and me feeling like I'm down a rabbit hole and need to read a ton of docs in order to make sense of this, reading a lot is boring, so either I just try it out without reading or give up alltogether)

[espen42]

I totally agree, but I haven't found very good alternatives yet.

It's of course because the word "component" is already well established in two contexts, meaning two different things:

Especially in react: https://reactjs.org/docs/components-and-props.html But also in XP: https://xp.readthedocs.io/en/stable/admin/contentstudio/components.html

It's probably not strictly correct to say "XP component" everywhere (not all XP components can contain a react component, only parts (and probably layouts, I still need a closer look at that), and pages which are not really XP components). But just saying "XP components" seemed to be a clear enough compromise. At least it's even worse to write "part or page and maybe layout" every time...

There's no way around the React component term, and I think we need a common word for the XP stuff that can contain a React4xp thing. Maybe "XP container" or "React4xp container"?

And yes, there are react components that can't be used directly in React4xp - only the entries can. Other react components have to be imported and nested into the entries in the standard react way, from the dependency chunks.

So what is a React4xp component? An entry. Probably should say that everywhere.

What is React4xp? Not completely sure what the correct term would be, I said "tool" somewhere, but framework within XP is probably closest? It abstracts a... not small amount of complexity/setup/boilerplate, trying to make standard ways of using react inside XP painless. Painless if you don't look at the torture of explaining/understanding what's actually going on behind the scenes. But possible at least.

As for the split documentations, the idea is that this guide is supposed to supply you with everything you need to get going, while lib-react4xp is to answer questions and technicalities better.

(Yep, reading a lot is boring. As for writing all this stuff? You have NO idea! :P So if you have suggestions for how to say things short to just get started, clear to avoid making unnecessary questions and answering the predictable ones, and thorough for those who really need to pop the hood and look at the engine... I'm all ears. :) )

[ComLock]

"Entries" is also a bit unclear. I'm assuming you mean the react files listed under webpack config entry, which becomes standalone bundles which can be used by React4xp runtime.

You are not meaning the Enonic XP javascript files which are also listed under webpack config entry and becomes bundles Enonic XP can use runtime.

The way "I" have traditionally build stuff is to bundle the react stuff into the Enonic XP controller, so that it's one bundle. But I'm guessing that would not work in React4xp nashorn thingy?

(I understand in terms of reuse and client-side use, bundling everything in one would be stupid, so chunking common things is smarter)

[espen42]

That's correct.

[espen42]

Tried handling this in recently released update.