concept-workflow by leonardomso/33-js-concepts
npx skills add https://github.com/leonardomso/33-js-concepts --skill concept-workflow使用此技能从头到尾创建一个完整、高质量的概念页面。此技能以最优顺序协调所有五个专项技能:
对于部分任务,请使用单独的技能:
resource-curatorwrite-concepttest-writerfact-checkseo-review广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者,精准高效
┌─────────────────────────────────────────────────────────────────────────────┐
│ 完整概念工作流 │
├─────────────────────────────────────────────────────────────────────────────┤
│ │
│ 输入:概念名称(例如:"hoisting", "event-loop", "promises") │
│ │
│ ┌──────────────────┐ │
│ │ 阶段 1:研究 │ │
│ │ resource-curator │ 查找 MDN 参考、文章、视频 │
│ └────────┬─────────┘ │
│ ▼ │
│ ┌──────────────────┐ │
│ │ 阶段 2:撰写 │ │
│ │ write-concept │ 创建文档页面 │
│ └────────┬─────────┘ │
│ ▼ │
│ ┌──────────────────┐ │
│ │ 阶段 3:测试 │ │
│ │ test-writer │ 为所有代码示例生成测试 │
│ └────────┬─────────┘ │
│ ▼ │
│ ┌──────────────────┐ │
│ │ 阶段 4:验证 │ │
│ │ fact-check │ 验证准确性、运行测试、检查链接 │
│ └────────┬─────────┘ │
│ ▼ │
│ ┌──────────────────┐ │
│ │ 阶段 5:优化 │ │
│ │ seo-review │ SEO 审计和最终优化 │
│ └────────┬─────────┘ │
│ ▼ │
│ 输出:完整、经过测试、已验证、SEO 优化的概念页面 │
│ │
└─────────────────────────────────────────────────────────────────────────────┘
技能: resource-curator 目标: 在撰写前收集高质量的外部资源
进入阶段 2 前:
技能: write-concept 目标: 创建完整的文档页面
/docs/concepts/{concept-name}.mdx 的完整 .mdx 文件docs.json 导航中(如果是新的)进入阶段 3 前:
技能: test-writer 目标: 为所有代码示例创建全面的测试
tests/{category}/{concept}/{concept}.test.js 创建测试文件tests/{category}/{concept}/{concept}.dom.test.jstests/{category}/{concept-name}/{concept-name}.test.jstests/{category}/{concept-name}/{concept-name}.dom.test.js进入阶段 4 前:
npm test -- tests/{category}/{concept}/技能: fact-check 目标: 验证所有内容的技术准确性
验证代码示例:
npm test -- tests/{category}/{concept}/验证 MDN/规范声明:
验证外部资源:
审计技术声明:
生成事实核查报告
进入阶段 5 前:
技能: seo-review 目标: 针对搜索可见性进行优化
审计标题标签:
审计元描述:
审计关键词放置:
审计内容结构:
审计特色摘要优化:
审计内部链接:
计算分数并修复任何问题
标记完成前:
使用此主清单来跟踪所有阶段的进度。
# 概念工作流:[概念名称]
**开始日期:** YYYY-MM-DD
**目标类别:** {category}
**文件路径:** `/docs/concepts/{concept-name}.mdx`
**测试路径:** `/tests/{category}/{concept-name}/`
---
## 阶段 1:资源整理
- [ ] 找到 MDN 参考资料(2-4 个)
- [ ] 找到文章(4-6 篇)
- [ ] 找到视频(3-4 个)
- [ ] 所有链接已验证有效
- [ ] 已撰写描述(具体,2 句话)
- [ ] 资源已格式化为卡片
**状态:** ⬜ 未开始 | 🟡 进行中 | ✅ 完成
---
## 阶段 2:概念撰写
- [ ] Frontmatter 完整
- [ ] 开篇钩子已撰写
- [ ] 开篇代码示例已添加
- [ ] "你将学到什么"框已添加
- [ ] 主要内容部分已撰写
- [ ] 关键要点已添加
- [ ] 测试你的知识已添加
- [ ] 相关概念已添加
- [ ] 已粘贴阶段 1 的资源
- [ ] 已添加到 docs.json(如果是新的)
**状态:** ⬜ 未开始 | 🟡 进行中 | ✅ 完成
---
## 阶段 3:测试编写
- [ ] 代码示例已提取和分类
- [ ] 测试文件已创建
- [ ] DOM 测试文件已创建(如果需要)
- [ ] 所有可测试的示例都有测试
- [ ] 已添加源代码行引用
- [ ] 测试已运行并通过
**测试结果:** X 通过,X 失败
**状态:** ⬜ 未开始 | 🟡 进行中 | ✅ 完成
---
## 阶段 4:事实核查
- [ ] 所有测试通过
- [ ] 代码示例已验证准确
- [ ] MDN 链接已检查(X/X 有效)
- [ ] 外部资源已检查(X/X 有效)
- [ ] 技术声明已审计
- [ ] 未发现误解
- [ ] 问题已修复
**状态:** ⬜ 未开始 | 🟡 进行中 | ✅ 完成
---
## 阶段 5:SEO 审查
- [ ] 标题标签已优化(50-60 字符)
- [ ] 元描述已优化(150-160 字符)
- [ ] 关键词放置正确
- [ ] 内容结构已验证
- [ ] 特色摘要已优化
- [ ] 内部链接完整
**SEO 分数:** X/27 (X%)
**状态:** ⬜ 未开始 | 🟡 进行中 | ✅ 完成
---
## 最终状态
**所有阶段完成:** ⬜ 否 | ✅ 是
**准备发布:** ⬜ 否 | ✅ 是
**完成日期:** YYYY-MM-DD
执行此工作流时,请遵循以下步骤:
开始概念工作流: [CONCEPT NAME]
类别: [fundamentals/functions-execution/web-platform/etc.]
文件: /docs/concepts/[concept-name].mdx
测试: /tests/[category]/[concept-name]/
对于每个阶段:
宣布阶段:
## 阶段 X:[阶段名称]
使用技能:[skill-name]
加载技能以获取详细说明
执行阶段,遵循技能的方法论
报告完成情况:
阶段 X 完成:
- [交付成果 1]
- [交付成果 2]
- 质量关卡:✅ 全部通过
仅在质量关卡通过后进入下一阶段
所有阶段完成后:
# 工作流完成:[概念名称]
## 摘要
- **概念页面:** `/docs/concepts/[concept-name].mdx`
- **测试文件:** `/tests/[category]/[concept-name]/[concept-name].test.js`
- **字数:** X,XXX 字
- **代码示例:** XX 个(XX 个已测试)
- **资源:** X 个 MDN,X 篇文章,X 个视频
## 质量指标
- **测试:** XX 个通过
- **事实核查:** ✅ 全部已验证
- **SEO 分数:** XX/27 (XX%)
## 已创建/修改的文件
1. `/docs/concepts/[concept-name].mdx`(已创建)
2. `/docs/docs.json`(已更新导航)
3. `/tests/[category]/[concept-name]/[concept-name].test.js`(已创建)
## 准备发布:✅ 是
某些阶段可以部分并行化,但一般流程应为:
阶段 1(资源) ──┐
├──► 阶段 2(撰写) ──► 阶段 3(测试) ──┐
│ │
│ ┌───────────────────────────────────┘
│ ▼
└──► 阶段 4(事实核查) ──► 阶段 5(SEO)
| 阶段 | 技能 | 目的 |
|---|---|---|
| 1 | resource-curator | 查找和评估外部资源 |
| 2 | write-concept | 编写文档页面 |
| 3 | test-writer | 为代码示例生成测试 |
| 4 | fact-check | 验证技术准确性 |
| 5 | seo-review | 针对搜索可见性进行优化 |
每个技能在其自己的 SKILL.md 文件中都有详细说明。在每个阶段加载相应的技能以获取全面的指导。
| 阶段 | 预计时间 | 备注 |
|---|---|---|
| 阶段 1:资源 | 15-30 分钟 | 取决于高质量资源的可用性 |
| 阶段 2:撰写 | 1-3 小时 | 取决于概念的复杂性 |
| 阶段 3:测试 | 30-60 分钟 | 取决于代码示例的数量 |
| 阶段 4:事实核查 | 15-30 分钟 | 大部分通过测试自动化 |
| 阶段 5:SEO | 15-30 分钟 | 主要是清单验证 |
| 总计 | 2-5 小时 | 对于一个完整的概念页面 |
要为新概念启动工作流:
1. 确定概念名称和类别
2. 加载此技能(concept-workflow)
3. 执行阶段 1:加载 resource-curator,查找资源
4. 执行阶段 2:加载 write-concept,撰写页面
5. 执行阶段 3:加载 test-writer,创建测试
6. 执行阶段 4:加载 fact-check,验证准确性
7. 执行阶段 5:加载 seo-review,优化 SEO
8. 生成最终报告
9. 提交更改
启动示例提示:
"使用 concept-workflow 技能为 'hoisting' 创建一个完整的概念页面"
这将触发完整的端到端工作流,创建一个完整、经过测试、已验证和 SEO 优化的概念页面。
每周安装次数
241
仓库
GitHub 星标
66.3K
首次出现
Jan 20, 2026
安全审计
已安装于
claude-code138
opencode137
gemini-cli137
github-copilot136
codex124
cursor118
Use this skill to create a complete, high-quality concept page from start to finish. This skill orchestrates all five specialized skills in the optimal order:
For partial tasks, use individual skills instead:
resource-curatorwrite-concepttest-writerfact-checkseo-review┌─────────────────────────────────────────────────────────────────────────────┐
│ COMPLETE CONCEPT WORKFLOW │
├─────────────────────────────────────────────────────────────────────────────┤
│ │
│ INPUT: Concept name (e.g., "hoisting", "event-loop", "promises") │
│ │
│ ┌──────────────────┐ │
│ │ PHASE 1: RESEARCH │ │
│ │ resource-curator │ Find MDN refs, articles, videos │
│ └────────┬─────────┘ │
│ ▼ │
│ ┌──────────────────┐ │
│ │ PHASE 2: WRITE │ │
│ │ write-concept │ Create the documentation page │
│ └────────┬─────────┘ │
│ ▼ │
│ ┌──────────────────┐ │
│ │ PHASE 3: TEST │ │
│ │ test-writer │ Generate tests for all code examples │
│ └────────┬─────────┘ │
│ ▼ │
│ ┌──────────────────┐ │
│ │ PHASE 4: VERIFY │ │
│ │ fact-check │ Verify accuracy, run tests, check links │
│ └────────┬─────────┘ │
│ ▼ │
│ ┌──────────────────┐ │
│ │ PHASE 5: OPTIMIZE│ │
│ │ seo-review │ SEO audit and final optimizations │
│ └────────┬─────────┘ │
│ ▼ │
│ OUTPUT: Complete, tested, verified, SEO-optimized concept page │
│ │
└─────────────────────────────────────────────────────────────────────────────┘
Skill: resource-curator Goal: Gather high-quality external resources before writing
Before moving to Phase 2:
Skill: write-concept Goal: Create the full documentation page
.mdx file at /docs/concepts/{concept-name}.mdxdocs.json navigation (if new)Before moving to Phase 3:
Skill: test-writer Goal: Create comprehensive tests for all code examples
tests/{category}/{concept}/{concept}.test.jstests/{category}/{concept}/{concept}.dom.test.jstests/{category}/{concept-name}/{concept-name}.test.jstests/{category}/{concept-name}/{concept-name}.dom.test.jsBefore moving to Phase 4:
npm test -- tests/{category}/{concept}/Skill: fact-check Goal: Verify technical accuracy of all content
Verify code examples:
npm test -- tests/{category}/{concept}/Verify MDN/spec claims:
Verify external resources:
Audit technical claims:
Generate fact-check report
Before moving to Phase 5:
Skill: seo-review Goal: Optimize for search visibility
Audit title tag:
Audit meta description:
Audit keyword placement:
Audit content structure:
Audit featured snippet optimization:
Audit internal linking:
Calculate score and fix any issues
Before marking complete:
Use this master checklist to track progress through all phases.
# Concept Workflow: [Concept Name]
**Started:** YYYY-MM-DD
**Target Category:** {category}
**File Path:** `/docs/concepts/{concept-name}.mdx`
**Test Path:** `/tests/{category}/{concept-name}/`
---
## Phase 1: Resource Curation
- [ ] MDN references found (2-4)
- [ ] Articles found (4-6)
- [ ] Videos found (3-4)
- [ ] All links verified working
- [ ] Descriptions written (specific, 2 sentences)
- [ ] Resources formatted as Cards
**Status:** ⬜ Not Started | 🟡 In Progress | ✅ Complete
---
## Phase 2: Concept Writing
- [ ] Frontmatter complete
- [ ] Opening hook written
- [ ] Opening code example added
- [ ] "What you'll learn" box added
- [ ] Main content sections written
- [ ] Key Takeaways added
- [ ] Test Your Knowledge added
- [ ] Related Concepts added
- [ ] Resources pasted from Phase 1
- [ ] Added to docs.json (if new)
**Status:** ⬜ Not Started | 🟡 In Progress | ✅ Complete
---
## Phase 3: Test Writing
- [ ] Code examples extracted and categorized
- [ ] Test file created
- [ ] DOM test file created (if needed)
- [ ] All testable examples have tests
- [ ] Source line references added
- [ ] Tests run and passing
**Test Results:** X passing, X failing
**Status:** ⬜ Not Started | 🟡 In Progress | ✅ Complete
---
## Phase 4: Fact Checking
- [ ] All tests passing
- [ ] Code examples verified accurate
- [ ] MDN links checked (X/X valid)
- [ ] External resources checked (X/X valid)
- [ ] Technical claims audited
- [ ] No misconceptions found
- [ ] Issues fixed
**Status:** ⬜ Not Started | 🟡 In Progress | ✅ Complete
---
## Phase 5: SEO Review
- [ ] Title tag optimized (50-60 chars)
- [ ] Meta description optimized (150-160 chars)
- [ ] Keywords placed correctly
- [ ] Content structure verified
- [ ] Featured snippet optimized
- [ ] Internal links complete
**SEO Score:** X/27 (X%)
**Status:** ⬜ Not Started | 🟡 In Progress | ✅ Complete
---
## Final Status
**All Phases Complete:** ⬜ No | ✅ Yes
**Ready to Publish:** ⬜ No | ✅ Yes
**Completed:** YYYY-MM-DD
When executing this workflow, follow these steps:
Starting concept workflow for: [CONCEPT NAME]
Category: [fundamentals/functions-execution/web-platform/etc.]
File: /docs/concepts/[concept-name].mdx
Tests: /tests/[category]/[concept-name]/
For each phase:
Announce the phase:
## Phase X: [Phase Name]
Using skill: [skill-name]
Load the skill to get detailed instructions
Execute the phase following the skill's methodology
Report completion:
Phase X complete:
- [Deliverable 1]
- [Deliverable 2]
- Quality gates: ✅ All passed
Move to next phase only after quality gates pass
After all phases complete:
# Workflow Complete: [Concept Name]
## Summary
- **Concept Page:** `/docs/concepts/[concept-name].mdx`
- **Test File:** `/tests/[category]/[concept-name]/[concept-name].test.js`
- **Word Count:** X,XXX words
- **Code Examples:** XX (XX tested)
- **Resources:** X MDN, X articles, X videos
## Quality Metrics
- **Tests:** XX passing
- **Fact Check:** ✅ All verified
- **SEO Score:** XX/27 (XX%)
## Files Created/Modified
1. `/docs/concepts/[concept-name].mdx` (created)
2. `/docs/docs.json` (updated navigation)
3. `/tests/[category]/[concept-name]/[concept-name].test.js` (created)
## Ready to Publish: ✅ Yes
Some phases can be partially parallelized, but the general flow should be:
Phase 1 (Resources) ──┐
├──► Phase 2 (Writing) ──► Phase 3 (Tests) ──┐
│ │
│ ┌───────────────────────────────────┘
│ ▼
└──► Phase 4 (Fact Check) ──► Phase 5 (SEO)
| Phase | Skill | Purpose |
|---|---|---|
| 1 | resource-curator | Find and evaluate external resources |
| 2 | write-concept | Write the documentation page |
| 3 | test-writer | Generate tests for code examples |
| 4 | fact-check | Verify technical accuracy |
| 5 | seo-review | Optimize for search visibility |
Each skill has detailed instructions in its own SKILL.md file. Load the appropriate skill at each phase for comprehensive guidance.
| Phase | Estimated Time | Notes |
|---|---|---|
| Phase 1: Resources | 15-30 min | Depends on availability of quality resources |
| Phase 2: Writing | 1-3 hours | Depends on concept complexity |
| Phase 3: Tests | 30-60 min | Depends on number of code examples |
| Phase 4: Fact Check | 15-30 min | Most automated via tests |
| Phase 5: SEO | 15-30 min | Mostly checklist verification |
| Total | 2-5 hours | For a complete concept page |
To start the workflow for a new concept:
1. Determine the concept name and category
2. Load this skill (concept-workflow)
3. Execute Phase 1: Load resource-curator, find resources
4. Execute Phase 2: Load write-concept, write the page
5. Execute Phase 3: Load test-writer, create tests
6. Execute Phase 4: Load fact-check, verify accuracy
7. Execute Phase 5: Load seo-review, optimize SEO
8. Generate final report
9. Commit changes
Example prompt to start:
"Create a complete concept page for 'hoisting' using the concept-workflow skill"
This will trigger the full end-to-end workflow, creating a complete, tested, verified, and SEO-optimized concept page.
Weekly Installs
241
Repository
GitHub Stars
66.3K
First Seen
Jan 20, 2026
Security Audits
Gen Agent Trust HubPassSocketPassSnykWarn
Installed on
claude-code138
opencode137
gemini-cli137
github-copilot136
codex124
cursor118
GitHub Actions 官方文档查询助手 - 精准解答 CI/CD 工作流问题
27,800 周安装