A curated Skill / Prompt Library for reusable agent workflows, frontend engineering guidance, security reviews, testing flows, framework-specific implementation patterns, and standalone prompts.
This repository is documentation-only. It does not contain a runnable application; instead, it organizes skills as portable instruction packs that developers and coding agents can browse, reuse, install, or adapt into other projects.
Skills live under skills/. Each skill folder contains a SKILL.md definition and, where useful, supporting rule files, references, scripts, or assets. Standalone reusable prompts live under prompts/. The root catalog helps you discover the right asset quickly, while each skill-level README.md provides a short documentation page with source, purpose, features, use cases, and included files.
For a capability-oriented overview, see CAPABILITY_GUIDE.md.
Use this library when you want repeatable agent behavior for:
- React, Next.js, Tailwind, and frontend implementation work
- Web application testing and UI verification
- Security audits and secure coding workflows
- React Native domain guidance
- Skill discovery, context setup, and prompt reuse
.
├── README.md
├── reference.md
├── prompts/
│ └── <prompt-name>.md
└── skills/
├── <skill-name>/
│ ├── README.md
│ ├── SKILL.md
│ └── optional supporting files
└── ...
Common supporting files include:
rules/for granular best-practice documents.references/for deeper examples, images, or implementation notes.AGENTS.mdfor compiled agent-facing rule sets.scripts/for helper checks or scans.assets/for test helpers and reusable fixtures.
Use this table when you are choosing the best skill or prompt for a task.
| Situation | Use | Type | Why |
|---|---|---|---|
| Reducing token/context waste during agent work | AGENT_CONTEXT_EFFICIENCY.md | Prompt | Portable rules for targeted search, compact working memory, concise tool output, and context checkpoints. |
| Starting work in an unfamiliar repo | context-engineering | Skill | Helps pack project context, rules, constraints, and task state before coding. |
| Implementing production Next.js features | NEXTJS_PRODUCTION_ENGINEER.md | Prompt | Best default prompt for App Router, UI quality, secure defaults, and performance basics. |
| Building or polishing user-facing UI | frontend-ui-engineering | Skill | Improves layout, accessibility, responsive behavior, state, and interaction polish. |
| Creating a distinctive visual direction | frontend-design | Skill | Useful when the UI needs stronger visual design, not just correct implementation. |
| Reviewing React performance or rendering | vercel-react-best-practices | Skill | Broad React/Next.js performance rule pack for bundles, rendering, server work, and hydration. |
| Reviewing component architecture | vercel-composition-patterns | Skill | Helps avoid boolean prop sprawl and design better compound/component APIs. |
| Reviewing a PR or local diff | code-review-excellence | Skill | Structured review process for correctness, tests, security, performance, and feedback quality. |
| Doing a repo-wide engineering review | ENGINEERING_REVIEW_CHECKLIST.md | Prompt | Looks beyond code style into architecture, reliability, maintainability, tests, and operations. |
| Debugging a failing feature or test | SYSTEMATIC_DEBUGGING.md | Prompt | Forces reproduction, localization, hypotheses, root cause, narrow fix, and verification. |
| Planning test coverage | TEST_STRATEGY.md | Prompt | Chooses unit, integration, component, E2E, and contract tests based on risk. |
| Auditing Next.js security with CMS/commerce | NEXTJS_CMS_COMMERCE_SECURITY_AUDIT.md | Prompt | Deep audit flow for Strapi, Contentful, WordPress, WooCommerce, webhooks, rich content, and checkout/order risks. |
| Checking broad web security basics | owasp-security | Skill | Covers OWASP Top 10 risks and secure coding patterns. |
| Checking Next.js-specific security | security-nextjs | Skill | Focused checks for env exposure, Server Actions, middleware, API routes, and headers. |
| Validating a local web app in browser | webapp-testing | Skill | Playwright-style browser verification, screenshots, console logs, and UI debugging. |
| Documenting a major technical decision | ARCHITECTURE_DECISION_RECORD.md | Prompt | Captures decision context, alternatives, tradeoffs, consequences, and revisit triggers. |
| Building a Tailwind design system | tailwind-design-system | Skill | Tailwind v4 tokens, theming, component variants, and design-system conventions. |
| Working on React Native performance | react-native-best-practices | Skill | Mobile FPS, TTI, memory, bundle, native, and animation performance guidance. |
| Looking for a missing capability | find-skills | Skill | Discovers external skills when this library does not cover a workflow. |
Standalone prompts are reusable, copyable workflows that do not need the full skill folder structure.
| Prompt | Focus |
|---|---|
| AGENT_CONTEXT_EFFICIENCY.md | Portable prompt for reducing token usage and context bloat in Codex, Copilot, Cursor, Antigravity, and similar coding agents. |
| DEPLOYMENT_CICD_REUSE.md | Docker + VM deployment workflow with GitHub Actions, health checks, rollback flow, and reusable templates. |
| ARCHITECTURE_DECISION_RECORD.md | ADR prompt/template for documenting significant technical choices, tradeoffs, consequences, and revisit triggers. |
| ENGINEERING_REVIEW_CHECKLIST.md | Senior engineering review prompt for maintainability, architecture, reliability, testing, observability, and long-term cost. |
| FETCH_PATTERN.md | Server-first data fetching, ISR/revalidation, shared layout fetches, typed helpers, and metadata mapping. |
| NEXTJS_CMS_COMMERCE_SECURITY_AUDIT.md | Repo-wide Next.js security audit prompt for Strapi, Contentful, WordPress, WooCommerce, webhooks, rich content, and commerce flows. |
| NEXTJS_PRODUCTION_ENGINEER.md | Consolidated Next.js production implementation prompt covering App Router, frontend quality, accessibility, secure defaults, and performance basics. |
| ROBOTS_SITEMAP_PATTERN.md | App Router robots.txt and sitemap pattern with routes, dependencies, and a copyable prompt. |
| SYSTEMATIC_DEBUGGING.md | Debugging prompt that forces reproduction, localization, hypotheses, root-cause fixes, and verification. |
| TEST_STRATEGY.md | Risk-based test planning prompt for choosing unit, integration, component, E2E, and contract coverage. |
| mobile-security-coder.md | Mobile security prompt for secure storage, WebView hardening, and mobile auth flows. |
| Skill | Description | Source |
|---|---|---|
| animation-best-practices | Practical CSS and UI animation guidance for smooth, accessible interactions. | npx skills add https://github.com/millionco/react-doctor --skill animation-best-practices |
| component-quality-check | Review checklist for accessible, composable React/Tailwind components. | Not listed in reference.md. |
| frontend-design | High-quality visual design guidance for distinctive production web interfaces. | npx skills add https://github.com/anthropics/skills --skill frontend-design |
| frontend-implementation | Next.js frontend implementation workflow with RSC boundaries and quality gates. | Not listed in reference.md. |
| frontend-ui-engineering | Production UI engineering guidance for layout, accessibility, state, and polish. | npx skills add https://github.com/addyosmani/agent-skills --skill frontend-ui-engineering |
| shadcn | Project-aware shadcn/ui component, registry, CLI, preset, theming, and composition guidance. | npx skills add shadcn/ui |
| tailwind-design-system | Tailwind CSS v4 design-system patterns for tokens, theming, variants, and responsive UI. | Not listed in reference.md. |
| Skill | Description | Source |
|---|---|---|
| frontend-react-best-practices | React performance and composition rules covering rendering, hooks, bundles, and client patterns. | npx skills add https://github.com/sergiodxa/agent-skills --skill frontend-react-best-practices |
| next-best-practices | Modular Next.js best-practice references for App Router, RSC, async APIs, metadata, images, and deployment concerns. | Not listed in reference.md. |
| nextjs-app-router-patterns | Next.js 14+ App Router patterns for Server Components, streaming, routes, and data fetching. | npx skills add https://github.com/wshobson/agents --skill nextjs-app-router-patterns |
| react-best-practices | Agent-optimized React performance rules across async work, bundles, server behavior, rendering, and JavaScript patterns. | See reference.md for multiple source commands. |
| vercel-composition-patterns | Scalable React composition rules for compound components, explicit variants, and provider-driven state. | Not listed in reference.md. |
| vercel-react-best-practices | Vercel-flavored React and Next.js performance rules with a large compiled AGENTS.md. |
npx skills add https://github.com/vercel-labs/agent-skills --skill vercel-react-best-practices |
| Skill | Description | Source |
|---|---|---|
| api-and-data-patterns | Next.js App Router data and API layering guidance with typed responses and server/client separation. | Not listed in reference.md. |
| fetch-pattern | Canonical server-first fetch, ISR, metadata, and API integration rules. | Not listed in reference.md. |
| Skill | Description | Source |
|---|---|---|
| owasp-security | OWASP Top 10 secure coding patterns for authentication, access control, injection, SSRF, and configuration risks. | npx skills add https://github.com/hoodini/ai-agents-skills --skill owasp-security |
| security-nextjs | Next.js-specific security audit patterns for environment variables, Server Actions, middleware, API routes, and headers. | npx skills add https://github.com/igorwarzocha/opencode-workflows --skill security-nextjs |
| Skill | Description | Source |
|---|---|---|
| react-native-best-practices | React Native performance guidance for FPS, TTI, memory, native bottlenecks, bundles, and animations. | npx skills add https://github.com/callstackincubator/agent-skills --skill react-native-best-practices |
| react-native | Margelo React Native bundle for API design, Nitro Modules, Nitro networking, MMKV, and VisionCamera v5. | npx skills add margelo/react-native-skills |
| webapp-testing | Playwright-oriented workflow for testing local web apps, inspecting browser behavior, and capturing screenshots. | See reference.md for multiple source commands. |
| Skill | Description | Source |
|---|---|---|
| code-review-excellence | Systematic code review skill for correctness, maintainability, security, performance, tests, and constructive feedback. | npx skills add https://github.com/wshobson/agents --skill code-review-excellence |
| context-engineering | Agent context setup, context packing, rule-file strategy, and session hygiene. | npx skills add https://github.com/addyosmani/agent-skills --skill context-engineering |
| find-skills | Workflow for discovering, evaluating, and installing external agent skills with the Skills CLI. | npx skills add https://github.com/vercel-labs/skills --skill find-skills |
Use the source commands in reference.md or in each skill README:
npx skills add <repo-url> --skill <skill-name>Some skills in this repository are local/internal and do not currently have a source command in reference.md.
Start with the index above, then open the skill README for a quick overview. Read SKILL.md when you need the exact activation rules, workflow, or agent instructions.
Use prompts/ for lightweight reusable workflows that do not need supporting files. Prompts are useful for role setup, one-off implementation patterns, and repeatable review checklists.
Copy or adapt skill folders into projects that support agent skills. Keep supporting files with the skill when they are referenced by SKILL.md, especially rules/, references/, assets/, and scripts/.
- Create a new folder under
skills/using kebab-case. - Add a
SKILL.mdwith frontmatter, trigger guidance, and workflow instructions. - Add a skill-level
README.mdusing the convention below. - Add supporting references, rules, scripts, or assets only when they make the skill easier to apply.
- Update this root README and
reference.mdwith the new skill and source.
Each skill README should use this structure:
# <Skill Name>
## Download Source
<original download/install command or GitHub link from reference.md>
## What This Skill Does
...
## Features
...
## Typical Use Cases
...
## Files Included
...
## Notes
...Naming and organization rules:
- Use kebab-case folder names, matching the skill name where possible.
- Keep
SKILL.mdas the canonical agent instruction file. - Keep standalone prompts in
prompts/as one Markdown file per prompt. - Put detailed rule documents in
rules/. - Put extended examples, images, and background material in
references/. - Keep helper scripts in
scripts/and reusable browser/test files inassets/. - Prefer concise, specific skill documentation over generic descriptions.
reference.mdtracks original download/install commands collected for this library.