contextos-agents 1.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (310) hide show
  1. package/.agents/AGENTS.md +421 -0
  2. package/.agents/adapters/aider/export.js +137 -0
  3. package/.agents/adapters/claude/export.js +55 -0
  4. package/.agents/adapters/copilot/export.js +107 -0
  5. package/.agents/adapters/cursor/export.js +210 -0
  6. package/.agents/adapters/gemini/export.js +115 -0
  7. package/.agents/adapters/shared.js +119 -0
  8. package/.agents/adapters/zed/export.js +111 -0
  9. package/.agents/core/profiles/backend.yaml +47 -0
  10. package/.agents/core/profiles/enterprise.yaml +46 -0
  11. package/.agents/core/profiles/frontend.yaml +46 -0
  12. package/.agents/core/profiles/hackathon.yaml +45 -0
  13. package/.agents/core/profiles/mvp.yaml +43 -0
  14. package/.agents/core/profiles/startup.yaml +48 -0
  15. package/.agents/core/skills/adapters/EXAMPLES.md +19 -0
  16. package/.agents/core/skills/adapters/SKILL.md +105 -0
  17. package/.agents/core/skills/adapters/TROUBLESHOOTING.md +7 -0
  18. package/.agents/core/skills/adapters/VALIDATION.json +12 -0
  19. package/.agents/core/skills/adapters/skill.yaml +10 -0
  20. package/.agents/core/skills/architecture-diagrams/SKILL.md +108 -0
  21. package/.agents/core/skills/architecture-diagrams/VALIDATION.json +12 -0
  22. package/.agents/core/skills/architecture-diagrams/skill.yaml +8 -0
  23. package/.agents/core/skills/brutalist-design/SKILL.md +150 -0
  24. package/.agents/core/skills/brutalist-design/VALIDATION.json +12 -0
  25. package/.agents/core/skills/brutalist-design/skill.yaml +8 -0
  26. package/.agents/core/skills/context-manager/EXAMPLES.md +19 -0
  27. package/.agents/core/skills/context-manager/SKILL.md +126 -0
  28. package/.agents/core/skills/context-manager/TROUBLESHOOTING.md +7 -0
  29. package/.agents/core/skills/context-manager/VALIDATION.json +12 -0
  30. package/.agents/core/skills/context-manager/skill.yaml +10 -0
  31. package/.agents/core/skills/context-os/EXAMPLES.md +21 -0
  32. package/.agents/core/skills/context-os/SKILL.md +169 -0
  33. package/.agents/core/skills/context-os/TROUBLESHOOTING.md +7 -0
  34. package/.agents/core/skills/context-os/VALIDATION.json +12 -0
  35. package/.agents/core/skills/context-os/packs.yaml +59 -0
  36. package/.agents/core/skills/context-os/references/context-rules.md +68 -0
  37. package/.agents/core/skills/context-os/references/pipeline.md +119 -0
  38. package/.agents/core/skills/context-os/references/project-graph.md +103 -0
  39. package/.agents/core/skills/context-os/rules.yaml +135 -0
  40. package/.agents/core/skills/context-os/skill.yaml +10 -0
  41. package/.agents/core/skills/database/EXAMPLES.md +74 -0
  42. package/.agents/core/skills/database/SKILL.md +101 -0
  43. package/.agents/core/skills/database/TROUBLESHOOTING.md +18 -0
  44. package/.agents/core/skills/database/VALIDATION.json +11 -0
  45. package/.agents/core/skills/database/skill.yaml +25 -0
  46. package/.agents/core/skills/ddd/EXAMPLES.md +42 -0
  47. package/.agents/core/skills/ddd/SKILL.md +247 -0
  48. package/.agents/core/skills/ddd/TROUBLESHOOTING.md +19 -0
  49. package/.agents/core/skills/ddd/VALIDATION.json +12 -0
  50. package/.agents/core/skills/ddd/ddd.md +178 -0
  51. package/.agents/core/skills/ddd/skill.yaml +10 -0
  52. package/.agents/core/skills/decisions/EXAMPLES.md +35 -0
  53. package/.agents/core/skills/decisions/SKILL.md +90 -0
  54. package/.agents/core/skills/decisions/TROUBLESHOOTING.md +13 -0
  55. package/.agents/core/skills/decisions/VALIDATION.json +12 -0
  56. package/.agents/core/skills/decisions/skill.yaml +10 -0
  57. package/.agents/core/skills/docker/EXAMPLES.md +56 -0
  58. package/.agents/core/skills/docker/SKILL.md +63 -0
  59. package/.agents/core/skills/docker/TROUBLESHOOTING.md +18 -0
  60. package/.agents/core/skills/docker/VALIDATION.json +11 -0
  61. package/.agents/core/skills/docker/skill.yaml +23 -0
  62. package/.agents/core/skills/engineering-workflow/EXAMPLES.md +57 -0
  63. package/.agents/core/skills/engineering-workflow/SKILL.md +343 -0
  64. package/.agents/core/skills/engineering-workflow/TROUBLESHOOTING.md +19 -0
  65. package/.agents/core/skills/engineering-workflow/VALIDATION.json +12 -0
  66. package/.agents/core/skills/engineering-workflow/skill.yaml +13 -0
  67. package/.agents/core/skills/fastapi/EXAMPLES.md +36 -0
  68. package/.agents/core/skills/fastapi/SKILL.md +148 -0
  69. package/.agents/core/skills/fastapi/TROUBLESHOOTING.md +19 -0
  70. package/.agents/core/skills/fastapi/VALIDATION.json +12 -0
  71. package/.agents/core/skills/fastapi/fastapi.md +112 -0
  72. package/.agents/core/skills/fastapi/skill.yaml +10 -0
  73. package/.agents/core/skills/gemini-precision/SKILL.md +169 -0
  74. package/.agents/core/skills/gemini-precision/VALIDATION.json +12 -0
  75. package/.agents/core/skills/gemini-precision/skill.yaml +9 -0
  76. package/.agents/core/skills/generators/EXAMPLES.md +19 -0
  77. package/.agents/core/skills/generators/SKILL.md +112 -0
  78. package/.agents/core/skills/generators/TROUBLESHOOTING.md +7 -0
  79. package/.agents/core/skills/generators/VALIDATION.json +12 -0
  80. package/.agents/core/skills/generators/skill.yaml +10 -0
  81. package/.agents/core/skills/generators/templates/API.md +77 -0
  82. package/.agents/core/skills/generators/templates/ARCHITECTURE.md +70 -0
  83. package/.agents/core/skills/generators/templates/DATABASE.md +42 -0
  84. package/.agents/core/skills/generators/templates/DECISION.md +46 -0
  85. package/.agents/core/skills/generators/templates/PRD.md +67 -0
  86. package/.agents/core/skills/generators/templates/PROJECT_GRAPH.md +56 -0
  87. package/.agents/core/skills/generators/templates/ROADMAP.md +51 -0
  88. package/.agents/core/skills/generators/templates/TASKS.md +43 -0
  89. package/.agents/core/skills/generators/templates/UI.md +73 -0
  90. package/.agents/core/skills/graphify/EXAMPLES.md +73 -0
  91. package/.agents/core/skills/graphify/SKILL.md +130 -0
  92. package/.agents/core/skills/graphify/VALIDATION.json +12 -0
  93. package/.agents/core/skills/graphify/skill.yaml +13 -0
  94. package/.agents/core/skills/gstack-roles/EXAMPLES.md +23 -0
  95. package/.agents/core/skills/gstack-roles/SKILL.md +152 -0
  96. package/.agents/core/skills/gstack-roles/TROUBLESHOOTING.md +13 -0
  97. package/.agents/core/skills/gstack-roles/VALIDATION.json +12 -0
  98. package/.agents/core/skills/gstack-roles/skill.yaml +12 -0
  99. package/.agents/core/skills/impeccable-design/EXAMPLES.md +26 -0
  100. package/.agents/core/skills/impeccable-design/SKILL.md +201 -0
  101. package/.agents/core/skills/impeccable-design/TROUBLESHOOTING.md +19 -0
  102. package/.agents/core/skills/impeccable-design/VALIDATION.json +12 -0
  103. package/.agents/core/skills/impeccable-design/skill.yaml +14 -0
  104. package/.agents/core/skills/interview-me/SKILL.md +97 -0
  105. package/.agents/core/skills/interview-me/VALIDATION.json +12 -0
  106. package/.agents/core/skills/interview-me/skill.yaml +8 -0
  107. package/.agents/core/skills/microservices/EXAMPLES.md +38 -0
  108. package/.agents/core/skills/microservices/SKILL.md +164 -0
  109. package/.agents/core/skills/microservices/TROUBLESHOOTING.md +19 -0
  110. package/.agents/core/skills/microservices/VALIDATION.json +12 -0
  111. package/.agents/core/skills/microservices/microservices.md +119 -0
  112. package/.agents/core/skills/microservices/skill.yaml +10 -0
  113. package/.agents/core/skills/minimalist-design/SKILL.md +113 -0
  114. package/.agents/core/skills/minimalist-design/VALIDATION.json +12 -0
  115. package/.agents/core/skills/minimalist-design/skill.yaml +8 -0
  116. package/.agents/core/skills/nestjs/EXAMPLES.md +40 -0
  117. package/.agents/core/skills/nestjs/SKILL.md +139 -0
  118. package/.agents/core/skills/nestjs/TROUBLESHOOTING.md +19 -0
  119. package/.agents/core/skills/nestjs/VALIDATION.json +12 -0
  120. package/.agents/core/skills/nestjs/nestjs.md +103 -0
  121. package/.agents/core/skills/nestjs/skill.yaml +10 -0
  122. package/.agents/core/skills/nextjs/EXAMPLES.md +40 -0
  123. package/.agents/core/skills/nextjs/SKILL.md +163 -0
  124. package/.agents/core/skills/nextjs/TROUBLESHOOTING.md +19 -0
  125. package/.agents/core/skills/nextjs/VALIDATION.json +12 -0
  126. package/.agents/core/skills/nextjs/nextjs.md +67 -0
  127. package/.agents/core/skills/nextjs/skill.yaml +10 -0
  128. package/.agents/core/skills/node/EXAMPLES.md +80 -0
  129. package/.agents/core/skills/node/SKILL.md +128 -0
  130. package/.agents/core/skills/node/TROUBLESHOOTING.md +19 -0
  131. package/.agents/core/skills/node/VALIDATION.json +12 -0
  132. package/.agents/core/skills/node/node.md +87 -0
  133. package/.agents/core/skills/node/skill.yaml +10 -0
  134. package/.agents/core/skills/performance/EXAMPLES.md +30 -0
  135. package/.agents/core/skills/performance/SKILL.md +75 -0
  136. package/.agents/core/skills/performance/TROUBLESHOOTING.md +19 -0
  137. package/.agents/core/skills/performance/VALIDATION.json +12 -0
  138. package/.agents/core/skills/performance/performance.md +52 -0
  139. package/.agents/core/skills/performance/skill.yaml +10 -0
  140. package/.agents/core/skills/ponytail-mindset/EXAMPLES.md +45 -0
  141. package/.agents/core/skills/ponytail-mindset/SKILL.md +193 -0
  142. package/.agents/core/skills/ponytail-mindset/TROUBLESHOOTING.md +19 -0
  143. package/.agents/core/skills/ponytail-mindset/VALIDATION.json +12 -0
  144. package/.agents/core/skills/ponytail-mindset/skill.yaml +14 -0
  145. package/.agents/core/skills/react/EXAMPLES.md +79 -0
  146. package/.agents/core/skills/react/SKILL.md +132 -0
  147. package/.agents/core/skills/react/TROUBLESHOOTING.md +19 -0
  148. package/.agents/core/skills/react/VALIDATION.json +12 -0
  149. package/.agents/core/skills/react/react.md +93 -0
  150. package/.agents/core/skills/react/skill.yaml +10 -0
  151. package/.agents/core/skills/react-best-practices/SKILL.md +155 -0
  152. package/.agents/core/skills/react-best-practices/VALIDATION.json +12 -0
  153. package/.agents/core/skills/react-best-practices/skill.yaml +10 -0
  154. package/.agents/core/skills/redesign-audit/SKILL.md +117 -0
  155. package/.agents/core/skills/redesign-audit/VALIDATION.json +12 -0
  156. package/.agents/core/skills/redesign-audit/skill.yaml +8 -0
  157. package/.agents/core/skills/security/EXAMPLES.md +64 -0
  158. package/.agents/core/skills/security/SKILL.md +158 -0
  159. package/.agents/core/skills/security/TROUBLESHOOTING.md +19 -0
  160. package/.agents/core/skills/security/VALIDATION.json +12 -0
  161. package/.agents/core/skills/security/security.md +106 -0
  162. package/.agents/core/skills/security/skill.yaml +10 -0
  163. package/.agents/core/skills/soft-design/SKILL.md +108 -0
  164. package/.agents/core/skills/soft-design/VALIDATION.json +12 -0
  165. package/.agents/core/skills/soft-design/skill.yaml +8 -0
  166. package/.agents/core/skills/state-management/EXAMPLES.md +56 -0
  167. package/.agents/core/skills/state-management/SKILL.md +48 -0
  168. package/.agents/core/skills/state-management/TROUBLESHOOTING.md +18 -0
  169. package/.agents/core/skills/state-management/VALIDATION.json +11 -0
  170. package/.agents/core/skills/state-management/skill.yaml +22 -0
  171. package/.agents/core/skills/subagent-orchestrator/SKILL.md +100 -0
  172. package/.agents/core/skills/subagent-orchestrator/VALIDATION.json +12 -0
  173. package/.agents/core/skills/subagent-orchestrator/skill.yaml +8 -0
  174. package/.agents/core/skills/system-design/EXAMPLES.md +75 -0
  175. package/.agents/core/skills/system-design/SKILL.md +419 -0
  176. package/.agents/core/skills/system-design/TROUBLESHOOTING.md +19 -0
  177. package/.agents/core/skills/system-design/VALIDATION.json +12 -0
  178. package/.agents/core/skills/system-design/skill.yaml +13 -0
  179. package/.agents/core/skills/system-design/system-design.md +112 -0
  180. package/.agents/core/skills/testing/EXAMPLES.md +71 -0
  181. package/.agents/core/skills/testing/SKILL.md +70 -0
  182. package/.agents/core/skills/testing/TROUBLESHOOTING.md +18 -0
  183. package/.agents/core/skills/testing/VALIDATION.json +11 -0
  184. package/.agents/core/skills/testing/skill.yaml +26 -0
  185. package/.agents/core/skills/typescript/EXAMPLES.md +64 -0
  186. package/.agents/core/skills/typescript/SKILL.md +112 -0
  187. package/.agents/core/skills/typescript/TROUBLESHOOTING.md +19 -0
  188. package/.agents/core/skills/typescript/VALIDATION.json +12 -0
  189. package/.agents/core/skills/typescript/skill.yaml +10 -0
  190. package/.agents/core/skills/typescript/typescript.md +71 -0
  191. package/.agents/core/skills/ui-design/EXAMPLES.md +21 -0
  192. package/.agents/core/skills/ui-design/SKILL.md +124 -0
  193. package/.agents/core/skills/ui-design/TROUBLESHOOTING.md +19 -0
  194. package/.agents/core/skills/ui-design/VALIDATION.json +12 -0
  195. package/.agents/core/skills/ui-design/skill.yaml +10 -0
  196. package/.agents/core/skills/ui-design/ui.md +88 -0
  197. package/.agents/core/skills/ui-ux-pro/EXAMPLES.md +62 -0
  198. package/.agents/core/skills/ui-ux-pro/SKILL.md +375 -0
  199. package/.agents/core/skills/ui-ux-pro/TROUBLESHOOTING.md +19 -0
  200. package/.agents/core/skills/ui-ux-pro/VALIDATION.json +12 -0
  201. package/.agents/core/skills/ui-ux-pro/skill.yaml +13 -0
  202. package/.agents/core/skills/ux-design/EXAMPLES.md +36 -0
  203. package/.agents/core/skills/ux-design/SKILL.md +116 -0
  204. package/.agents/core/skills/ux-design/TROUBLESHOOTING.md +19 -0
  205. package/.agents/core/skills/ux-design/VALIDATION.json +12 -0
  206. package/.agents/core/skills/ux-design/skill.yaml +10 -0
  207. package/.agents/core/skills/ux-design/ux.md +80 -0
  208. package/.agents/core/skills/vercel-optimize/SKILL.md +83 -0
  209. package/.agents/core/skills/vercel-optimize/VALIDATION.json +12 -0
  210. package/.agents/core/skills/vercel-optimize/skill.yaml +10 -0
  211. package/.agents/core/skills/web-accessibility/EXAMPLES.md +39 -0
  212. package/.agents/core/skills/web-accessibility/SKILL.md +170 -0
  213. package/.agents/core/skills/web-accessibility/TROUBLESHOOTING.md +19 -0
  214. package/.agents/core/skills/web-accessibility/VALIDATION.json +12 -0
  215. package/.agents/core/skills/web-accessibility/accessibility.md +63 -0
  216. package/.agents/core/skills/web-accessibility/skill.yaml +10 -0
  217. package/.agents/ctx.js +370 -0
  218. package/.agents/generated/claude/skills/adapters/SKILL.md +126 -0
  219. package/.agents/generated/claude/skills/architecture-diagrams/SKILL.md +101 -0
  220. package/.agents/generated/claude/skills/brutalist-design/SKILL.md +145 -0
  221. package/.agents/generated/claude/skills/context-manager/SKILL.md +147 -0
  222. package/.agents/generated/claude/skills/context-os/SKILL.md +191 -0
  223. package/.agents/generated/claude/skills/database/SKILL.md +191 -0
  224. package/.agents/generated/claude/skills/ddd/SKILL.md +305 -0
  225. package/.agents/generated/claude/skills/decisions/SKILL.md +134 -0
  226. package/.agents/generated/claude/skills/docker/SKILL.md +135 -0
  227. package/.agents/generated/claude/skills/engineering-workflow/SKILL.md +414 -0
  228. package/.agents/generated/claude/skills/fastapi/SKILL.md +200 -0
  229. package/.agents/generated/claude/skills/gemini-precision/SKILL.md +161 -0
  230. package/.agents/generated/claude/skills/generators/SKILL.md +133 -0
  231. package/.agents/generated/claude/skills/graphify/SKILL.md +198 -0
  232. package/.agents/generated/claude/skills/gstack-roles/SKILL.md +184 -0
  233. package/.agents/generated/claude/skills/impeccable-design/SKILL.md +241 -0
  234. package/.agents/generated/claude/skills/interview-me/SKILL.md +90 -0
  235. package/.agents/generated/claude/skills/microservices/SKILL.md +218 -0
  236. package/.agents/generated/claude/skills/minimalist-design/SKILL.md +108 -0
  237. package/.agents/generated/claude/skills/nestjs/SKILL.md +195 -0
  238. package/.agents/generated/claude/skills/nextjs/SKILL.md +219 -0
  239. package/.agents/generated/claude/skills/node/SKILL.md +224 -0
  240. package/.agents/generated/claude/skills/performance/SKILL.md +121 -0
  241. package/.agents/generated/claude/skills/ponytail-mindset/SKILL.md +252 -0
  242. package/.agents/generated/claude/skills/react/SKILL.md +227 -0
  243. package/.agents/generated/claude/skills/react-best-practices/SKILL.md +146 -0
  244. package/.agents/generated/claude/skills/redesign-audit/SKILL.md +112 -0
  245. package/.agents/generated/claude/skills/security/SKILL.md +237 -0
  246. package/.agents/generated/claude/skills/soft-design/SKILL.md +103 -0
  247. package/.agents/generated/claude/skills/state-management/SKILL.md +120 -0
  248. package/.agents/generated/claude/skills/subagent-orchestrator/SKILL.md +93 -0
  249. package/.agents/generated/claude/skills/system-design/SKILL.md +507 -0
  250. package/.agents/generated/claude/skills/testing/SKILL.md +157 -0
  251. package/.agents/generated/claude/skills/typescript/SKILL.md +192 -0
  252. package/.agents/generated/claude/skills/ui-design/SKILL.md +161 -0
  253. package/.agents/generated/claude/skills/ui-ux-pro/SKILL.md +451 -0
  254. package/.agents/generated/claude/skills/ux-design/SKILL.md +168 -0
  255. package/.agents/generated/claude/skills/vercel-optimize/SKILL.md +76 -0
  256. package/.agents/generated/claude/skills/web-accessibility/SKILL.md +225 -0
  257. package/.agents/generated/gemini/skills/adapters/SKILL.md +135 -0
  258. package/.agents/generated/gemini/skills/architecture-diagrams/SKILL.md +107 -0
  259. package/.agents/generated/gemini/skills/brutalist-design/SKILL.md +151 -0
  260. package/.agents/generated/gemini/skills/context-manager/SKILL.md +156 -0
  261. package/.agents/generated/gemini/skills/context-os/SKILL.md +200 -0
  262. package/.agents/generated/gemini/skills/database/SKILL.md +200 -0
  263. package/.agents/generated/gemini/skills/ddd/SKILL.md +314 -0
  264. package/.agents/generated/gemini/skills/decisions/SKILL.md +143 -0
  265. package/.agents/generated/gemini/skills/docker/SKILL.md +144 -0
  266. package/.agents/generated/gemini/skills/engineering-workflow/SKILL.md +423 -0
  267. package/.agents/generated/gemini/skills/fastapi/SKILL.md +209 -0
  268. package/.agents/generated/gemini/skills/gemini-precision/SKILL.md +167 -0
  269. package/.agents/generated/gemini/skills/generators/SKILL.md +142 -0
  270. package/.agents/generated/gemini/skills/graphify/SKILL.md +205 -0
  271. package/.agents/generated/gemini/skills/gstack-roles/SKILL.md +193 -0
  272. package/.agents/generated/gemini/skills/impeccable-design/SKILL.md +250 -0
  273. package/.agents/generated/gemini/skills/interview-me/SKILL.md +96 -0
  274. package/.agents/generated/gemini/skills/microservices/SKILL.md +227 -0
  275. package/.agents/generated/gemini/skills/minimalist-design/SKILL.md +114 -0
  276. package/.agents/generated/gemini/skills/nestjs/SKILL.md +204 -0
  277. package/.agents/generated/gemini/skills/nextjs/SKILL.md +298 -0
  278. package/.agents/generated/gemini/skills/node/SKILL.md +323 -0
  279. package/.agents/generated/gemini/skills/performance/SKILL.md +185 -0
  280. package/.agents/generated/gemini/skills/ponytail-mindset/SKILL.md +261 -0
  281. package/.agents/generated/gemini/skills/react/SKILL.md +332 -0
  282. package/.agents/generated/gemini/skills/react-best-practices/SKILL.md +152 -0
  283. package/.agents/generated/gemini/skills/redesign-audit/SKILL.md +118 -0
  284. package/.agents/generated/gemini/skills/security/SKILL.md +355 -0
  285. package/.agents/generated/gemini/skills/soft-design/SKILL.md +109 -0
  286. package/.agents/generated/gemini/skills/state-management/SKILL.md +129 -0
  287. package/.agents/generated/gemini/skills/subagent-orchestrator/SKILL.md +99 -0
  288. package/.agents/generated/gemini/skills/system-design/SKILL.md +631 -0
  289. package/.agents/generated/gemini/skills/testing/SKILL.md +166 -0
  290. package/.agents/generated/gemini/skills/typescript/SKILL.md +275 -0
  291. package/.agents/generated/gemini/skills/ui-design/SKILL.md +170 -0
  292. package/.agents/generated/gemini/skills/ui-ux-pro/SKILL.md +460 -0
  293. package/.agents/generated/gemini/skills/ux-design/SKILL.md +177 -0
  294. package/.agents/generated/gemini/skills/vercel-optimize/SKILL.md +82 -0
  295. package/.agents/generated/gemini/skills/web-accessibility/SKILL.md +300 -0
  296. package/.agents/mcp/runtime.py +454 -0
  297. package/.agents/mcp/server.mjs +189373 -0
  298. package/.agents/plugins.js +574 -0
  299. package/.agents/profiles.js +267 -0
  300. package/.agents/resolver.js +336 -0
  301. package/.agents/skills-index.json +200 -0
  302. package/.agents/skills.json +6 -0
  303. package/.agents/validate.js +500 -0
  304. package/LICENSE +21 -0
  305. package/README.md +415 -0
  306. package/benchmarks/gemini-issues.js +533 -0
  307. package/bin/index.js +458 -0
  308. package/package.json +70 -0
  309. package/registry.json +53 -0
  310. package/registry.schema.json +32 -0
