generating-lwc-components

Generate Lightning Web Component bundles with Apex, GraphQL, and Jest tests.

Updated Jun 1, 2026
One-click install
npx skills add https://github.com/Collabalist/SFDC --skill generating-lwc-components-collabalist
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: generating-lwc-components
Source: https://github.com/Collabalist/SFDC/tree/main/.agents/skills/generating-lwc-components
Command: npx skills add https://github.com/Collabalist/SFDC --skill generating-lwc-components-collabalist

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill automates the development of Lightning Web Components, significantly reducing the time and effort required to create custom user interfaces.

Core Features & Use Cases

  • Component Scaffolding: Automatically generate complete LWC bundles with structured JavaScript, HTML, CSS, and meta.xml configurations.
  • PICKLES Architecture: Follow a structured methodology for robust component development.
  • Scoring System: Validate components against 165-point scoring criteria for structure, data layer, UI/UX, accessibility, testing, performance, events, and security.
  • Wire Service Patterns: Integrate with Apex and GraphQL for data handling.
  • Jest Testing: Generate comprehensive unit tests for LWC components.
  • Cross-Skill Integration: Leverage related skills for full Salesforce development lifecycle.

Quick Start

Skill: generating-lwc-components Request: "Create a data table component for Account records"

Frequently Asked Questions about generating-lwc-components

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate Lightning Web Components for Salesforce automatically?

Lightning Web Components are generated automatically as complete bundles containing JavaScript, HTML, CSS, and meta.xml configurations. This automation follows the structured PICKLES architecture to ensure robust Salesforce component development without manual file creation.

How do I integrate LWC with Apex and GraphQL using the wire service?

LWC integrates with Apex and GraphQL through built-in wire service patterns for data handling. Generated components include these configurations natively, enabling efficient Salesforce data operations without manual wiring logic.

Can I generate Jest tests for my Lightning Web Components?

Yes, comprehensive Jest tests are generated alongside your Lightning Web Components. The scaffolding process includes Jest testing natively, ensuring your LWC bundles are created with corresponding unit tests for validating component logic and data layer interactions.

What is the 165-point scoring criteria for Lightning Web Components?

The 165-point scoring criteria is a validation system evaluating LWC structure, data layer, UI/UX, accessibility, testing, performance, events, and security. It ensures generated Lightning Web Components meet strict quality standards for robust Salesforce UI development.

What is the best way to scaffold a complete LWC bundle for Salesforce?

Scaffolding an LWC bundle is best handled through automated generation that creates JavaScript, HTML, CSS, and meta.xml configurations simultaneously. This ensures Lightning Web Components follow a structured architecture and pass strict validation criteria without manual setup.

Do I need to manually configure meta.xml when creating Lightning Web Components?

No, meta.xml configurations are generated automatically. The LWC scaffolding process creates the meta.xml files alongside the JavaScript, HTML, and CSS files, ensuring your Lightning Web Components are properly structured and exposed within Salesforce without manual configuration.