forcedotcom avatar

Building Ui Bundle App

This is the orchestrator you want when building a complete React UI bundle app on Salesforce from scratch. It coordinates seven specialized skills in dependency order: scaffolding, features (auth, shadcn, search), data access via GraphQL, frontend components, optional integrations like Agentforce chat and file uploads, deployment, and Experience Site generation. The key insight here is that it prevents the common mistake of executing phases out of order, which breaks the build. Use it when someone asks for a full app end to end, not for editing a single component or building Lightning Experience apps with custom objects. It starts by generating a concrete build plan, then loads and executes each phase skill sequentially.

skills.sh installs
3.7K
GitHub stars
1.2K
last updated
Aug 21, 2026

Install

$ npx -y skills add forcedotcom/sf-skills --skill building-ui-bundle-app --agent claude-code

Installs into .claude/skills of the current project.

Files

This is the orchestrator you want when building a complete React UI bundle app on Salesforce from scratch. It coordinates seven specialized skills in dependency order: scaffolding, features (auth, shadcn, search), data access via GraphQL, frontend components, optional integrations like Agentforce chat and file uploads, deployment, and Experience Site generation. The key insight here is that it prevents the common mistake of executing phases out of order, which breaks the build. Use it when someone asks for a full app end to end, not for editing a single component or building Lightning Experience apps with custom objects. It starts by generating a concrete build plan, then loads and executes each phase skill sequentially.

Browse the repository on GitHub

Sponsors

Details

Repository
github.com/forcedotcom/sf-skills
Categories
Frontend Development, DevOps & CI/CD, AI & Agent Building, Design & UI/UX
First seen
Jun 3, 2026

More from forcedotcom/sf-skills

All 158
1chakra-ui avatarchakra-ui-builderchakra-ui/chakra-uiBuild responsive, accessible UI components and layouts using Chakra UI v3, install or configure Chakra UI in new and existing projects, and design scalable them3.6Kskills.sh installs
2jezweb avatarshadcn-uijezweb/claude-skillsInstall and configure shadcn/ui components for React projects. Guides component selection, installation order, dependency management, customisation with semanti3.6Kskills.sh installs
3forcedotcom avatarimplementing-ui-bundle-agentforce-conversation-clientforcedotcom/sf-skillsUse this skill when the user asks to add, embed, integrate, configure, style, or remove an agent, chatbot, chat widget, conversation client, or AI assistant in 3.5Kskills.sh installs
4jezweb avatartailwind-theme-builderjezweb/claude-skillsSet up Tailwind v4 + shadcn/ui themed UI with dark mode. Install deps, configure CSS variables via @theme inline, wire dark mode toggle, verify. Use whenever th3.3Kskills.sh installs
5samhvw8 avatarui-design-systemsamhvw8/dot-claudeReact UI component systems with TailwindCSS + Radix + shadcn/ui. Stack: TailwindCSS (styling), Radix UI (primitives), shadcn/ui (components), React/Next.js. Cap3.2Kskills.sh installs
6browserbase avatarui-testbrowserbase/skillsAI-powered adversarial UI testing via the browse CLI. Analyzes git diffs to test only what changed, or explores the full app to find bugs. Tests functional corr3.1Kskills.sh installs