generating-lwc-components

Official

Generate production-ready LWC with quality guardrails.

Authorforcedotcom
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This skill prevents slow, error-prone Lightning Web Component (LWC) builds by generating complete components that follow Salesforce UI patterns, accessibility expectations, and testable architecture.

Core Features & Use Cases

  • End-to-end LWC bundle scaffolding: Generates LWC files (JS, HTML, CSS, and js-meta.xml) in a ready-to-implement structure for the chosen use case.
  • PICKLES-driven implementation guidance: Applies a structured workflow to choose architecture, data access patterns, event models, and performance/security considerations.
  • Quality instrumentation: Incorporates SLDS 2 and dark mode compatibility expectations, accessibility requirements, and Jest unit test generation.
  • Integration-ready patterns: Supports wire service patterns, Apex/GraphQL integration guidance, Flow screen integration, and Lightning Message Service concepts.

Quick Start

Generate a Lightning Web Component bundle and Jest tests for a data table experience by asking: Create a data table component for Account records with SLDS 2 styling, dark mode readiness, accessibility, and Jest unit tests.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: generating-lwc-components
Download link: https://github.com/forcedotcom/sf-skills/archive/main.zip#generating-lwc-components

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.