Let’s Develop with Salesforce Commerce Cloud — Part 2: Creating a Development Storefront
Tags: eclipse, salesforce, salesdevelopment, demandware
Published: 2020-01-26 19:12:46

---
title: Let’s Develop with Salesforce Commerce Cloud — Part 2: Creating a Development Storefront
published: true
date: 2018-07-20 18:55:53 UTC
tags: eclipse,salesforce,sales-development,demandware
canonical_url: 
---

![](https://cdn-images-1.medium.com/max/1024/1*96XUr6cf5MGomjZLfSvHfA.jpeg)<figcaption>Photo by <a href="https://unsplash.com/photos/c9FQyqIECds?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Mike Petrucci</a> on <a href="https://unsplash.com/search/photos/online-shopping?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></figcaption>

Missed part 1? Catch up [right here](https://dev.to/pxjohnny/let-s-develop-with-salesforce-commerce-cloud-part-1-setting-up-your-development-environment-59h2-temp-slug-9771545)!

In this segment of the Let’s Develop with Salesforce Commerce Cloud we are going to setup a storefront. A storefront is basically the term SFCC uses for an e-commerce website, but it can also refer to just about any application, be it a native mobile app or an in-house employee benefits portal. A storefront is a foundational concept of SFCC development, as everything you develop for the platform is, ultimately, hosted on a storefront.

### Setting up SiteGenesis

To help us get started quickly with our site, SFCC provides us with a full fledge sample e-commerce site called _SiteGenesis_ which includes all sort of sample objects such as _ISML templates_, _controllers_ and _scripts._

To install the SiteGenesis storefront:

1. In Eclipse, go to **File** > **New** >  **Other** _._
2. Select _SiteGenesis Storefront_ and click _Next_.
3. Enter a root name and location for your storefront and select which digital server to attach the SiteGenesis to. Click _finish_.

![](https://cdn-images-1.medium.com/max/640/1*q7o0xyNPoG3p9rVyt-jOLg.gif)

When finished, you will see some new objects in your _Project Explorer:_

- A folder named **<root name>\_core**  — contains all the core elements of the website, such as: images, pages, css files etc.
- A folder named **<root name>\_controllers**  — contains all the JavaScript controllers that contain the logic of the site.
- A folder named **<root name>\_pipelines**  — the same as controllers, but uses legacy pipelines instead of JavaScript.

❤️ **Please note** :   
These folders are, in essence, _cartridges_. Cartridges are a fundamental concept of Commerce Cloud, used for packaging and deploying code. In Part 3 we are going to build our very own cartridge so take a minute and have a look at the content of these folders and how they are organized.

The new cartridges will now be uploaded to the Business Manager site. In order to use any of them however, we will have to register them first.

### Registering the SiteGenesis Cartridges

Registering a cartridge is done through Business Manager and is simply a matter of adding the cartridge name to a list of used cartridges.

It is important to note the order of importance of the list. Contrary to what you may expect, the order of importance goes from left to right, meaning the cartridges at the left take precedence over cartridges at the end of the path.

To register the core cartridges on your site:

1. In Business Manager click **Administrations > Sites > Manage Sites**.
2. Click the **Settings**  tab.
3. Under **Cartridges** add **<root name>\_core** to the cartridges list as the first item.
4. Add **<root name>\_controllers** to the list (separated by a colon) to add the JavaScript controllers functionality, or **<root name>\_pipelines** for the Pipelines functionality. Click **Apply** to save the changes.

The end result should be **<root name>\_core:<root name>\_controllers** in case of controllers, or **<root name>\_core:<root name>\_pipelines** for pipelines.

![](https://cdn-images-1.medium.com/max/640/1*dU4caitmgR27jJooomez8Q.gif)

### Viewing SiteGenesis

Now that our cartridges are uploaded and registered, we ready to roll! Head over to your site url, and if all went well you should be greeted with the following:

![](https://cdn-images-1.medium.com/max/1024/1*hNWPybpHaboZ_4rg-n7qtA.png)<figcaption>SiteGenesis in action</figcaption>

And there you have it. A full fledged e-commerce website running on SFCC waiting for our custom cartridge 🎉.

In Part 3, we will develop a custom cartridge — which is how you can add custom business logic and functionality to your site.

To read more about SFCC and its capabilities, refer to the official documentation located at:  
[https://documentation.demandware.com/DOC2/index.jsp](https://documentation.demandware.com/DOC2/index.jsp)