@@ -0,0 +1,419 @@
1
+ ---
2
+ name: system-design
3
+ description: >
4
+ Scalable architecture skill based on the System Design Primer.
5
+ Before designing any backend, reason about load balancers, caching,
6
+ DB partitioning, CAP theorem, and microservices trade-offs.
7
+ Adapted for Serverless/Edge, Next.js App Router, BFF, and DDD patterns.
8
+ ---
9
+
10
+ # system-design
11
+
12
+ ## Overview
13
+
14
+ Scalable system architecture blueprint based on the System Design Primer and DDIA. Enforces load balancing, multi-tier caching (Redis, CDN), database partitioning, CAP theorem tradeoffs, and rate limiting before code is written.
15
+
16
+ ## When to Use
17
+
18
+ Activate during the PLAN phase of any backend service, API design, database schema creation, or scalability optimization.
19
+
20
+ ## Rules & Patterns
21
+
22
+ Based on [donnemartin/system-design-primer](https://github.com/donnemartin/system-design-primer) — the most starred system design resource on GitHub.
23
+
24
+ ## Core Principle
25
+
26
+ > **Everything is a trade-off.** Before writing a single line of backend code, reason through the system at scale. A flat monolith that works now fails at 10× load.
27
+
28
+ ---
29
+
30
+ ## Mandatory Pre-Design Checklist
31
+
32
+ Before architecting any backend system, answer these questions:
33
+
34
+ 1. **Scale**: What is the expected QPS (queries per second)? Peak vs average?
35
+ 2. **Data volume**: How much data? Growth rate? 1GB? 1TB? 1PB?
36
+ 3. **Consistency vs Availability**: Can we tolerate eventual consistency? (CAP theorem)
37
+ 4. **Read/Write ratio**: Is it read-heavy (cache it!) or write-heavy (shard it!)?
38
+ 5. **Latency requirements**: Real-time (<100ms)? Near-real-time (<1s)? Batch?
39
+ 6. **Global distribution**: Single region or multi-region?
40
+ 7. **Deployment model**: Traditional servers, Serverless, or Edge functions?
41
+
42
+ ---
43
+
44
+ ## Core Architecture Patterns
45
+
46
+ ### Load Balancing
47
+
48
+ ```
49
+ Clients → Load Balancer → [App Server 1, App Server 2, App Server N]
50
+ ```
51
+
52
+ - Use **Round Robin** for stateless services
53
+ - Use **Least Connections** for varying request times
54
+ - Use **IP Hash** for session affinity (or move sessions to Redis)
55
+ - Always add **health checks** — remove unhealthy nodes automatically
56
+
57
+ **Rule**: Any service expecting > 1000 RPS needs a load balancer. No exceptions.
58
+
59
+ ### Caching Strategy
60
+
61
+ ```
62
+ App → [Cache Layer: Redis/Memcached] → Database
63
+ ```
64
+
65
+ Cache decision ladder (check in order):
66
+
67
+ 1. Is it read > write? → Cache it
68
+ 2. Is it expensive to compute? → Cache it
69
+ 3. Is it user-specific? → Cache with user key
70
+ 4. Is it global? → Shared cache, shorter TTL
71
+
72
+ **Cache patterns**:
73
+
74
+ - **Cache-aside** (lazy loading): check cache → miss → load DB → write cache
75
+ - **Write-through**: write to DB AND cache simultaneously (consistency > performance)
76
+ - **Write-behind**: write to cache → async flush to DB (performance > consistency)
77
+
78
+ **Invalidation**: Use TTL + event-driven invalidation. Never stale-forever.
79
+
80
+ **Modern framework-native caching (Next.js App Router)**:
81
+ Before spinning up a dedicated Redis instance for caching API responses, check if Next.js built-in mechanisms are sufficient:
82
+
83
+ - `revalidatePath('/dashboard')` — invalidate all cache for a route
84
+ - `revalidateTag('user-profile')` — fine-grained tagged cache invalidation
85
+ - `unstable_cache()` — server-side data caching with TTL
86
+
87
+ ```typescript
88
+ // [GOOD] Use Next.js native caching first
89
+ import { revalidateTag } from 'next/cache'
90
+
91
+ const getUser = unstable_cache(
92
+ async (id: string) => db.users.findById(id),
93
+ ['user'],
94
+ { tags: ['user-profile'], revalidate: 3600 }
95
+ )
96
+
97
+ // Invalidate on mutation:
98
+ await db.users.update(id, data)
99
+ revalidateTag('user-profile')
100
+
101
+ // [BAD] Don't add Redis for simple SSR caching when Next.js handles it
102
+ ```
103
+
104
+ ### Database Architecture
105
+
106
+ #### When to use SQL vs NoSQL
107
+
108
+ | Scenario | Use SQL | Use NoSQL |
109
+ | ---------- | --------- | ----------- |
110
+ | Complex joins, ACID transactions | [PASS] | [FAIL] |
111
+ | Flexible/evolving schema | [FAIL] | [PASS] |
112
+ | Horizontal scaling needed | Careful | [PASS] |
113
+ | Simple key-value lookup | Overkill | [PASS] |
114
+ | Full-text search | Use Elasticsearch | Use Elasticsearch |
115
+ | Time-series data | TimescaleDB | InfluxDB |
116
+
117
+ #### Scaling Databases
118
+
119
+ **Vertical scaling**: Bigger machine. Easy but has ceiling.
120
+ **Read replicas**: Route SELECT to replicas, writes to primary.
121
+ **Sharding (horizontal partitioning)**:
122
+
123
+ - Hash sharding: `user_id % N` — even distribution, hard to rebalance
124
+ - Range sharding: user_id 1-1M on shard 1 — easy range queries, hotspots risk
125
+ - Directory-based: lookup table maps key → shard — flexible, but lookup is overhead
126
+
127
+ **Denormalization**: For read-heavy systems, duplicate data to avoid joins.
128
+ **Rule**: Don't shard until you've maxed out read replicas.
129
+
130
+ ### Message Queues & Async Processing
131
+
132
+ ```
133
+ Producer → [Queue: Redis/RabbitMQ/Kafka] → Consumer Workers
134
+ ```
135
+
136
+ Use queues when:
137
+
138
+ - Operation takes > 200ms (email, PDF generation, ML inference)
139
+ - You need retry logic on failure
140
+ - You need to decouple services
141
+ - Traffic spikes need to be absorbed
142
+
143
+ **Kafka** = durability + replay + high throughput (events/analytics)
144
+ **Redis Queue** = simplicity + low latency (jobs/tasks)
145
+ **RabbitMQ** = complex routing + acknowledgements
146
+
147
+ ### Microservices vs Monolith
148
+
149
+ **Start with a monolith** unless you have > 10 engineers or proven scale need.
150
+
151
+ When to split into microservices:
152
+
153
+ - Independent deployment cycles needed
154
+ - Different scaling requirements per service
155
+ - Team autonomy (Conway's Law)
156
+ - Clear service boundaries (DDD bounded contexts)
157
+
158
+ **Rule**: A microservice should be able to be rewritten in 2 weeks by 2 engineers.
159
+
160
+ Service communication:
161
+
162
+ - **Sync (REST/gRPC)**: when caller needs immediate response
163
+ - **Async (events/queue)**: when caller can tolerate delay, or decoupling is needed
164
+ - **BFF / Server Actions**: for web apps, prefer typed client-server contracts (see below)
165
+
166
+ ---
167
+
168
+ ## Modern Stack Patterns (Serverless, Edge, Next.js)
169
+
170
+ ### Serverless & Edge Architecture
171
+
172
+ When deploying to serverless (Vercel Functions, AWS Lambda) or edge (Vercel Edge, Cloudflare Workers), the classical "App Server + Load Balancer" model changes:
173
+
174
+ **Cold Start Problem**:
175
+
176
+ - Serverless functions spin up from zero on first request — this can add 100–1000ms
177
+ - **Never** do heavy initialization at module level (DB connections, config loading, crypto keys)
178
+ - **Always** initialize lazily inside the handler, or use a connection pooling service
179
+
180
+ ```typescript
181
+ // [BAD] Wrong: Module-level initialization (runs on cold start, hangs the function)
182
+ const db = new DatabaseClient({ ... }) // top of file
183
+
184
+ // [GOOD] Correct: Lazy initialization with caching
185
+ let db: DatabaseClient | null = null
186
+ function getDb() {
187
+ if (!db) db = new DatabaseClient({ ... })
188
+ return db
189
+ }
190
+ ```
191
+
192
+ **DB Connection Pooling in Serverless**:
193
+
194
+ - Traditional in-process pools (pg-pool, knex) do NOT work in serverless — each invocation is ephemeral
195
+ - Use **Prisma Accelerate**, **PlanetScale**, **Neon** pooling, or **Supabase** — they handle pooling at the infrastructure level
196
+ - Rule: If deploying to Vercel/serverless, NEVER assume `max_connections` is managed by your app process
197
+
198
+ **Edge Functions limitations**:
199
+
200
+ - No Node.js APIs (no `fs`, no `crypto.randomBytes`, limited DNS)
201
+ - Latency must be < 50ms — no heavy DB queries
202
+ - Use edge for: auth token verification, A/B testing, geo-routing, lightweight transformations
203
+
204
+ ### BFF Pattern & Server Actions (Type-Safe Client-Server)
205
+
206
+ When building web apps, prefer typed client-server communication over generic REST endpoints:
207
+
208
+ **Option 1: Server Actions (Next.js App Router)**
209
+ For mutations that touch the database directly, skip the API route entirely:
210
+
211
+ ```typescript
212
+ // [GOOD] Server Action: No API route needed, fully type-safe
213
+ "use server"
214
+ export async function updateUser(id: string, data: UpdateUserInput) {
215
+ // Input validation (always!)
216
+ const validated = UpdateUserSchema.parse(data)
217
+
218
+ // Auth check (always before data access!)
219
+ const session = await getSession()
220
+ if (session.userId !== id && !session.isAdmin) {
221
+ throw new Error("Forbidden")
222
+ }
223
+
224
+ return db.users.update(id, validated)
225
+ }
226
+
227
+ // [BAD] Over-engineering: Don't create /api/users/[id] + fetch wrapper for simple mutations
228
+ ```
229
+
230
+ **Option 2: tRPC (Full-stack type safety)**
231
+ For complex APIs with many routes, use tRPC to get end-to-end type safety from DB to UI without code generation.
232
+
233
+ **Option 3: REST (When appropriate)**
234
+ When building a public API consumed by external clients or mobile apps — use REST with OpenAPI spec.
235
+
236
+ **Decision rule**:
237
+
238
+ - Internal web-to-DB mutation → **Server Action**
239
+ - Internal complex API → **tRPC**
240
+ - Public/mobile API → **REST + OpenAPI**
241
+
242
+ ### Domain-Driven Design (DDD) — Business Logic Isolation
243
+
244
+ **Rule**: NEVER write business logic inside API route handlers, Server Actions, or controllers. Always extract to dedicated services/use-cases.
245
+
246
+ ```
247
+ [FAIL] Wrong structure:
248
+ app/api/orders/route.ts ← contains: validation + auth + business logic + DB query
249
+
250
+ [PASS] Correct structure:
251
+ app/api/orders/route.ts ← only: parse request, call service, return response
252
+ src/services/order.service.ts ← all business logic, testable without HTTP context
253
+ src/repositories/order.repo.ts ← all DB queries
254
+ ```
255
+
256
+ Example:
257
+
258
+ ```typescript
259
+ // [BAD] Business logic in route (untestable, bloated)
260
+ export async function POST(req: Request) {
261
+ const data = await req.json()
262
+ if (data.quantity <= 0) return new Response("Invalid", { status: 400 })
263
+ const inventory = await db.inventory.findById(data.productId)
264
+ if (inventory.stock < data.quantity) return new Response("Out of stock", { status: 400 })
265
+ const total = inventory.price * data.quantity
266
+ // ... 40 more lines
267
+ }
268
+
269
+ // [GOOD] Thin route, fat service
270
+ export async function POST(req: Request) {
271
+ const data = await req.json()
272
+ const result = await orderService.createOrder(data)
273
+ return Response.json(result)
274
+ }
275
+
276
+ // orderService.createOrder() — pure function, fully unit-testable without HTTP
277
+ ```
278
+
279
+ ---
280
+
281
+ ## Scalability Design Patterns
282
+
283
+ ### CDN (Content Delivery Network)
284
+
285
+ - Serve static assets (JS, CSS, images) from CDN edge nodes
286
+ - Cache API responses that don't change per-user
287
+ - Reduce origin server load by 80%+
288
+
289
+ ### Rate Limiting
290
+
291
+ Always implement for public APIs:
292
+
293
+ ```
294
+ - Token bucket: smooth bursts, allows brief spikes
295
+ - Leaky bucket: strict rate, no bursts
296
+ - Fixed window: simple, vulnerable to boundary spikes
297
+ - Sliding window: most accurate, slightly more complex
298
+ ```
299
+
300
+ Store rate limit state in Redis (not in-process — it doesn't survive restarts).
301
+
302
+ ### Circuit Breaker
303
+
304
+ Prevent cascade failures:
305
+
306
+ ```
307
+ CLOSED (normal) → [failures > threshold] → OPEN (fail fast)
308
+ ↑ ↓
309
+ └────── [timeout] ← HALF-OPEN (test request) ──┘
310
+ ```
311
+
312
+ ### Database Connection Pooling
313
+
314
+ - **Traditional servers**: Use pg-pool, knex, Prisma connection pool
315
+ - **Serverless**: Use Prisma Accelerate, PlanetScale, Neon, or Supabase pooling — NOT in-process pools
316
+
317
+ ---
318
+
319
+ ## CAP Theorem in Practice
320
+
321
+ **You can only guarantee 2 of 3**: Consistency, Availability, Partition Tolerance
322
+
323
+ | System | Chooses | Example |
324
+ | -------- | --------- | --------- |
325
+ | Traditional SQL | CP | PostgreSQL |
326
+ | Distributed NoSQL | AP | DynamoDB, Cassandra |
327
+ | Cache | AP (tunable) | Redis with replication |
328
+
329
+ **For most apps**: Choose AP. Accept eventual consistency. Use optimistic locking for critical writes.
330
+
331
+ ---
332
+
333
+ ## Designing Data-Intensive Applications (DDIA) Patterns
334
+
335
+ Based on _Designing Data-Intensive Applications_ (Martin Kleppmann) and [ciembor/agent-rules-books](https://github.com/ciembor/agent-rules-books).
336
+
337
+ ### 1. The Dual-Write Problem & Transactional Outbox
338
+
339
+ **The Anti-Pattern**: Updating the database and sending a message to a broker (Kafka, RabbitMQ, SQS) in two separate operations. If one fails, the system enters an inconsistent state.
340
+
341
+ **The Solution**: Write the business entity AND an event record to an `outbox` table in the SAME database transaction:
342
+
343
+ ```sql
344
+ BEGIN TRANSACTION;
345
+ UPDATE orders SET status = 'PAID' WHERE id = 'ord_123';
346
+ INSERT INTO outbox_events (id, aggregate_type, aggregate_id, event_type, payload, created_at)
347
+ VALUES ('evt_456', 'Order', 'ord_123', 'OrderPaid', '{"amount": 99.00}', NOW());
348
+ COMMIT;
349
+ ```
350
+
351
+ A background process (polling worker or Debezium CDC) reads `outbox_events`, delivers them to the message broker, and marks them as published.
352
+
353
+ ### 2. Idempotency Invariant for Mutations
354
+
355
+ All write operations exposed over HTTP or queues MUST support deduplication:
356
+
357
+ - Accept an `Idempotency-Key` header (UUID or client-generated hash).
358
+ - Store key with status in Redis or DB with a TTL (e.g., 24 hours).
359
+ - If the key is already `COMPLETED`, return the cached response immediately without re-executing.
360
+ - If `IN_PROGRESS`, return HTTP `409 Conflict` or queue retry.
361
+
362
+ ### 3. Read-Your-Own-Writes Consistency
363
+
364
+ When using read replicas, replication lag (even 50ms) causes users to not see their own changes immediately after saving:
365
+
366
+ - **Rule**: Route user reads to the primary database for `N` seconds (e.g., 5s) following any mutation by that user.
367
+ - Route all other queries and background jobs to read replicas.
368
+
369
+ ---
370
+
371
+ ## Architecture Decision Template
372
+
373
+ When proposing any backend architecture, include:
374
+
375
+ ```markdown
376
+ ## System Design Decision
377
+
378
+ **Scale Target**: [X RPS, Y GB data, Z users]
379
+ **Deployment Model**: [Traditional servers | Serverless | Edge]
380
+ **CAP Choice**: [CP/AP] because [reason]
381
+ **Read/Write Ratio**: [X:Y]
382
+
383
+ ### Components
384
+ - **API Layer**: [REST/tRPC/Server Actions] — [why this choice]
385
+ - **Cache**: [Next.js native | Redis] for [what] with [TTL/tags strategy]
386
+ - **Database**: [SQL/NoSQL] - [pooling solution for serverless if applicable]
387
+ - **Async**: [Queue tech] for [what operations]
388
+
389
+ ### Business Logic Isolation
390
+ - Services: [list key service files]
391
+ - Repositories: [list key repo files]
392
+ - Routes/Actions: [thin handlers only]
393
+
394
+ ### Trade-offs Accepted
395
+ - [Trade-off 1]: [Why acceptable]
396
+ - [Trade-off 2]: [Why acceptable]
397
+
398
+ ### Scaling Path
399
+ 1. Now (MVP): [simple setup]
400
+ 2. At 10× load: [first scaling step]
401
+ 3. At 100× load: [next scaling step]
402
+ ```
403
+
404
+
405
+ ## Code Examples
406
+
407
+ See `EXAMPLES.md` for detailed code examples.
408
+
409
+ ## Validation Checklist
410
+
411
+ What to verify during the review phase before completing the task.
412
+
413
+ ## Common Mistakes
414
+
415
+ Anti-patterns and things to explicitly avoid. See `TROUBLESHOOTING.md`.
416
+
417
+ ## Integration Notes
418
+
419
+ How this skill interacts with other skills.
@@ -0,0 +1,19 @@
1
+ # system-design Troubleshooting & Common Mistakes
2
+
3
+ ## 1. Serverless Connection Exhaustion
4
+
5
+ - **Symptom**: "FATAL: remaining connection slots are reserved for non-replication superuser connections" under modest traffic.
6
+ - **Root Cause**: Serverless/Edge functions opening new DB connection pools per invoked instance.
7
+ - **Fix**: Use a connection pooler like PgBouncer or managed pooling (Supabase connection pool, AWS RDS Proxy, Prisma Accelerate).
8
+
9
+ ## 2. Cache Invalidation Drift
10
+
11
+ - **Symptom**: Users see stale, outdated data after making updates.
12
+ - **Root Cause**: Updates to database do not invalidate related cache keys, or TTLs are set to infinite.
13
+ - **Fix**: Invalidate cache keys explicitly on write in the same transactional flow, and always set defensive TTLs.
14
+
15
+ ## 3. Lack of Rate Limiting and Backpressure
16
+
17
+ - **Symptom**: Backend crashes or slows to a crawl during traffic spikes or bot scraping.
18
+ - **Root Cause**: Unthrottled public endpoints without token-bucket or sliding-window rate limiting.
19
+ - **Fix**: Add rate-limiting middleware (Redis-backed sliding window) at the API gateway / Edge layer.
@@ -0,0 +1,12 @@
1
+ {
2
+ "$schema": "http://json-schema.org/draft-07/schema#",
3
+ "type": "object",
4
+ "properties": {
5
+ "rules_followed": {
6
+ "type": "boolean"
7
+ }
8
+ },
9
+ "required": [
10
+ "rules_followed"
11
+ ]
12
+ }
@@ -0,0 +1,13 @@
1
+ name: system-design
2
+ description: >
3
+ Architecture and system design skill based on donnemartin's System Design Primer.
4
+ Teaches scalable architecture thinking: load balancers, caching, DB partitioning,
5
+ microservices, CAP theorem, and trade-off analysis before writing backend code.
6
+ tags:
7
+ - architecture
8
+ - backend
9
+ - scalability
10
+ - database
11
+ - microservices
12
+ version: 1.0.0
13
+ source: https://github.com/donnemartin/system-design-primer
@@ -0,0 +1,112 @@
1
+ # System Design — Patterns & Principles
2
+
3
+ ## Architecture Patterns
4
+
5
+ ### Monolith (Start Here)
6
+
7
+ - **When**: MVP, small team, < 100K users
8
+ - **Structure**: Modular monolith with clear boundaries
9
+ - **Rule**: You can always extract microservices later. You can't easily merge them back.
10
+
11
+ ### Microservices
12
+
13
+ - **When**: Team > 10 engineers, independent deployment needed
14
+ - **Communication**: REST (sync), Message Queue (async)
15
+ - **Data**: Each service owns its database
16
+ - **Pitfalls**: Network complexity, distributed transactions, debugging difficulty
17
+
18
+ ### Event-Driven
19
+
20
+ - **When**: Loose coupling between services, async processing
21
+ - **Patterns**: Event Sourcing, CQRS, Pub/Sub
22
+ - **Tools**: Kafka, RabbitMQ, AWS SQS, Redis Streams
23
+
24
+ ## Scalability
25
+
26
+ ### Horizontal vs Vertical
27
+
28
+ - **Vertical first** — upgrade your server before distributing
29
+ - **Horizontal when** — you hit single-machine limits or need redundancy
30
+
31
+ ### Database Scaling
32
+
33
+ 1. **Indexes** — most common fix for slow queries
34
+ 2. **Read replicas** — for read-heavy workloads
35
+ 3. **Connection pooling** — PgBouncer, connection limits
36
+ 4. **Caching** — Redis for hot data
37
+ 5. **Sharding** — last resort, adds massive complexity
38
+
39
+ ### Caching Layers
40
+
41
+ ```
42
+ Client Cache (browser) → CDN → API Cache (Redis) → Database
43
+ ```
44
+
45
+ | Strategy | Description |
46
+ | --- | --- |
47
+ | Cache-Aside | App checks cache first, fetches from DB on miss |
48
+ | Write-Through | App writes to cache AND DB simultaneously |
49
+ | Write-Behind | App writes to cache, async write to DB |
50
+ | TTL-based | Set expiry, accept stale data |
51
+
52
+ ## Load Balancing
53
+
54
+ - **Round Robin** — simple, default
55
+ - **Least Connections** — for varying request duration
56
+ - **IP Hash** — for sticky sessions (avoid if possible)
57
+ - **Health checks** — remove unhealthy instances
58
+
59
+ ## API Design
60
+
61
+ ### REST Conventions
62
+
63
+ ```
64
+ GET /users → List users
65
+ GET /users/:id → Get user
66
+ POST /users → Create user
67
+ PUT /users/:id → Full update
68
+ PATCH /users/:id → Partial update
69
+ DELETE /users/:id → Delete user
70
+ ```
71
+
72
+ ### Pagination
73
+
74
+ - Cursor-based for real-time data (recommended)
75
+ - Offset-based for static data
76
+
77
+ ### Versioning
78
+
79
+ - URL-based (`/v1/`, `/v2/`) — simplest
80
+ - Header-based — more flexible
81
+
82
+ ## Reliability
83
+
84
+ - **Circuit breaker** — stop calling failing services
85
+ - **Retry with exponential backoff** — for transient failures
86
+ - **Timeout** — every external call needs a timeout
87
+ - **Health checks** — `/health` endpoint for load balancers
88
+ - **Graceful degradation** — work with reduced functionality
89
+
90
+ ## Data Storage
91
+
92
+ | Use Case | Technology |
93
+ | --- | --- |
94
+ | Relational data, ACID | PostgreSQL |
95
+ | Key-value, caching | Redis |
96
+ | Full-text search | Elasticsearch, Meilisearch |
97
+ | Document store | MongoDB (if truly schemaless) |
98
+ | Time series | TimescaleDB, InfluxDB |
99
+ | Blob storage | S3, R2 |
100
+ | Queue | Redis Streams, RabbitMQ, SQS |
101
+
102
+ ## Decision Framework
103
+
104
+ Before choosing an architecture:
105
+
106
+ 1. What's the expected load? (users, requests/sec)
107
+ 2. What's the team size?
108
+ 3. What's the timeline?
109
+ 4. What are the consistency requirements?
110
+ 5. What's the budget?
111
+
112
+ **Default answer**: Start with a monolith, PostgreSQL, Redis cache. Extract services only when you have data showing you need to.
@@ -0,0 +1,71 @@
1
+ # Testing Examples — Anti-patterns vs ContextOS Standard
2
+
3
+ ## Example 1: React Component Testing
4
+
5
+ ### Anti-pattern: Anti-pattern (Brittle query & implementation coupling)
6
+
7
+ ```typescript
8
+ // BAD: querying by CSS class or test-id and testing internal state
9
+ test('submits form', async () => {
10
+ const wrapper = render(<LoginForm />);
11
+ const input = wrapper.container.querySelector('.email-input');
12
+ fireEvent.change(input, { target: { value: 'user@test.com' } });
13
+ fireEvent.click(wrapper.container.querySelector('#submit-btn'));
14
+ expect(wrapper.state().isSubmitted).toBe(true); // Brittle!
15
+ });
16
+ ```
17
+
18
+ ### Best practice: ContextOS Standard (User-centric role queries & userEvent)
19
+
20
+ ```typescript
21
+ // GOOD: user-facing roles, userEvent, async wait
22
+ import { render, screen } from '@testing-library/react';
23
+ import userEvent from '@testing-library/user-event';
24
+ import { LoginForm } from './LoginForm';
25
+
26
+ test('submits form with valid user credentials', async () => {
27
+ const user = userEvent.setup();
28
+ const onSubmit = vi.fn();
29
+ render(<LoginForm onSubmit={onSubmit} />);
30
+
31
+ await user.type(screen.getByLabelText(/email address/i), 'user@test.com');
32
+ await user.type(screen.getByLabelText(/password/i), 'SecureP@ss123!');
33
+ await user.click(screen.getByRole('button', { name: /sign in/i }));
34
+
35
+ expect(onSubmit).toHaveBeenCalledWith({
36
+ email: 'user@test.com',
37
+ password: 'SecureP@ss123!'
38
+ });
39
+ expect(screen.queryByRole('alert')).not.toBeInTheDocument();
40
+ });
41
+ ```
42
+
43
+ ---
44
+
45
+ ## Example 2: API Mocking with MSW (Mock Service Worker)
46
+
47
+ ### Anti-pattern: Anti-pattern (Hardcoded global fetch monkey-patching)
48
+
49
+ ```typescript
50
+ // BAD: globally overwriting fetch breaks other tests and hides actual contract
51
+ global.fetch = vi.fn().mockResolvedValue({
52
+ json: () => Promise.resolve({ data: 'ok' })
53
+ });
54
+ ```
55
+
56
+ ### Best practice: ContextOS Standard (Network boundary mocking)
57
+
58
+ ```typescript
59
+ // GOOD: declarative MSW network handler
60
+ import { http, HttpResponse } from 'msw';
61
+ import { setupServer } from 'msw/node';
62
+
63
+ export const server = setupServer(
64
+ http.get('/api/users/:id', ({ params }) => {
65
+ if (params.id === '404') {
66
+ return new HttpResponse(null, { status: 404 });
67
+ }
68
+ return HttpResponse.json({ id: params.id, name: 'Alice Smith' });
69
+ })
70
+ );
71
+ ```