folder-structure

Name: folder-structure
Availability: InStock
Author: tazagame

Establishes ANT standard directory layouts and metadata for automated processing workflows.

Updated Apr 15, 2026

Search Tags:#scalability #best-practices #fsd #folder-structure #frontend-architecture #code-organize

Ready to run

npx skills add https://github.com/tazagame/claude-setting-v0.1-fsd-next-etc --skill folder-structure-tazagame

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: folder-structure
Source: https://github.com/tazagame/claude-setting-v0.1-fsd-next-etc/tree/main/.claude/skills/folder-structure
Command: npx skills add https://github.com/tazagame/claude-setting-v0.1-fsd-next-etc --skill folder-structure-tazagame

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

현대 프런트엔드 프로젝트에서 폴더 구조의 일관성 부족으로 파일 위치 찾기와 import 경로 관리가 어렵습니다. 이 Skill은 Feature-Sliced Design(FSD) 원칙에 따라 src 아래의 계층과 슬라이스, 세그먼트를 명확히 정의하여 확장성과 협업 효율을 높여 줍니다.

Core Features & Use Cases

수직 계층(Layer) → 도메인 슬라이스(Slice) → 기술 세그먼트(Segment) 3단 구조를 강제합니다.
각 계층의 디렉토리 규칙(app/pages/widgets/features/entities/shared)과 슬라이스 내부 구조를 표준화합니다.
다국어 리소스(i18n) 배치를 포함한 파일 위치 의사결정을 자동으로 안내합니다.
새 프로젝트에서 이 규칙을 즉시 적용하고, 코드베이스 전반의 모듈 간 의존성을 안정적으로 관리합니다.

Quick Start

새 프로젝트에서 이 폴더 구조 규칙을 즉시 적용하려면 문서를 읽고 권장 위치에 파일을 배치하십시오.

Frequently Asked Questions about folder-structure

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

FAQPage Schema

What is Feature-Sliced Design and how does it organize frontend folder structure?▼

Feature-Sliced Design (FSD) is a frontend architecture methodology that organizes folders into vertical layers, domain slices, and technical segments to ensure consistent file placement, import paths, and scalable project structure.

How do I structure a scalable frontend project using FSD layers?▼

Structure your frontend project by enforcing six FSD layers: app, pages, widgets, features, entities, and shared. Each layer contains domain slices with standardized technical segments to manage module dependencies and file locations.

Can I use FSD folder structure for an existing frontend codebase or is it only for new projects?▼

FSD folder structure is designed for new frontend projects to immediately apply layer, slice, and segment rules. While applicable to existing codebases, it primarily guides initial file placement and import path standardization from project inception.

Where should i18n resource files be placed in a Feature-Sliced Design architecture?▼

In Feature-Sliced Design architecture, i18n resource files are organized within specific slice segments, ensuring multilingual resources follow the same standardized file placement and import path rules as other modules.

What is the best way to manage module imports and dependencies in frontend architecture?▼

The best way to manage module imports is enforcing a strict vertical layer hierarchy where upper layers depend on lower ones, preventing circular dependencies and ensuring stable codebase scaling across domain slices.