Token导航 LogoToken导航TokenDH.com
中转站排行榜
前端设计需要联网github未标认证来源可访问许可证需确认审计通过

architect-nextjs（架构师 Next.js）

Agent Skill

用于辅助前端页面、组件、样式和交互逻辑的开发与维护。它适合让 Agent 生成或审查 React、Next.js、Vue、Tailwind、CSS 等相关代码，整理组件结构，或定位布局和性能问题。使用时需要结合项目现有设计系统、路由和构建方式，避免只生成孤立片段；涉及页面改动时，应配合本地预览和构建检查确认视觉效果。

总安装

783

周安装

32

GitHub Stars

2

下载量

251
CodexClaudeCursorGemini CLI

安装说明

本站只整理中文说明和来源信息，不托管安装包，也不代用户安装。

GitHub

来源数

2

许可证

unknown

最后核验

2026-05-01

来源状态

来源可访问

安装方式

通过对话安装

复制提示词发给支持本地命令或 Skills 的 AI 助手，先确认命令和权限，再让它执行。

请帮我安装这个 Agent Skill：architect-nextjs（架构师 Next.js）
来源仓库：https://github.com/ivantsxx/my-next-skills
仓库路径：skills/architect-nextjs
安装命令：
npx skills add https://github.com/ivantsxx/my-next-skills --skill architect-nextjs
安装前请先检查当前环境是否支持对应 CLI，并向我确认将要执行的命令、安装目录、联网范围和文件读写权限；确认后再执行。

命令行安装

复制命令到本机终端执行。该命令会通过 npx skills 从第三方来源获取 Skill；本站只展示命令，不托管安装包，也不自动执行。

skills.shnpx skills
npx skills add https://github.com/ivantsxx/my-next-skills --skill architect-nextjs

简介

architect-nextjs 建立 Next.js 应用的架构规范，强制实施作用域规则和路由分组结构。

  • 适用于 Codex、Claude、Cursor、Gemini CLI 中构建可扩展的前端应用和组件库。
  • 通过 GitHub 安装，使用 npx skills add 命令添加技能，确保代码组织符合 Screaming Architecture 原则。
  • 安装前建议确认权限范围，注意是否会触发文件创建、目录结构调整或构建流程执行。
  • 适用宿主包括 Codex、Claude、Cursor、Gemini CLI，接入前应确认版本、权限和运行环境要求。

SKILL.md

Scope Rule Architect (Next.js 15+)

This skill establishes the architectural foundation for scalable Next.js applications by enforcing strict Scope Rules and Screaming Architecture.

Core Principles

1. The Scope Rule (Absolute Law)

"Scope determines structure."

  • Local Scope: Code used by 1 feature → MUST stay local (e.g., (user)/profile/_components).
  • Shared Scope: Code used by 2+ features → MUST go to src/shared/.
  • No Exceptions: Do not pollute shared with single-use components.

2. Screaming Architecture

Directory structures must immediately declare *what* the application does.

  • Use Route Groups (feature) for top-level modules.
  • Avoid generic folders like containers or views at the top level.

3. Next.js 15 Standards

  • App Router Only: No pages/ directory.
  • Server-First: Components are Server Components by default.
  • Data Access: Fetch directly in Server Components or via Server Actions.

Decision Framework

When placing files, follow this decision tree:

  1. Count Usage:

- Used by 1 Feature: Place in app/(feature)/_components/. - Used by 2+ Features: Place in src/shared/components/.

  1. Determine Type:

- Server Component: Default. Used for static content and initial data fetching. - Client Component: Use ONLY for useState, useEffect, or event listeners. - Server Action: Use for mutations and form handling. Place in _actions/name.ts.

Implementation Guides

Project Structure

For the standard directory layout, reference the Project Structure Template. Use this reference when setting up new folders or verifying where a specific file should reside.

Component Templates

For code patterns ensuring best practices, reference the Component Templates. This includes:

  • Server Components with Suspense and data fetching.
  • Client Components isolated for interactivity.
  • Server Actions properly typed and validated.

Quality Checklist

Before finalizing a structure or file creation:

  1. Scope: Is this used in >1 feature? If no, move to _components.
  2. Server: Is "use client" absolutely necessary? Can it be pushed down the tree?
  3. Screaming: Does the folder name describe *what* it does (e.g., (invoices) vs pages)?
  4. Colocation: Are specific hooks/types/styles next to the consuming component?

适合场景

01

用户想查找某类 Agent Skill 时

02

需要根据任务场景推荐可安装能力包时

03

需要对比不同来源的安装命令和来源信息时

能力概览

能力 1

按任务关键词查找相关 Skills

能力 2

展示可复制的安装命令

能力 3

保留来源站点、仓库和原始说明，方便继续核验

能力 4

展示第三方安全扫描或审计结果

安装后应在对应宿主中按原始 README 的触发条件使用；具体调用方式请以来源页面和 README 为准。

平台分布

Codex

37.05%
按下载量换算93

Claude

29.02%
按下载量换算73

Cursor

18.94%
按下载量换算48

Gemini CLI

9.14%
按下载量换算23

安全审计

Gen Agent Trust Hub

通过

Socket

通过

Snyk

通过

权限和风险

需要联网

该 Skill 可能需要联网访问来源站点、仓库或外部 API；具体网络访问范围需要结合源码和 README 复核。

安装前确认

本站仅展示第三方公开信息，不托管安装包，不提供自动安装或运行环境。安装前应自行审查源码、依赖和命令行为。当前只有一个来源，正式发布前建议补源仓库或其他目录站核验。

来源信息

GitHub 仓库

github.com

/ivantsxx/my-next-skills

SKILL.md 来源

github.com

/ivantsxx/my-next-skills/tree/main/skills/architect-nextjs

skills-sh

skills.sh

/ivantsxx/my-next-skills/architect-nextjs

继续浏览同类 Skills

更多前端设计 Skills（10,216）返回 Skills 目录

上一个 Skill

architect-foundations（建筑师基金会）

architect-foundations 用于处理 GitHub 仓库、Issue、Pull Request 和代码协作信息，适合在 Codex、Claude、Cursor、Gemini CLI 中需要围绕仓库状态、代码变更或协作事项进行整理时使用。可结合来源仓库、安装命令和原始 README 继续核验具体用法。安装前建议确认权限范围、维护状态，以及是否会触发联网、命令执行或文件读写。

下一个 Skill

architect-nextjs-bun-app（架构师 Next.js Bun 应用）

用于辅助前端页面、组件、样式和交互逻辑的开发与维护。它适合让 Agent 生成或审查 React、Next.js、Vue、Tailwind、CSS 等相关代码，整理组件结构，或定位布局和性能问题。使用时需要结合项目现有设计系统、路由和构建方式，避免只生成孤立片段；涉及页面改动时，应配合本地预览和构建检查确认视觉效果。