fsd-slice

Generate standardized Feature-Sliced Design folder structures for React TypeScript projects.

Updated Jan 11, 2026
One-click install
npx skills add https://github.com/AdemKao/ai-cowork --skill fsd-slice
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: fsd-slice
Source: https://github.com/AdemKao/ai-cowork/tree/main/.ai/stacks/react-typescript/skills/fsd-slice
Command: npx skills add https://github.com/AdemKao/ai-cowork --skill fsd-slice

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Creating Feature-Sliced Design slices from scratch often leads to inconsistent folder structures and unclear public APIs, making it hard to scale codebases.

Core Features & Use Cases

  • Generates a canonical FSD folder layout for entities, features, widgets, and pages
  • Provides recommended index.ts exports and public API patterns to ensure consistent imports
  • Guides rapid scaffolding when starting new modules or features across React TypeScript projects

Quick Start

Run the fsd-slice command with Layer, Name, and Segments to scaffold the folder structure.

Frequently Asked Questions about fsd-slice

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

FAQPage Schema
How do I scaffold a Feature-Sliced Design slice in a React TypeScript project?

To scaffold a Feature-Sliced Design slice, run the fsd-slice command with the Layer, Name, and Segments parameters to instantly generate the canonical folder layout and public API files for your React TypeScript modules.

What is the standard folder structure for Feature-Sliced Design entities and features?

The standard FSD folder structure organizes code across layers like entities, features, widgets, and pages, each containing designated segments and an index.ts file that serves as a strict public API for consistent imports.

Can I use this scaffolding tool for existing React components or only new layers?

This scaffolding tool applies to new layers and components within a repository to ensure consistent architectural scaffolding, guiding rapid module creation when starting new features across React TypeScript projects.

What's the best way to maintain consistent public APIs across FSD slices?

The best way to maintain consistent public APIs across FSD slices is by generating recommended index.ts exports and public API templates automatically, ensuring canonical folder structures and clear import boundaries throughout the codebase.

Why does manually creating Feature-Sliced Design slices lead to inconsistent architecture?

Manually creating FSD slices leads to inconsistent architecture because folder structures and public APIs often deviate across modules, making codebases hard to scale and resulting in unclear import boundaries.

Do I need TypeScript to generate FSD slices with this scaffolding tool?

Yes, TypeScript is required because the tool generates canonical FSD folder structures and public API templates specifically designed for React TypeScript projects to ensure type-safe and consistent architectural scaffolding.