Month: November 2021

Setup Sitecore 10.2 JSS using next js in secured and connected mode

November 29, 2021 /

Last Updated on November 16, 2022 by sandeeppote

Sitecore 10.2 uses Sitecore Headless Rendering 19.0.0. See link here

See this blog for prerequisites and setting jss using next js in disconnected mode.

Follow below steps after the steps completed in above blog

Download Sitecore Headless Services for Sitecore XM

Prerequisite

Install Sitecore 10.2 XP0 on local development environment. See hte blog here if not already installed

Install downloaded package for Headless Service

https://dev.sitecore.net/Downloads/Sitecore_Headless_Rendering/19x/Sitecore_Headless_Rendering_1900.aspx OR

https://dev.sitecore.net/Downloads/Sitecore_Headless_Rendering/20x/Sitecore_Headless_Rendering_2000.aspx

Run the next js app in connected mode

Before working on connected mode create API Key

Navigate to – /sitecore/system/Settings/Services/API Keys

Create a new API Key e.g.:- nextjsservice

API key here is Item ID

Create a custom binding-

For this create a self signed certificate with a custom domain name in this case – next-jss-prj.dev.local

New-SelfSignedCertificate -CertStoreLocation C:\certificates -DnsName "next-jss-prj.dev.local" -FriendlyName "My First Next JSS App" -NotAfter (Get-Date).AddYears(10)

Create a new https binding and assign the newly create SSL certificate

Add domain to the host file – next-jss-prj.dev.local

Inititate JSS

Run the command

npm init sitecore-jss nextjs

Where would you like your new app created? C:\projects\nextjs
Initializing ‘nextjs’…
What is the name of your app? next-jss-prj.dev.local
What is your Sitecore hostname (used if deployed to Sitecore)? next-jss-prj.dev.local
How would you like to fetch Layout and Dictionary data? REST
How would you like to prerender your application? SSG
Would you like to include any add-on initializers? nextjs-styleguide – Includes example components and setup for
working disconnected
Initializing ‘nextjs-styleguide’…
Which additional language do you want to support (en is already included and required)? da-DK

Setup JSS

jss setup

