Skip to main content

Sitecore XM Cloud local development setup

Below are my notes when setting up a local Sitecore XM Cloud development environment. There are many good blog articles for local XM setup but the following 3 were the most useful for me

Blog 1 - Used for Docker setup
Blog 2 - Used for Rendering site setup
Blog 3 - Used to install test content in local CM

Using the information from the first 2 articles I was able to setup my local docker environment by running the up.ps1 script and then having a local Sitecore instance running on
https://xmcloudcm.localhost

I also had my local next js rendering site running using start:connected and accessed using the url
http://localhost:3000

You can write all your rendering React code in your React app. You can create components using Json renderings in Sitecore and have corresponding tsx files in the components folder of your React app. For any Sitecore content items that are part of the component, you serialize those items as yml files in your codebase.

Important Files
scjssconfig.json => contains jss config for local Sitecore CM
sitecore.json => contains path of the serialization folder and files

user.json => contains user specific config details to xmcloud dev and local

Setup Option #1 

This is an ideal setup so that all developers have a local Sitecore instance they can use for development. This only works with Windows machines since the Sitecore XM Cloud Foundation template relies on Windows-based Docker containers.


Setup Option #2 

Most of the information in this article is about option #1 but there is another option that can be considered and worked for me. If your team consists of more front end React developers who are all on Macs, this second option would work for you. So all the developers would use a Sitecore XM cloud environment as their local Sitecore instance. This needs more communication among the developers so they don't step on each other's items and bring an environment down for everyone. But it works as long as everyone understands what they are doing. Worst case be ready to bring down an environment and re-create it if needed.

Setup Option 2

Conclusion 

It's nice that with Sitecore XM Cloud development your local setup is more simpler than traditional Sitecore local setups. Additionally you are no longer tied to using a Windows machine. Happy XM Cloud Sitecoreing!


Comments

Popular posts from this blog

Sitecore: Get list of logged in users

I had a deployment today and wanted to find a list of users who were logged into the Sitecore admin site. This was mainly so that I can contact them and let them know that a deployment was going to happen. I found the following link very useful as it gave me exactly what I was looking for. A list of users that were logged in and I contacted them. It also has the ability to Kick off users! http://{YourWebsite}/sitecore/client/Applications/LicenseOptions/KickUser Note: You can only see other users in this list if you have the right administrator permission. Logging in with a lower access level user only gave me the logged in user and no one else on the list.

Create Object XML while Debugging in VS

 There are times when you put breakpoints in Visual studio and read object values within Visual Studio. This is all good if you are doing some debugging. But if you want to save an object like a Json object in Visual studio there isn't a straightforward way to do that. I found this piece of code that I copied and pasted in the Immediate Window in Visual Studio and was able to save the object as an XML file. (new System.Xml.Serialization.XmlSerializer(YourObject.GetType())).Serialize(new System.IO.StreamWriter(@"c:\tmp\YourObject.xml"), YourObject) Happy Sitecoreing!

Updating Sitecore Image alt text

One of the most important conditions of making a site accessible is to make sure that all images on the site have the alt field with some value that describes the image. The simplest update we can make to Sitecore is to have the alt field automatically get the image file name. That way even if content authors forget to fill the alt field, it is pre-filled with the file name. To do this just add $name to the alt field in the standard value of an image [/sitecore/templates/System/Media/Unversioned/Image/__Standard Values] This is all good for an future images that gets uploaded to Sitecore. But what about all the existing images. For that we can write a PowerShell script (see below) to get all images in the Sitecore image folder that have empty alt tags. Export that to a csv file. $pathOfImages = "master:/sitecore/media library/MyImages" $images = Get-ChildItem -Path $pathOfImages -Language * -Recurse | Where-Object { ($_.Fields["Alt"] -ne $null) -and ($_.Fields...