skills.rest
angryracoon
angryracoonCOMMUNITY
Explore all skills by this author →
GitHub

experience-lwc-generate

Generate Lightning Web Component bundles with JavaScript, HTML, CSS, and meta.xml.

Updated Jun 17, 2026
Search Tags:#jest#graphql#salesforce#lwc#lightning-web-components#slds-2
One-click install
npx skills add https://github.com/angryracoon/ARIEF-VISEO-DEV-ORG --skill experience-lwc-generate
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: experience-lwc-generate
Source: https://github.com/angryracoon/ARIEF-VISEO-DEV-ORG/tree/main/.agents/skills/experience-lwc-generate
Command: npx skills add https://github.com/angryracoon/ARIEF-VISEO-DEV-ORG --skill experience-lwc-generate

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires sf, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill removes the friction of building high-quality Lightning Web Components by guiding component structure, data access, styling, testing, and deployment decisions in one place.

Core Features & Use Cases

  • Component Scaffolding: Generate complete LWC bundles with JavaScript, HTML, CSS, and meta.xml configuration.
  • Architecture Guidance: Apply PICKLES methodology to choose the right data pattern, composition model, and security approach.
  • Quality and Compliance: Validate SLDS 2, dark mode, accessibility, performance, and Jest coverage for production readiness.
  • Use Case: Use it when creating a record page component, a Flow screen UI, a GraphQL-powered list, or a Jest test suite for an existing LWC.

Quick Start

Ask the skill to build or update a Lightning Web Component and specify the component purpose, data source, target surface, accessibility needs, and whether tests are required.

Frequently Asked Questions about experience-lwc-generate

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

FAQPage Schema
How do I generate a production-ready Lightning Web Component with Jest tests?▼

Generate production-ready LWC bundles by specifying the component purpose, data source, target surface, and accessibility needs. The skill scaffolds complete JavaScript, HTML, CSS, meta.xml, and Jest test files for Salesforce UI development.

How does PICKLES architecture guide Lightning Web Component data access patterns?▼

PICKLES architecture guides LWC data access by defining secure patterns for wire service, Apex, GraphQL, and Lightning Message Service integration. It ensures components follow composition models and security approaches compliant with Salesforce production standards.

Can I build a Flow screen integration using a Lightning Web Component?▼

Yes, you can build Flow screen integrations using Lightning Web Components. The skill generates component bundles configured for Flow screen surfaces, applying secure data access patterns and SLDS 2 styling hooks for seamless Salesforce Flow integration.

Do I need the sf CLI to scaffold Lightning Web Component bundles?▼

Yes, the sf CLI is required as a dependency to scaffold Lightning Web Component bundles. The skill relies on the Salesforce CLI to generate, deploy, and manage LWC bundles including JavaScript, HTML, CSS, and meta.xml configuration files.

What's the best way to style LWC components for dark mode using SLDS 2?▼

The best way to style LWC components for dark mode is using SLDS 2 styling hooks. These hooks ensure dark-mode-safe styling while maintaining accessibility and performance compliance across Salesforce Lightning Web Component surfaces.

How do I write Jest tests for an existing Lightning Web Component?▼

To write Jest tests for an existing Lightning Web Component, request test scaffolding for the target component. The skill generates Jest test suites validating wire service patterns, data access, and component behavior for production readiness.

Related Skills

Explore More Software Engineering Skills→
angryracoonangryracoon

platform-metadata-retrieve

Retrieve Salesforce org metadata into a local project using sf project retrieve start.

Community
Advanced
jiten-singh-shahijiten-singh-shahi
13

sf-lwc-testing

Write and debug LWC Jest tests with component mounting and Apex mocking.

Community
Intermediate
JaganproJaganpro
423

sf-lwc

Scaffold Lightning Web Components with PICKLES architecture and Jest tests.

Community
Advanced
bhanu91221bhanu91221
2

aura-patterns

Guide Salesforce developers through Aura-to-LWC migration and interop patterns.

Community
Advanced