Is your Sitecore instance on this machine or accessible via network share? [y/n]: y
Path to the Sitecore folder (e.g. c:\inetpub\wwwroot\my.siteco.re):
Invalid input.
Path to the Sitecore folder (e.g. c:\inetpub\wwwroot\my.siteco.re): C:\inetpub\wwwroot\xp102sc.dev.local
Sitecore hostname (e.g. http://myapp.local.siteco.re; see /sitecore/config; ensure added to hosts): next-jss-prj.dev.local
Invalid input. Must start with http(s)
Sitecore hostname (e.g. http://myapp.local.siteco.re; see /sitecore/config; ensure added to hosts): https://next-jss-prj.dev.local
Sitecore import service URL [https://next-jss-prj.dev.local/sitecore/api/jss/import]: https://next-jss-prj.dev.local/sitecore/api/jss/import
Sitecore API Key (ID of API key item): {2318A20A-6DF1-4AB8-B49E-F933A3B79160}
Please enter your deployment secret (32+ random chars; or press enter to generate one):

Deployment secret– Leave this blank as this will generate new secret key

Deployment secret key is generate and stored in <<jss development folder>>\sitecore\config\next-jss-prj.deploysecret.config

JSS connection settings saved to scjssconfig.json

Connection and the deployment secret is created, now this needs to be deployed to Sitecore instance so the JSS app is able to establish a connection with Sitecoore

To deploy the config setting deploy the config to Sitecore instance-

jss deploy config

Configs are copied to Sitecore instance App_Config\Include\zzz…

Deploy the artifacts to Sitecore instance-

Since we don’t know hte thumbprint use the below command with –acceptCertificate as test

jss deploy app –includeContent –includeDictionary –acceptCertificate test

This will provide the thumbprint. highllighted in red

Copy the certificate and try deploying again-

jss deploy app –includeContent –includeDictionary –acceptCertificate E4:54:12:A0:7E:D5:95:9B:B0:C2:00:17:3A:26:1B:AD:71:73:9F:05

if you see this error while importing – Message: An item name must satisfy the pattern: ^[\w*\$][\w\s-\$]*((\d{1,})){0,1}$ (controlled by the setting ItemNameValidation)

Change the ItemnameValidation to .* while importing and revert back to original in Sitecore.config file. Refer this –

https://sitecore.stackexchange.com/questions/470/an-item-name-must-satisfy-the-pattern-w-w-s-d1-0-1-c

To run the app run following command

jss start:connected

If you receive this error-

Execute following command to get this working on port 3000

$env:NODE_TLS_REJECT_UNAUTHORIZED=0

Execute JSS start again-

jss start:connected

ERROR-

Connection to your rendering host failed with a Not Found error. Ensure the POST endpoint at URL http://localhost:3000/api/editing/render has been enabled.

Copy the deploy secret and update the – value of setting of JavaScriptServices.ViewEngine.Http.JssEditingSecret in Sitecore.JavaScriptServices.ViewEngine.Http with the deploy secret.

This now work in connected mode. Any content changes in Sitecore should reflect localhost:3000 and Sitecore instance (https://next-jss-prj.dev.local/)

Sitecore next js working in connected mode with SSL

Error-

Exception thrown while importing JSS app
Exception: System.UnauthorizedAccessException
Message: The current user does not have write access to this item. User: sitecore\JssImport, Item: ContentBlock ({23CE8001-F405-5E50-AE61-AD3057660BBD})
Source: Sitecore.Kernel

Resolution-

Error-

Resolution-

Check if the API key is correct at the location – /sitecore/system/Settings/Services/API Keys

Also check if the CORS and Allowed Controllers are set correctly

For developement environment put * for both the highlighted fields

Setup Sitecore 10.2 JSS using next js with disconnected mode

November 27, 2021 /

Last Updated on April 13, 2022 by sandeeppote

Prerequisite

Install Node js – Download the latest node js from here

Install JSS CLI

npm install -g @sitecore-jss/sitecore-jss-cli

Create a new next js app using JSS CLI

Note the project name should be valid as per below error

next-jss-prj1 is not a valid name; you may use lowercase letters, hyphens, and underscores only.

Numbers not allowed in project name

jss create next-jss-prj nextjs

Installs all the required artifacts in the specified folder

Run the next jss app in desconneted mode-

jss start

The app should listen to port 3000

Errors–

JSS CLI is running in global mode because it was not installed in the local node_modules folder.

Resolution– Install jss cli locally. Also ensure you are in correct directory. Should be in project directory

npm install @sitecore-jss/sitecore-jss-cli

Step by step install Sitecore XC 10.2 using SIF on Windows 11

November 17, 2021 /

Last Updated on February 4, 2023 by sandeeppote

Follow these steps to install Sitecore Commerce 10.2 On Premise. To successfully install refer to Installation Guide provided by Sitecore.

Before installing Sitecore Commerce install Sitecore XP 10.2. See this blog to install Sitecore XP 10.2 using SIF. Say the XP site name is- xp0.sc

Download Installation Guide

Hosting Environment Requirements/ Download and Install following software-

  1. OS – Windows Server 2019/2016 or Windows 10 Pro(64-bit) or Windows 11 Pro(64-bit)
  2. Redis (Windows): 3.0.504 (or later)
  3. Database – Microsoft SQL Server 2017 Express Edition (This should be already installed as a part of XP 10)
  4. Install Microsoft Web Deploy 3.6 if not already installed
  5. Install URL Rewrite using Web Platform Installer
  6. SOLR 8.2.0 (This should have already installed as a part of XP 10 install)
  7. Install PowerShell 5.1 or later is not already installed
  8. Web Platform Transformer (Download nuget package)
  9. (Important) Install Web hosting- here

IMPORTANT – As per the release notes –

The deployment of SXA has been removed from the Commerce installation, and instead installed as a Platform pre-requisite before installing Commerce packages.

Install Powershell Extension for Sitecore – Download Sitecore PowerShell Extension for Sitecore

Install Sitecore Experiemce Accelerator 10.2.0 – Download Sitecore Experience Accelerator 10.2.0

Also Commerce Ops service is removed from deployment configuration this will reduce deployment time and hosting cost.

Before starting the installation ensure XP 10.2 instance is working and indexed. If not indexed rebuild all search indexes-

Download Sitecore Experience Commerce 10.2

Step-by-step installation process-

  1. Create a installation folder for XC – xcinstall for e.g.- c:\scinstallation\xc

2. Copy and extract Sitecore.Commerce.WDP.2021.11-8.0.218.zip file to c:\scinstallation\xc folder

3. Copy Sitecore Experience Accelerator 10.2.0 rev. 04247.zip file c:\scinstallation\xc folder

4. Copy Sitecore.PowerShell.Extensions-6.3 – IAR.zip file to c:\scinstallation\xc folder

5. Extract Web Platform Transfomer nuget package and copy Microsoft.Web.XmlTransform.dll to c:\scinstallation\xc folder

6. Extract SIF.Sitecore.Commerce.7.0.37 to c:\scinstallation\xc folder. Rename this to SIF

7. Folder structure should look like this-

8. Install Sitecore.PowerShell.Extensions-6.3 – IAR.zip package in your earlier installed Sitecore instance

9. Install Sitecore Experience Accelerator 10.2.0 rev. 04247.zip pakcagein your earlier installed Sitecore instance

11. Open Deploy-Sitecore-Commerce.ps1 file in SIF folder to update the following-

  • $XCInstallRoot
  • $XCSIFInstallRoot = “$XCInstallRoot\SIF” or $PWD is fine – it is Present Working Directory,
  • $SiteNamePrefix
  • $SiteName
  • $SiteHostHeaderName [optional]
  • $MergeToolFullPath= “$XCInstallRoot\Microsoft.Web.XmlTransform.dll”
  • $CommerceServicesDbServer = “sc102comm\MSSQL2017”

12. Create Commerce Engine Connect Client Secret for the Sitecore Identity Server

  • Copy below script to file to scinstall/SIF.Sitecore.Commerce.5.0.49 folder example XC10SecretClientCertificate.ps1
  • Execute the script and copy secret key to $CommerceEngineConnectClientSecret
$bytes = New-Object Byte[] 32
$rand = [System.Security.Cryptography.RandomNumberGenerator]::Create()
$rand.GetBytes($bytes)
$rand.Dispose()
$newClientSecret = [System.Convert]::ToBase64String($bytes)
echo $newClientSecret

13. [Optional] Update Sitecore domain or keep it default

  • $SitecoreDomain
  • $SitecoreUsername
  • $SitecoreUserPassword
  • $UserName
  • $UserPassword

14. Update other DB related settings

  • $SqlUser
  • $SqlPass
  • $SitecoreDbServer
  • $CommerceServicesDbServer

15. Update SOLR details-

  • $SolrUrl
  • $SolrRoot
  • $SolrService

Execute Deploy-Sitecore-Commerce.ps1 script to install commerce

IMPORTANT – After deployment is complete Disable TLS 1.3 over TCP for all the sites and all bindings

Errors-

Error -The remote server returned an error: (400) Bad Request. on GetIdServerToken

Resolution – Check your admin credentials if correctly configured in installation script.

Error – Commerce roles site not reachable

Resolution- Check if the SSL certificate for Comerce Engine is in Trusted Root Certification Authorities. If not copy the relevant certs to same.

Step by step guide to install Sitecore XP 10.2 using SIF on Windows 11

November 14, 2021 /

Last Updated on April 14, 2022 by sandeeppote

To install XP Single Developer(XP0) 10.2 on development machine, follow the steps in this blog post

Use the Sitecore Installation Guide for hardware, OS, database and other software requirements

Installation guide for XP Single (XP0) 

OS Requirements-

Windows 11 (64 bit)

Ensure IIS 10x installed

Ensure Powershell version 5.1 or later is installed. Check here the latest version

Install .Net Framework 4.8.0 – Download Developer Pack

Install .NET Core 3.1 Windows Hosting Bundle or later.

Install Microsoft Visual C++ 2015

Install Microsoft SQL Server 2017 Express Edition OR Install Microsoft SQL Server 2019 Express

You may also install the above prequisites using CLI. Goto section Install prerequisites before installing XP 10.2 after installing SQL Server and SIF

Install SQL Server Management Studio (SSMS)

This will ask you to restart your VM/Machine

  • Enable Contained Database Authentication

After installing SQL Server launch SQL Server Management Studio and run following-

EXEC sp_configure 'contained', 1;
 RECONFIGURE;

  • Install SIF Module
  1. Open PowerShell as an administrator.
  2. Set unrestricted execution to current user
Set-ExecutionPolicy -Scope CurrentUser Unrestricted

3. Register repository

Register-PSRepository -Name SitecoreGallery https://sitecore.myget.org/F/sc-powershell/api/v2

4. Install SIF

Install-Module SitecoreInstallFramework

5. After SIF installation check if the SIF 2.3.0 is installed

Get-Module SitecoreInstallFramework –ListAvailable

To install specific version of SIF or run multiple version of SIF see this blog

Download XP Single Developer (XP0)

  • Prepare the installation folder

1. Extract downloaded XP Single Developer package to a folder e.g.:- C:\SCInstallation\XP102
2. Extract XP0 Configuration files 10.2.0 rev. 006766zip in same folder

  • Install prerequisites before installing XP 10.2

Switch to the installable e.g.:- C:\SCInstallation\XP102 folder and execute following script

Install-SitecoreConfiguration -Path .\Prerequisites.json
  • Install SOLR 8.4.0

1. Create a SOLR folder e.g.:- C:\SOLR and switch to e.g.- C:\SCInstallation\XP102  folder. Open Solr-SingleDeveloper.json file.

2. Change the Install Root for SOLR in Solr-SingleDeveloper.json – DefaultValue

 "SolrInstallRoot": {
            "Type": "String",
            "Description": "The file path to install Solr. This config will add the prefix and solr version e.g C:\Solr becomes C:\Solr\[SolrServicePrefix]Solr-8.4.0",
            "DefaultValue": "C:\\SOLR"
        },

3. Execute –

Install-SitecoreConfiguration -Path .\Solr-SingleDeveloper.json

Prepare and Execute script for installation

Open XP0-SingleDeveloper.ps1 file to update following-

  • $Prefix
  • $SitecoreAdminPassword
  • $SCInstallRoot – change path to the folder installers are available
  • $SolrUrl
  • $SolrRoot
  • $SolrService
  • $SqlServer
  • $SqlAdminUser
  • $SqlAdminPassword

Copy license to the e.g. – C:\SCInstallation\XP102  folder

Execute installation script – .\XP0-SingleDevelor.ps1

Error while installation

xconnect Marketing Automation fails to start-

Solution–

Disable TLS 1.3 over TCP for xconnect. Rerun the installation script or disable this as soon as the xconnect bindings are setup by script during installation.

No registration for extension ‘AppPool’ of type ‘Task’

Solution

Check if the Asp.Net options in Windows features – Internet Information Services.

Sitecore Commerce Business Tools Compatibility Table

November 8, 2021 /

Last Updated on November 8, 2021 by sandeeppote

Sitecore Commerce installation package comes with Sitecore Business Tools SDK.

If you are planning to custommise Business Tools you might have to setup the development environment for Business Tools. You can find more information on how to setup the development environment here

For each version of Sitecore Commerce you need to install the specific version of Business Tools in you development environment.

See below the compatibility table for Business Tools with Sitecore commerce-

Package for the same can be found here

Sitecore Commerce (XC) VersionSitecore Business Tools VersionDownload Link
10.27.0.6https://sitecore.myget.org/feed/sc-npm-packages/package/npm/@sitecore/bizfx/7.0.6
10.16.0.6https://sitecore.myget.org/feed/sc-npm-packages/package/npm/@sitecore/bizfx/6.0.6
10.05.0.12https://sitecore.myget.org/feed/sc-npm-packages/package/npm/@sitecore/bizfx/5.0.12
9.34.0.8https://sitecore.myget.org/feed/sc-npm-packages/package/npm/@sitecore/bizfx/4.0.8
9.23.0.7https://sitecore.myget.org/feed/sc-npm-packages/package/npm/@sitecore/bizfx/3.0.7
9.12.0.3https://sitecore.myget.org/feed/sc-npm-packages/package/npm/@sitecore/bizfx/2.0.3
9.0.31.4.1https://sitecore.myget.org/feed/sc-npm-packages/package/npm/@sitecore/bizfx/1.4.1
9.0.21.2.19https://sitecore.myget.org/feed/sc-npm-packages/package/npm/@sitecore/bizfx/1.2.19
9.0.11.1.9https://sitecore.myget.org/feed/sc-npm-packages/package/npm/@sitecore/bizfx/1.1.9
9.0.01.0.572https://sitecore.myget.org/feed/sc-npm-packages/package/npm/@sitecore/bizfx/1.0.572

Sitecore SXA Series

November 1, 2021 /

Last Updated on April 13, 2022 by sandeeppote

Sharing my experience on developing and configuring a site using Sitecore SXA.

Topics-

  1. Creating a SXA tenant and site
  2. Know what is in your installed Tenant and Site
  3. Themes – Create and Assign themes
  4. Create Sitecore SXA module
  5. Create a SXA component form scratch using Scriban
    1. Create data and rendering templates
    2. Setup content and create renderings
    3. Create rendering variants using Scriban
    4. Add rendering to Page (Option 1)
    5. Setup page and partial design
  6. Install module to SXA Site
  7. Add rendering to Page using Toolbox (Option 2) – Coming Soon
  8. Setup custom domain for SXA site – Coming Soon
  9. Debug- Remove div row wrappers when using Sitecore placeholders
  10. Debug- Enable and configure the Asset optimizer
  11. Setup Favicon for your SXA site
  12. Configure settings for Error Handling SXA site- Coming Soon