Get Started with Agentforce Commerce Vibes

Build and administer a Storefront Next project with Agentforce Commerce Vibes. The B2C workflows require that you install the extension and connect to a Salesforce org.

Build a Storefront 

  1. Install the Commerce Vibes extension and log in to your Salesforce org as described in Install and Launch the Commerce Vibes Extension.

  2. If you haven’t done so, lauch the extension by clicking the Commerce Vibes icon in the Activity Bar. A Welcome page appears.

    When you open a folder that doesn’t contain a storefront project, the Welcome page is displayed. When you open a chat panel in Commerce Vibes, the chat displays project-aware example prompts: prompts to get started or prompts that apply to your storefront type after creating a storefront project.

    Tip

  3. To create a sample project for Storefront Next, click the Storefront Next tile in the Welcome page.

  4. Answer the questions that the agent asks you to provide inputs for the new storefront. The questions include how you want the storefront created, the vertical template, the storefront name, and so on. The output of the executed commands is displayed in the Terminal tab. Provide inputs to any question in the Terminal.

    As the agent executes tasks, it asks you to approve some tasks. You can configure when the agent asks for approval to run actions in Settings. See Agentforce Commerce Vibes Settings.

    Tip

  5. Provide the configuration information of your sandbox instance or accept the defaults to use the B2C demo sandbox instance. Salesforce provides the B2C sandbox demo instance to use for samples but you don’t have administration privileges to manage this instance. After the storefront is created, VS Code opens the project folder.

  6. Go to Commerce Vibes by clicking the Commerce Vibes icon in the Activity Bar.

  7. Optionally, write more prompts to customize the storefront.

  8. To understand the contents of the project that was created, write this prompt: Explain Storefront Next project structure.

  9. To build and run the storefront locally, type this prompt: View my storefront.

Administer Your B2C Commerce Instance 

Commerce Vibes runs agent skills from the Agentic B2C Developer Toolkit that perform administration tasks in your B2C Commerce instance. Here’s an example prompt for running a job on a sandbox instance.

  • Run the search indexing job on my sandbox specified in the dw.json file.

    This action runs an agent skill that invokes the B2C CLI. Make sure you configured a dw.json file with the B2C Commerce credentials so that the skill can run. See Optional: Configure B2C Commerce Credentials.

    Note

Search the B2C Documentation 

The toolkit includes a B2C agent skill that searches all B2C admin and developer documentation. Start your prompt with ‘Search the docs’. The agent searches the B2C documentation and returns answers in the chat. Here are some example search prompts.

  • Search the docs about data fetching in Storefront Next.
  • Search the docs about the headless architecture in Page Designer.

Browse the B2C Toolkit 

Familiarize yourself with the MCP server tools and agent skills from the Agentic B2C Developer Toolkit available in Commerce Vibes.

  1. In VS Code, in the Agentforce Commerce Vibes panel, click the B2C Toolkit tab.
  2. Click MCP Servers > B2C Commerce DX to browse the MCP tools available for B2C development.
  3. Click Skills and check out the agent skills available for B2C development.
  4. Click Rules and check out the deterministic rules.

Browse the toolkit

To complement the built-in toolkit and provide more development assistance, add other MCP servers, skills, and rules. For example, reference an MCP server that assists with React development, or add a rule for team development instructions to follow. Rules are saved in .afv/ folder in your project.

Note

See Also