How to add a placeholder in Sitecore JSS?

How to add a placeholder in Sitecore JSS?

The most basic, and most common way to add a placeholder is to use the Placeholder component: The name is the key of the placeholder you’re exposing, and the rendering is the current Sitecore-provided route data, or parent component data if you’re exposing a placeholder from within another component.

How does a placeholder component work in react?

When you emit the component array, React will render the components where you emit them. The main advantage of this technique is that there is no wrapper component. If you use the Placeholder component, all child components render underneath it in the React component tree.

Can a Sitecore JSS be used with sxa?

JSS has been integrated with SXA, and JSS can utilize SXA’s scaling and multi-site automation capabilities. JSS Tenants and Partial Designs are supported. Headed features of SXA like drag-and-drop components and creative exchange are not supported.

Is the JavaScript layer of Sitecore open source?

The JavaScript layer of JSS is open-source. You can use the GitHub repository to submit issues, feature requests, and pull requests. See the contributing guide for guidelines. Assistance with the JSS products can also be obtained in community-based channels.

What’s the advantage of using a placeholder in react?

The main advantage of this technique is that there is no wrapper component. If you use the Placeholder component, all child components render underneath it in the React component tree. If you emit the placeholder with this technique, the placeholder will have no wrapping component and will render inline.

Where to add a new component in Sitecore?

Because Sitecore’s layout is dynamic, a newly created component is quiescent until it’s added to the layout on a route. JSS defines routes in /data/routes by default. Let’s add our new component to a placeholder. All of the sample apps come with a default placeholder called jss-main, so for simplicity we’ll use that. Open /data/routes/en.yml.

How to scaffold new JSS components in Sitecore?

All JSS does is inject the content data from Sitecore. JSS’ sample apps include a script that allows you to easily scaffold new JSS components. The script is run like so: This script is a completely customizable boilerplate ( /scripts/scaffold-component.js) if you don’t like the default scaffolding conventions.