MCP HubMCP Hub
← スキル一覧に戻る

project-structure

KubrickCode
更新日 Yesterday
171 閲覧
1
1
GitHubで表示
開発react

について

このスキルは、モノレポ、NestJS、React、Go、NPMパッケージなど、さまざまなプロジェクトタイプ向けに標準化されたプロジェクト構造テンプレートを提供します。これにより、明確なモジュール分離、一貫した命名規則、整理されたファイル配置戦略を備えたスケーラブルなアーキテクチャが保証されます。新しいプロジェクト構造の設計時、フォルダ階層の設定時、またはディレクトリ命名規則の確立時にご利用ください。

クイックインストール

Claude Code

推奨
プラグインコマンド推奨
/plugin add https://github.com/KubrickCode/ai-config-toolkit
Git クローン代替
git clone https://github.com/KubrickCode/ai-config-toolkit.git ~/.claude/skills/project-structure

このコマンドをClaude Codeにコピー＆ペーストしてスキルをインストールします

ドキュメント

Project Structure Guide

모노레포

project-root/
├── src/                         # 모든 서비스/앱
├── infra/                       # 통합 인프라
├── docs/                        # 문서
├── .devcontainer/               # Dev Container 설정
├── .github/                     # 워크플로우, 템플릿
├── .vscode/                     # VSCode 설정
├── .claude/                     # Claude 설정
├── .gemini/                     # Gemini 설정
├── package.json                 # 루트 package.json. 릴리즈, 버전 관리용
├── go.work                      # Go 워크스페이스 (go 사용 시)
├── justfile                     # Just 태스크 러너
├── .gitignore
├── .prettierrc
├── .prettierignore
└── README.md

NestJS

project-root/
├── src/
│   ├── domains/
│   ├── common/
│   ├── config/
│   ├── database/
│   ├── app.module.ts
│   └── main.ts
├── tests/
├── package.json
└── tsconfig.json

React

project-root/
├── src/
│   ├── pages/              # 페이지별 모듈
│   ├── domains/            # 도메인 공용 코드
│   ├── components/         # 공용 UI 컴포넌트
│   ├── layouts/            # 레이아웃 관련
│   ├── libs/               # 기능 라이브러리 (auth, api, theme)
│   ├── shared/             # 순수 유틸리티
│   ├── app.tsx
│   └── main.tsx
├── public/
├── package.json
├── vite.config.ts
└── tsconfig.json

Next.js

project-root/
├── app/
│   ├── (routes)/           # 페이지 (route groups)
│   ├── actions/            # Server Actions (내부 변경)
│   └── api/                # API Routes (외부 통합 전용)
├── components/             # 공유 컴포넌트
├── lib/                    # 유틸리티 및 클라이언트
├── public/                 # 정적 에셋
├── middleware.ts           # Edge/Node.js 미들웨어
├── next.config.js
├── package.json
└── tsconfig.json

Go

project-root/
├── cmd/                    # 실행 진입점 (main.go)
├── internal/               # 비공개 패키지
├── pkg/                    # 공개 패키지
├── configs/                # 설정 파일
├── scripts/                # 유틸리티 스크립트
├── tests/                  # 통합 테스트
├── docs/                   # 문서
├── go.mod
└── go.sum

NPM

project-root/
├── cli/                        # CLI 실행 진입점
├── internal/                   # 비공개 패키지
├── pkg/                        # 공개 패키지
├── configs/                    # 설정 파일
├── scripts/                    # 유틸리티 스크립트
├── tests/                      # 통합 테스트
├── docs/                       # 문서
├── dist/                       # 빌드 결과물
├── package.json
├── tsconfig.json
└── README.md

IDE Extension

project-root/
├── extension/                   # Extension 진입점 (activate/deactivate)
├── internal/                    # 비공개 패키지
├── pkg/                         # 공개 패키지
├── view/                        # WebView (있을 경우)
├── configs/                     # 설정 파일
├── scripts/                     # 유틸리티 스크립트
├── tests/                       # 통합 테스트
├── public/                      # 정적 리소스 (아이콘 등)
├── dist/                        # 빌드 결과물
├── package.json
├── tsconfig.json
└── .vscodeignore

Chrome Extension

project-root/
├── background/                  # Service Worker (Background Script)
├── content/                     # Content Scripts
├── popup/                       # Popup (Extension UI)
├── internal/                    # 비공개 패키지
├── pkg/                         # 공개 패키지
├── configs/                     # 설정 파일
├── scripts/                     # 유틸리티 스크립트
├── tests/                       # 통합 테스트
├── public/                      # 정적 리소스
├── dist/                        # 빌드 결과물
├── package.json
└── tsconfig.json

GitHub リポジトリ

KubrickCode/ai-config-toolkit
パス: .claude.kr/skills/project-structure

関連スキル

content-collections

メタ

This skill provides a production-tested setup for Content Collections, a TypeScript-first tool that transforms Markdown/MDX files into type-safe data collections with Zod validation. Use it when building blogs, documentation sites, or content-heavy Vite + React applications to ensure type safety and automatic content validation. It covers everything from Vite plugin configuration and MDX compilation to deployment optimization and schema validation.

スキルを見る

cloudflare-turnstile

メタ

This skill provides comprehensive guidance for implementing Cloudflare Turnstile as a CAPTCHA-alternative bot protection system. It covers integration for forms, login pages, API endpoints, and frameworks like React/Next.js/Hono, while handling invisible challenges that maintain user experience. Use it when migrating from reCAPTCHA, debugging error codes, or implementing token validation and E2E tests.

スキルを見る

langchain

メタ

LangChain is a framework for building LLM applications using agents, chains, and RAG pipelines. It supports multiple LLM providers, offers 500+ integrations, and includes features like tool calling and memory management. Use it for rapid prototyping and deploying production systems like chatbots, autonomous agents, and question-answering services.

スキルを見る

clerk-auth

メタ

This skill provides comprehensive guidance for implementing Clerk authentication across React, Next.js, and Cloudflare Workers applications. Use it when setting up protected routes, configuring JWT templates with custom claims, integrating with UI components, or testing authentication flows. It also helps prevent common issues like missing secret keys, JWT size limits, and middleware configuration errors.

スキルを見る