Sitecore JSS an overview

sitecore and epi server

High Score Labs News   •   Mar 12, 2020

One of the best additions to sitecore, in my opinion, is JSS. Basically, the tool seperates sitecore from how content is rendered, also known as headless. One of the biggest advantages of JSS is that it allows a team to use talented front end developers that have little or no knowledge of sitecore, allowing them to build the user experience to meet the demands of the client. This also makes it easier to get the most of out of sitecore, since the number of fully experienced sitecore developers is reduced, especially helpful considering that top sitecore talent can be difficult to find. What are the basics of this tool and how does it work? We will have an overview of its architecture, features and concepts next.

The headless design of JSS separates presentation from sitecore. With traditional sitecore development, rendering of content was tightly integrated with the sitecore platform. Now it is possible to develop user experiences using vue, angular and react separate from sitecore using a code first approach. To achieve this, the architecture of JSS looks like this:

There are several services which make it possible to separate rendering from sitecore while maintaining many of the features of the platform that customers have used for years. The primary components are as follows. JSS Library, which provides the needed support to drive the dynamic placeholder system that sitecore uses to allow users to build custom sites and pages with content editing tools. The sitecore layout service is what enables content to be separated between sitecore and presentation, making it easy to consume services on the front end to get and display the content to the user. The javascript view engine supports server-side rendering which preserves sitecore’s advanced content editing features, allowing content contributors to develop unique experiences using the traditional editing tool set. One of the most interesting features is the application import service. This allows for a code first approach, which means that a team of front-end developers can create all of the needed sitecore items (templates, layouts, etc) in a disconnected fashion, deploying to sitecore at a later time, even after the web app/site is complete. Again, this makes it easier for an organization to leverage existing talent to quickly achieve their user experience goals.

One of the main reasons that so many use sitecore is its personalization abilities, allowing content contributors and marketing teams to create custom personalized experiences based on the audience that is engaged through the public interface. The sitecore layout service, ensures that the same personalization engine that has been used in previous versions of sitecore is used in the JSS architecture. In addition, sitecore analytics also functions as before using the JSS tracker API, which allows the front-end app (isolated from the traditional sitecore analytics api) to push data directly to sitecore.

Code First
One of the best features is the code first approach. This allows a front-end team to do what they do best without needing to access sitecore directly. They can create all of the needed sitecore items on the front end and then using the application import service, push those items to sitecore a later time. In addition, they can run the app in their own local environment, using the tools that they are most familiar with, reducing a steep learning curve. Another useful feature is that a sitecore admin can set permissions that prevent overwrites when pushing changes made by the front-end team. This would especially be important if working with an existing sitecore platform that already has live sites or work being performed by other teams. Of course, one can use the sitecore first approach, if that is more advantageous.

Overall, JSS gives sitecore an important edge for future growth of the product, allowing headless architecture and further enabling cutting edge user experiences. We are excited to see what future improvements and features will be added to the platform in the future. At High Score Labs, we have a team of sitecore experts, with years of experience with sitecore; from upgrades, migration, support and general development, we have the talent that can help your team create the best user experiences, getting the most out of your investment.

Contact us today!