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

experience-ui-bundle-frontend-generate

Generate compliant frontend changes for Salesforce Experience UI bundle apps.

Updated Jun 17, 2026
Search Tags:#typescript#react#routing#shadcn/ui#tailwind css#salesforce#experience ui bundle
One-click install
npx skills add https://github.com/angryracoon/ARIEF-VISEO-DEV-ORG --skill experience-ui-bundle-frontend-generate
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: experience-ui-bundle-frontend-generate
Source: https://github.com/angryracoon/ARIEF-VISEO-DEV-ORG/tree/main/.agents/skills/experience-ui-bundle-frontend-generate
Command: npx skills add https://github.com/angryracoon/ARIEF-VISEO-DEV-ORG --skill experience-ui-bundle-frontend-generate

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill prevents broken UI updates in existing Salesforce Experience UI bundle apps by enforcing the project’s layout, routing, styling, and file-ownership conventions before code is generated.

Core Features & Use Cases

  • Page Changes: Update routed pages inside the existing app shell without disturbing the router structure.
  • Layout Changes: Modify shared header, footer, navigation, and branding through the correct layout entry points.
  • Component Work: Build reusable or page-specific React components with the expected shadcn/ui and Tailwind patterns.
  • Project Safety: Avoid incorrect imports, invalid router usage, and unsupported Salesforce module references that would break the app.
  • Use Case: A developer wants to add a settings page, refresh the top navigation, or restyle a dashboard while preserving the repository’s conventions and build stability.

Quick Start

Tell me which existing page, component, or layout in the UI bundle you want changed, and I will apply the repository conventions to produce the update.

Frequently Asked Questions about experience-ui-bundle-frontend-generate

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

FAQPage Schema
How do I add a new page to a Salesforce Experience UI bundle without breaking routing?▼

You can update routed pages in a Salesforce Experience UI bundle by modifying the existing app shell through appLayout.tsx and routes.tsx, ensuring TypeScript and base-path conventions are preserved to avoid broken imports and navigation errors.

Can I use shadcn/ui components with Tailwind CSS in a Salesforce Experience UI bundle?▼

Yes, you can build reusable or page-specific React components using shadcn/ui and Tailwind CSS patterns within the Salesforce Experience UI bundle while enforcing project-specific file-structure requirements to maintain build stability.

What is the best way to modify shared navigation in a Salesforce Experience UI bundle?▼

The best way to modify shared navigation is through the correct layout entry points like appLayout.tsx, adjusting header and footer elements while enforcing project-specific TypeScript and routing requirements to prevent invalid platform module usage.

Why do my Salesforce Experience UI bundle imports break when updating layout files?▼

Broken imports occur when layout updates violate the project's file-ownership conventions. Enforcing specific TypeScript, routing, and base-path requirements before generating code prevents broken UI updates and invalid module references.

Does Salesforce Experience UI bundle development require specific TypeScript routing conventions?▼

Yes, Salesforce Experience UI bundle development requires specific TypeScript routing conventions defined by routes.tsx, ensuring base-path configurations and file-structure rules are met to avoid incorrect navigation and platform module errors.

Related Skills

Explore More Software Engineering Skills→
cchrisvcchrisv

building-ui-bundle-frontend

Enforce project-specific conventions when editing existing UI bundle frontends.

Community
Advanced
saleorsaleor
29

validating-pre-commit

Automate pre-commit quality checks with lint fixes, TypeScript compilation, tests, and CI validation.

Official
Advanced
spuneiarturspuneiartur
1

component-factory

Generate reusable React components with JSX files and barrel exports.

Community
Intermediate
CollabalistCollabalist

generating-ui-bundle-site

Provision Salesforce Digital Experience Sites for React UI bundles.

Community
Advanced