create-component

Create a folder under site/src/components/{ComponentName}, copy the reusable template, customize it with TypeScript and Tailwind, then export via index.ts. This enforces consistent typings and standardized folder layout.

The standard folder layout for Preact UI components places files under site/src/components/{ComponentName}/, containing an index.ts for exports and a {ComponentName}.tsx file for the component logic. This ensures scalable and consistent imports.

Yes, this component scaffolding approach works with existing App.tsx files by providing integration guidance. After scaffolding and exporting via index.ts, you import the new component directly into App.tsx or parent components where needed.

Yes, you can use this to create interactive widgets and page sections. The scaffolding workflow applies to adding UI components, sections, or interactive elements across a project while maintaining consistent typings and styling.

The best way to enforce consistent export conventions is using a standardized folder layout with an index.ts barrel file. This skill supplies a reusable template and guidelines to ensure all UI components follow identical export and typing patterns.

No external dependencies are required to scaffold components this way. The skill relies on a built-in template and established project conventions for Preact, TypeScript, and Tailwind to structurally generate the necessary files.