VitePress

Appearance

Workshop Overview ​

Welcome to the AIforce Workshop. In this workshop, you'll use Salesforce Hosted MCPs, Agentforce Vibes, React, and the Headless Experience Layer (HXL) to build AI-assisted Salesforce experiences from connection through render-anywhere delivery.

What You'll Build ​

  • A Salesforce Hosted MCP Server that lets AI clients and developer tools interact with Salesforce through trusted, managed servers.
  • A Salesforce DX project with Agentforce Vibes including some org metadata, MCP tools, skills, and natural-language prompts.
  • A Salesforce-backed React app that starts with mock data, adds interactivity, connects to live Salesforce data, and deploys to your org.
  • An HXL widget that renders a single JSON card definition inside the Agentforce conversation and, unmodified, through an MCP server for external clients.
  1. Start with Explore Salesforce Hosted MCPs to connect Salesforce Hosted MCP servers and use the AIforce Playground with live org data.
  2. Continue with Build with Agentforce Vibes to launch Vibes, create a Storefront Health Component, and vibe code a Merchant Performance Dashboard.
  3. Continue with Build a Multi-Framework App with React to create a Merchant Operations Center, connect it to Salesforce data, add workflow, and deploy it to your org.
  4. Finish with Give Agents UI with the Headless Experience Layer (HXL) to generate a storefront profile card as a portable widget and render it in both the Agentforce conversation and an external MCP client. This module is self-contained, so you can also take it on its own right after Get Started.

Continue with the Exercises ​