frontend-architecture

仓库创建 2026年7月27日最近提交 1 天前SkillHot 收录 1 天前

▸ 精选理由

适合新项目脚手架与解藕复杂代码库，强调可执行规范与 ESLint 强制。

这个 Skill 做什么

为 React/前端工程提供功能型目录、导入单向法与 API 分层规范。

把 React/前端项目按功能划目录、界定边界、规范导入方向、分好状态管理类别并设计 API 层，让代码结构一目了然便于维护。适合搭新项目、添加 feature 文件夹、理顺互相引用或选定状态库和放置状态位置时用。特点是约定一套固定的 src 分类、用 one-way import 法并用 ESLint 强制、把 typed API 与 feature 同址，降低耦合和认知负担。

▸ 展开 SKILL.md 英文原文

Organizes React/frontend codebases: folder structure, feature boundaries, import direction, state management categories, API layer. Use when scaffolding a frontend app, adding a feature folder, untangling imports, choosing a state library, or deciding where state lives.

开发编程前端架构React代码组织导入规范通用

Stars

Forks

仓库内 Skill

积累中

7 日增星

安装 / 使用

给你的 Agent 一句话（通用）

帮我安装这个 skill：https://raw.githubusercontent.com/Ludenox-GIT/portable-agent-skills/main/skills/frontend-architecture/SKILL.md

或 curl 直取 SKILL.md

curl -fsSL "https://raw.githubusercontent.com/Ludenox-GIT/portable-agent-skills/main/skills/frontend-architecture/SKILL.md"

SKILL.MD 节选查看完整文件 ↗

# Frontend Architecture

Feature-based React architecture per alan2207/bulletproof-react, hardened to one default library per state category: a fixed `src/` taxonomy, a one-way import law enforced by ESLint, and a typed API layer colocated with features.

## When to use

- Scaffolding a new React/Next.js/Vite app.
- Adding a feature folder to an existing feature-based codebase.
- Untangling cross-feature or upward imports.
- Choosing a state library, or deciding where a piece of state lives.
- Setting up or reviewing the API/data-fetching layer.

When NOT to use: backend/service architecture, publishable component-library packaging (different constraints: barrels and exports maps are fine th

via SKILL·HOT · 数据来自 GitHub 公开信息 · 原文版权归作者所有