Sitecore is going back to its .NET roots! With the launch of XM Cloud, Sitecore took a slight detour into Next.js front-end framework, highlighting that as the preferred technology stack and limiting some of the SDKs. While this combination has proven to be powerful and effective, it alienated many of existing customers with large .NET development teams, or companies that were for one reason or another limited to .NET and its respective hosting environments.

Well, worry no more. Sitecore has officially launched a new version of its ASP.NET Core SDK as well as a ASP.NET Core Starter Kit. While it has technically been possible to run XM Cloud using .NET core for a while, as demonstrated by the Sitecore MVP site (and repository), it was not quite on feature parity with its Next.js SDK. The new SDK and starter kit, which are in a alpha version at the of writing this article, aim to bridge the gap and help in the transition for those teams who prefer to work in .NET.

In this article, I’m going to help demonstrate how to get started with the starter kit. Special thanks goes to Rob Earlam at Sitecore for giving a great demonstration of this at Sitecore Symposium as well as recent local user groups, including the November 21st session of the Los Angeles User Group.

Let’s get started.

Step 1:

Start by visiting the official starter kit repo. From here, select the use this template button in GitHub and create a copy of this repository.

Once you have created a new repository in your own account, clone your new repository to your local machine. We’ll leave the solution alone for now.

Step 2:

Let’s jump over to XM Cloud and create a new project for this. Head over to the XM Cloud Deploy App. From the projects tab, click Create Project.

Follow the on-screen prompt to give your project a name. On the Choose Source Control tab, Select GitHub (or whichever provider you cloned your repo to). For the remainder of this article, we’re going to presume your code is in GitHub. Select Continue.

On the Set up Repository tab, select Use your own code, and select your GitHub account, and from the choose a repository dropdown, select the repository you created in Step 1.

In the next screen, give your environment a name and select the desired options. For this example, we chose No for using the Production SaaS SLA since this if for testing only, and chose Yes for the Auto Deploy option. Click continue to review your selections.

If you are satisfied with all the options, simply select Start Deployment and sit back while Sitecore does it magic of provisioning the project for you.

Step 3:

Once the provisioning is complete, click the name of your environment that just created in the breadcrump at the top of the page. This will take you to the environment page for your project. From there, click on Sites tab and click Create Site

On the following screen, you can choose Empty Site if this is meant to a real project, or click the Basic Site to get a starter site with some basic pages and components. For this example, we’ll choose the Basic Site.

On the next screen, fill in the details, using the Collections field to group the similar sites. Click Create Site to well, create your site.

Step 4:

We’ll now focus on getting our development environment working. To start, we’ll open the solution from the repo you created in Step 1. Open the Visual Studio solution named aspnet-core-starter.sln from <root>\headapps folder.

In the solution, duplicate the appsettings.json and rename it to appsettings.Development.json.

We now need to go back the XM Cloud Deploy app. From there, navigate back to the Environment details page (the same place where you created the site in Step 3). From there, go to the Developer Settings tab.

You can grab the values from Developer Settings and paste them in your appsettings.Development.json file.

Step 5:

We’re almost there. The final step is to connect XM Cloud to our local environment. To do so, we must first create a public dev tunnel using Visual Studio. To create the dev tunnel, please follow the steps defined in this guide.

Next, make sure your dev tunnel is selected by clicking the small arrow next to the Run button, select Dev Tunnels and choose the dev tunnel you just created.

Once selected, simply push F5 or click the run button. This will load a new browser and you will have a very important URL that we’ll need for the next step. The page should load and you’ll have a URL similar to something like: https://xxxxxx-5001.usw3.devtunnels.ms/. Your URL will look different. If your page loads via localhost url, it means that you did not select the dev tunnel before starting the project.

Copy your dev tunnel URL for the next step.

Step 6:

To connect XM Cloud’s Pages app to our local environment, switch back to the deploy app, and from your environment page, click Options and select Open Dashboard

From the Dasboard, under the Content menu, select Content Editor

In the content Editor, navigate to this item:
/sitecore/system/Settings/Services/Rendering Hosts/Default

Update the fields on this item and replace the hostname with your dev tunnel URL from Step 5. Be sure to leave the paths intact and only replace the hostname.

We should now be able to connect our local environment to XM Cloud Pages app. Go back to your dashboard and simply click on the site.

You can now edit your site using Pages and be connected to your local environment. You can make changes to your code locally and see those changes.

Please note that the Pages app will only work as long as you’re running your site in Visual Studio. Also remember that currently, the SDK and the starter kit are in very early stages and may not have all the features and may be prone to bugs.

Even though this is early stages, the performance numbers are already looking amazing. Take a look at this post by Christian Hahn:

Hope this helps get you started in XM Cloud with the ASP.NET Core Starter Kit.