Experience Lwc Generate

This is the LWC skill for Salesforce's component framework. It triggers when you're building Lightning Web Components, touching anything in lwc folders, or working with wire services and Jest tests. Built around a PICKLES methodology and a 165-point scoring rubric, it covers component architecture, data patterns (LDS, Apex, GraphQL, LMS), SLDS 2 styling with dark mode support, accessibility checks, and Jest unit testing. The workflow pushes you to choose the right data access pattern first, validate for frontend quality, then hand off backend or deploy work to other skills. Includes a local dev server for hot reload preview and a reference library with component patterns, anti-patterns, and asset templates for common scenarios like datatables, Flow screens, and GraphQL pagination.

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

View on GitHub

Install

$ npx -y skills add forcedotcom/sf-skills --skill experience-lwc-generate --agent claude-code

Installs into .claude/skills of the current project.

Files

experience-lwc-generate: Lightning Web Components Development

Use this skill when the user needs Lightning Web Components: LWC bundles, wire patterns, Apex/GraphQL integration, SLDS 2 styling, accessibility, performance work, or Jest unit tests.

When This Skill Owns the Task

Use experience-lwc-generate when the work involves:

lwc/**/*.js, .html, .css, .js-meta.xml
component scaffolding and bundle design
wire service, Apex integration, GraphQL integration
SLDS 2, dark mode, and accessibility work
Jest unit tests for LWC

Delegate elsewhere when the user is:

writing Apex controllers or business logic first → platform-apex-generate
building Flow XML rather than an LWC screen component → automation-flow-generate
deploying metadata → platform-metadata-deploy