███████╗██╗ ██╗██╗██╗ ██╗ ██████╗ █████╗ ███╗ ██╗██╗ ██╗
██╔════╝██║ ██╔╝██║██║ ██║ ██╔══██╗██╔══██╗████╗ ██║██║ ██╔╝
███████╗█████╔╝ ██║██║ ██║ ██████╔╝███████║██╔██╗ ██║█████╔╝
╚════██║██╔═██╗ ██║██║ ██║ ██╔══██╗██╔══██║██║╚██╗██║██╔═██╗
███████║██║ ██╗██║███████╗███████╗ ██║ ██║██║ ██║██║ ╚████║██║ ██╗
╚══════╝╚═╝ ╚═╝╚═╝╚══════╝╚══════╝ ╚═╝ ╚═╝╚═╝ ╚═╝╚═╝ ╚═══╝╚═╝ ╚═╝
Agent Skills 排行榜 · 关键词 + 语义搜索
| # | Skill | 仓库 | 描述 | 安装量 |
|---|---|---|---|---|
| 701 | deployment-automation | supercent-io/skills-template |
Deployment Automation When to use this skill New Projects : Set up automated deployment from scratch Manual Deployment Improvement : Automate repetitive manual tasks Multi-Environment : Separate dev, staging, and production environments Scaling : Introduce Kubernetes to handle traffic growth Instructions Step 1: Docker Containerization Package the application as a Docker image. Dockerfile (Node.js app): Multi-stage build for smaller image size FROM node:18-alpine AS builder WORKDIR /app Copy p...
|
11.2K |
| 702 | testing-strategies | supercent-io/skills-template |
Testing Strategies When to use this skill New project : define a testing strategy Quality issues : bugs happen frequently Before refactoring : build a safety net CI/CD setup : automated tests Instructions Step 1: Understand the Test Pyramid /\ /E2E\ ← few (slow, expensive) /______\ / \ /Integration\ ← medium /____________\ / \ / Unit Tests \ ← many (fast, inexpensive) /________________\ Ratio guide : Unit: 70% Integration: 20% E2E: 10% Step 2: Unit testing st...
|
11.2K |
| 703 | responsive-design | supercent-io/skills-template |
Responsive Design When to use this skill New website/app : Layout design for combined mobile-desktop use Legacy improvement : Converting fixed layouts to responsive Performance optimization : Image optimization per device Multiple screens : Tablet, desktop, and large screen support Instructions Step 1: Mobile-First Approach Design from small screens and progressively expand. Example : /* Default: Mobile (320px~) */ .container { padding : 1 rem ; font-size : 14 px ; } .grid { display : grid ; gri...
|
11.2K |
| 704 | youtube-thumbnail-design | skillssh/skills |
YouTube Thumbnail Design Create high-CTR YouTube thumbnails with AI image generation via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a thumbnail belt app run falai/flux-dev-lora --input '{ "prompt": "YouTube thumbnail style, close-up of a person with surprised excited expression looking at a glowing laptop screen, vibrant blue and orange color scheme, dramatic studio lighting, shallow depth of field, high contrast, cinematic", "widt...
|
11.2K |
| 705 | image-to-video | skillssh/skills |
Image-to-Video — Pro Pack on RunComfy runcomfy.com · HappyHorse I2V · Wan 2.7 · Seedance 2.0 Pro · GitHub Image-to-video, intent-routed. This skill doesn't lock you to one model — it picks the right i2v model in the RunComfy catalog based on what the user actually wants: portrait animation, custom-voiceover lip-sync, or multi-modal composition. npx skills add agentspace-so/runcomfy-skills --skill image-to-video -g Pick the right model for the user's intent User intent Model Why Animate a portrai...
|
11.2K |
| 706 | storyboard-creation | skillssh/skills |
Storyboard Creation Create visual storyboards with AI image generation via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a storyboard panel belt app run falai/flux-dev-lora --input '{ "prompt": "storyboard panel, wide establishing shot of a modern city skyline at sunset, cinematic composition, slightly desaturated colors, film still style, 16:9 aspect ratio", "width": 1248, "height": 832 }' Stitch panels into a board belt app run inf...
|
11.2K |
| 707 | git-workflow | supercent-io/skills-template |
Git Workflow When to use this skill Creating meaningful commit messages Managing branches Merging code Resolving conflicts Collaborating with team Git best practices Instructions Step 1: Branch management Create feature branch : Create and switch to new branch git checkout -b feature/feature-name Or create from specific commit git checkout -b feature/feature-name < commit-hash > Naming conventions : feature/description : New features bugfix/description : Bug fixes hotfix/description : Urgent f...
|
11.1K |
| 708 | copilot-coding-agent | supercent-io/skills-template |
GitHub Copilot Coding Agent — Issue → Draft PR automation If you add the ai-copilot label to an issue, GitHub Actions automatically assigns it to Copilot, and Copilot creates a branch → writes code → opens a Draft PR. When to use this skill When PMs/designers create issues and Copilot starts implementation without a developer When offloading backlog issues (refactors/docs/tests) to Copilot When delegating follow-up work created by Vibe Kanban / Conductor to Copilot When automating pipelines like...
|
11.1K |
| 709 | product-photography | skillssh/skills |
Product Photography Create professional product images with AI via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Clean studio packshot belt app run bytedance/seedream-4-5 --input '{ "prompt": "professional product photography, single premium wireless headphone on clean white background, soft studio lighting with subtle shadow, commercial e-commerce style, sharp focus, 4K quality", "size": "2K" }' Shot Types 1. Hero Shot (Primary Image) The mai...
|
11.1K |
| 710 | competitor-teardown | skillssh/skills |
Competitor Teardown Structured competitive analysis with research and screenshots via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Research competitor landscape belt app run tavily/search-assistant --input '{ "query": "top project management tools comparison 2024 market share" }' Screenshot competitor's website belt app run infsh/agent-browser --input '{ "url": "https://competitor.com", "action": "screenshot" }' Teardown Framework The 7-Laye...
|
11.1K |
| 711 | video-ad-specs | skillssh/skills |
Video Ad Specs Create platform-specific video ads via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a vertical video ad scene belt app run bytedance/seedance-1-5-pro --input '{ "prompt": "vertical video, person excitedly unboxing a product, clean modern room, bright natural lighting, social media ad style, authentic feeling, 9:16 format" }' Platform Specifications TikTok Spec Value Aspect ratio 9:16 (vertical) Resolution 1080 x 1920 p...
|
11.1K |
| 712 | character-design-sheet | skillssh/skills |
Character Design Sheet Create consistent characters across multiple AI-generated images via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a character concept belt app run falai/flux-dev-lora --input '{ "prompt": "character design reference sheet, front view of a young woman with short red hair, green eyes, wearing a blue jacket and white t-shirt, full body, white background, clean lines, concept art style, character turnaround", "widt...
|
11.1K |
| 713 | app-store-screenshots | skillssh/skills |
App Store Screenshots Create app store screenshots and preview videos via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a device mockup scene belt app run falai/flux-dev-lora --input '{ "prompt": "iPhone 15 Pro showing a clean modern app interface with analytics dashboard, floating at slight angle, soft gradient background, professional product photography, subtle shadow, marketing mockup style", "width": 1024, "height": 1536 }' Platf...
|
11.1K |
| 714 | product-hunt-launch | skillssh/skills |
Product Hunt Launch Optimize your Product Hunt launch with research and visuals via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate gallery hero image belt app run falai/flux-dev-lora --input '{ "prompt": "clean product showcase, modern SaaS dashboard interface on laptop screen, floating UI elements around it, soft gradient background from blue to purple, professional marketing hero shot, minimal clean design", "width": 1248, "height": ...
|
11.1K |
| 715 | landing-page-design | inference-skills/skills |
Landing Page Design Design high-converting landing pages with AI-generated visuals via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a hero image belt app run falai/flux-dev-lora --input '{ "prompt": "professional person smiling while using a laptop showing a clean dashboard interface, bright modern office, natural lighting, warm and productive atmosphere, lifestyle marketing photography", "width": 1248, "height": 832 }' Research com...
|
11.1K |
| 716 | unocss | antfu/skills |
UnoCSS is an instant atomic CSS engine designed to be flexible and extensible. The core is un-opinionated - all CSS utilities are provided via presets. It's a superset of Tailwind CSS, so you can reuse your Tailwind knowledge for basic syntax usage. Important: Before writing UnoCSS code, agents should check for `uno.config.*` or `unocss.config.*` files in the project root to understand what presets, rules, and shortcuts are available. If the project setup is unclear, avoid using attributify mod...
|
11.1K |
| 717 | file-organization | supercent-io/skills-template |
Project File Organization When to use this skill New Projects : Initial folder structure design Project Growth : Refactoring when complexity increases Team Standardization : Establish consistent structure Instructions Step 1: React/Next.js Project Structure src/ ├── app/ Next.js 13+ App Router │ ├── (auth)/ Route groups │ │ ├── login/ │ │ └── signup/ │ ├── (dashboard)/ │ │ ├── layout.tsx │ │ ├── page.tsx │ │ └── settings/ │ ├── api/ ...
|
11K |
| 718 | monitoring-observability | supercent-io/skills-template |
Monitoring & Observability When to use this skill Before Production Deployment : Essential monitoring system setup Performance Issues : Identify bottlenecks Incident Response : Quick root cause identification SLA Compliance : Track availability/response times Instructions Step 1: Metrics Collection (Prometheus) Application Instrumentation (Node.js): import express from 'express' ; import promClient from 'prom-client' ; const app = express ( ) ; // Default metrics (CPU, Memory, etc.) promClient ....
|
11K |
| 719 | storyboard-creation | inference-skills/skills |
Storyboard Creation Create visual storyboards with AI image generation via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a storyboard panel belt app run falai/flux-dev-lora --input '{ "prompt": "storyboard panel, wide establishing shot of a modern city skyline at sunset, cinematic composition, slightly desaturated colors, film still style, 16:9 aspect ratio", "width": 1248, "height": 832 }' Stitch panels into a board belt app run inf...
|
11K |
| 720 | youtube-thumbnail-design | inference-skills/skills |
YouTube Thumbnail Design Create high-CTR YouTube thumbnails with AI image generation via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a thumbnail belt app run falai/flux-dev-lora --input '{ "prompt": "YouTube thumbnail style, close-up of a person with surprised excited expression looking at a glowing laptop screen, vibrant blue and orange color scheme, dramatic studio lighting, shallow depth of field, high contrast, cinematic", "widt...
|
11K |
| 721 | product-photography | inference-skills/skills |
Product Photography Create professional product images with AI via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Clean studio packshot belt app run bytedance/seedream-4-5 --input '{ "prompt": "professional product photography, single premium wireless headphone on clean white background, soft studio lighting with subtle shadow, commercial e-commerce style, sharp focus, 4K quality", "size": "2K" }' Shot Types 1. Hero Shot (Primary Image) The mai...
|
11K |
| 722 | codebase-search | supercent-io/skills-template |
Codebase Search When to use this skill Finding specific functions or classes Tracing function calls and dependencies Understanding code structure and architecture Finding usage examples Identifying code patterns Locating bugs or issues Code archaeology (understanding legacy code) Impact analysis before changes Instructions Step 1: Understand what you're looking for Feature implementation : Where is feature X implemented? How does feature Y work? What files are involved in feature Z? Bug location...
|
10.9K |
| 723 | changelog-maintenance | supercent-io/skills-template |
Changelog Maintenance When to use this skill Before release : organize changes before shipping a version Continuous : update whenever significant changes occur Migration guide : document breaking changes Instructions Step 1: Keep a Changelog format CHANGELOG.md : Changelog All notable changes to this project will be documented in this file. The format is based on [ Keep a Changelog ]( https://keepachangelog.com/en/1.0.0/ ) , and this project adheres to [ Semantic Versioning ]( https://semver.or...
|
10.9K |
| 724 | competitor-teardown | inference-skills/skills |
Competitor Teardown Structured competitive analysis with research and screenshots via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Research competitor landscape belt app run tavily/search-assistant --input '{ "query": "top project management tools comparison 2024 market share" }' Screenshot competitor's website belt app run infsh/agent-browser --input '{ "url": "https://competitor.com", "action": "screenshot" }' Teardown Framework The 7-Laye...
|
10.9K |
| 725 | app-store-screenshots | inference-skills/skills |
App Store Screenshots Create app store screenshots and preview videos via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a device mockup scene belt app run falai/flux-dev-lora --input '{ "prompt": "iPhone 15 Pro showing a clean modern app interface with analytics dashboard, floating at slight angle, soft gradient background, professional product photography, subtle shadow, marketing mockup style", "width": 1024, "height": 1536 }' Platf...
|
10.9K |
| 726 | image-to-video | inference-skills/skills |
Image-to-Video — Pro Pack on RunComfy runcomfy.com · HappyHorse I2V · Wan 2.7 · Seedance 2.0 Pro · GitHub Image-to-video, intent-routed. This skill doesn't lock you to one model — it picks the right i2v model in the RunComfy catalog based on what the user actually wants: portrait animation, custom-voiceover lip-sync, or multi-modal composition. npx skills add agentspace-so/runcomfy-skills --skill image-to-video -g Pick the right model for the user's intent User intent Model Why Animate a portrai...
|
10.9K |
| 727 | character-design-sheet | inference-skills/skills |
Character Design Sheet Create consistent characters across multiple AI-generated images via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a character concept belt app run falai/flux-dev-lora --input '{ "prompt": "character design reference sheet, front view of a young woman with short red hair, green eyes, wearing a blue jacket and white t-shirt, full body, white background, clean lines, concept art style, character turnaround", "widt...
|
10.9K |
| 728 | video-ad-specs | inference-skills/skills |
Video Ad Specs Create platform-specific video ads via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate a vertical video ad scene belt app run bytedance/seedance-1-5-pro --input '{ "prompt": "vertical video, person excitedly unboxing a product, clean modern room, bright natural lighting, social media ad style, authentic feeling, 9:16 format" }' Platform Specifications TikTok Spec Value Aspect ratio 9:16 (vertical) Resolution 1080 x 1920 p...
|
10.9K |
| 729 | product-hunt-launch | inference-skills/skills |
Product Hunt Launch Optimize your Product Hunt launch with research and visuals via inference.sh CLI. Quick Start Requires inference.sh CLI ( belt ). Install instructions belt login Generate gallery hero image belt app run falai/flux-dev-lora --input '{ "prompt": "clean product showcase, modern SaaS dashboard interface on laptop screen, floating UI elements around it, soft gradient background from blue to purple, professional marketing hero shot, minimal clean design", "width": 1248, "height": ...
|
10.9K |
| 730 | sql-optimization | github/awesome-copilot |
SQL Performance Optimization Assistant Expert SQL performance optimization for ${selection} (or entire project if no selection). Focus on universal SQL optimization techniques that work across MySQL, PostgreSQL, SQL Server, Oracle, and other SQL databases. 🎯 Core Optimization Areas Query Performance Analysis -- ❌ BAD: Inefficient query patterns SELECT * FROM orders o WHERE YEAR ( o . created_at ) = 2024 AND o . customer_id IN ( SELECT c . id FROM customers c WHERE c . status = 'active' ) ; -- ✅ ...
|
10.9K |
| 731 | debugging | supercent-io/skills-template |
Debugging When to use this skill Encountering runtime errors or exceptions Code produces unexpected output or behavior Performance degradation or memory issues Intermittent or hard-to-reproduce bugs Understanding unfamiliar error messages Post-incident analysis and prevention Instructions Step 1: Gather Information Collect all relevant context about the issue: Error details : Full error message and stack trace Error type (syntax, runtime, logic, etc.) When did it start occurring? Is it reproduci...
|
10.8K |
| 732 | swift-concurrency | avdlee/swift-concurrency-agent-skill |
Swift Concurrency Fast Path Before proposing a fix: Analyze Package.swift or .pbxproj to determine Swift language mode, strict concurrency level, default isolation, and upcoming features. Do this always, not only for migration work. Capture the exact diagnostic and offending symbol. Determine the isolation boundary: @MainActor , custom actor, actor instance isolation, or nonisolated . Confirm whether the code is UI-bound or intended to run off the main actor. Project settings that change concurr...
|
10.8K |
| 733 | pinia | antfu/skills |
Pinia Pinia is the official state management library for Vue, designed to be intuitive and type-safe. It supports both Options API and Composition API styles, with first-class TypeScript support and devtools integration. The skill is based on Pinia v3.0.4, generated at 2026-01-28. Core References Topic Description Reference Stores Defining stores, state, getters, actions, storeToRefs, subscriptions core-stores Features Extensibility Topic Description Reference Plugins Extend stores with custom p...
|
10.8K |
| 734 | fixing-accessibility | ibelick/ui-skills |
fixing-accessibility Fix accessibility issues. how to use /fixing-accessibility Apply these constraints to any UI work in this conversation. /fixing-accessibility <file> Review the file against all rules below and report: violations (quote the exact line or snippet) why it matters (one short sentence) a concrete fix (code-level suggestion) Do not rewrite large parts of the UI. Prefer minimal, targeted fixes. when to apply Reference these guidelines when: adding or changing buttons, links, inputs...
|
10.8K |
| 735 | skill development | anthropics/claude-code |
Skill Development for Claude Code Plugins This skill provides guidance for creating effective skills for Claude Code plugins. About Skills Skills are modular, self-contained packages that extend Claude's capabilities by providing specialized knowledge, workflows, and tools. Think of them as "onboarding guides" for specific domains or tasks—they transform Claude from a general-purpose agent into a specialized agent equipped with procedural knowledge that no model can fully possess. What Skills Pr...
|
10.8K |
| 736 | tailwind-css-patterns | giuseppe-trisciuoglio/developer-kit |
Tailwind CSS Development Patterns Expert guide for building modern, responsive user interfaces with Tailwind CSS utility-first framework. Covers v4.1+ features including CSS-first configuration, custom utilities, and enhanced developer experience. When to Use Styling React/HTML components with utility classes Building responsive layouts with breakpoints Implementing flexbox and grid layouts Managing spacing, colors, and typography Creating custom design systems Optimizing for mobile-first desi...
|
10.8K |
| 737 | user-guide-writing | supercent-io/skills-template |
User Guide Writing When to use this skill New Features : Introduce new features to users Onboarding : Train new users FAQ : Organize frequently asked questions Instructions Step 1: Quick Start Guide Getting Started with MyApp Welcome to MyApp! This guide will help you get up and running in 5 minutes. Step 1: Create an Account 1. Go to [ https://myapp.com/signup ]( https://myapp.com/signup ) 2. Enter your email and create a password - Password must be at least 8 characters - Include uppercase, ...
|
10.7K |
| 738 | ui-component-patterns | supercent-io/skills-template |
UI Component Patterns When to use this skill Building Component Libraries : Creating reusable UI components Implementing Design Systems : Applying consistent UI patterns Complex UI : Components requiring multiple variants (Button, Modal, Dropdown) Refactoring : Extracting duplicate code into components Instructions Step 1: Props API Design Design Props that are easy to use and extensible. Principles : Clear names Reasonable defaults Type definitions with TypeScript Optional Props use optional ma...
|
10.7K |
| 739 | ralph | supercent-io/skills-template |
ralph (Ouroboros) — Specification-First AI Development Stop prompting. Start specifying. "The beginning is the end, and the end is the beginning." The serpent doesn't repeat — it evolves. When to use this skill Before writing any code — expose hidden assumptions with Socratic interviewing Long-running tasks that need autonomous iteration until verified Vague requirements — crystallize them into an immutable spec (Ambiguity ≤ 0.2) Tasks requiring guaranteed completion — loop until verification pa...
|
10.7K |
| 740 | web-design-reviewer | github/awesome-copilot |
Web Design Reviewer This skill enables visual inspection and validation of website design quality, identifying and fixing issues at the source code level. Scope of Application Static sites (HTML/CSS/JS) SPA frameworks such as React / Vue / Angular / Svelte Full-stack frameworks such as Next.js / Nuxt / SvelteKit CMS platforms such as WordPress / Drupal Any other web application Prerequisites Required Target website must be running Local development server (e.g., http://localhost:3000) Stagin...
|
10.7K |
| 741 | vercel-deploy | supercent-io/skills-template |
Vercel Deploy Deploy any project to Vercel instantly. No authentication required. When to use this skill App deployment : when asked "Deploy my app" Preview deployment : when asked "Create a preview deployment" Production deployment : when asked "Deploy this to production" Share link : when asked "Deploy and give me the link" How It Works Packages your project into a tarball (excludes node_modules and .git ) Auto-detects framework from package.json Uploads to deployment service Returns Preview U...
|
10.6K |
| 742 | log-analysis | supercent-io/skills-template |
Log Analysis When to use this skill Error debugging : analyze the root cause of application errors Performance analysis : analyze response times and throughput Security audit : detect anomalous access patterns Incident response : investigate the root cause during an outage Instructions Step 1: Locate Log Files Common log locations /var/log/ System logs /var/log/nginx/ Nginx logs /var/log/apache2/ Apache logs ./logs/ Application logs Step 2: Search for Error Patterns Common error search : S...
|
10.6K |
| 743 | authentication-setup | supercent-io/skills-template |
Authentication Setup When to use this skill Lists specific situations where this skill should be triggered: User Login System : When adding user authentication to a new application API Security : When adding an authentication layer to a REST or GraphQL API Permission Management : When role-based access control is needed Authentication Migration : When migrating an existing auth system to JWT or OAuth SSO Integration : When integrating social login with Google, GitHub, Microsoft, etc. Input Forma...
|
10.6K |
| 744 | bmad-orchestrator | supercent-io/skills-template |
bmad-orchestrator — BMAD Workflow Orchestration with SSD When to use this skill Initializing BMAD in a new project (with or without SSD) Running structured TEA cycles within each BMAD phase Checking and resuming BMAD/SSD workflow status Routing work across Analysis, Planning, Solutioning, and Implementation Managing structured handoff and cross-phase traceability between phases What is SSD (Structured System Design)? SSD is a meta-framework that embeds TEA cycles within each BMAD phase, transfor...
|
10.6K |
| 745 | flutter-building-layouts | flutter/skills |
Architecting Flutter Layouts Contents Core Layout Principles Structural Widgets Adaptive and Responsive Design Workflow: Implementing a Complex Layout Examples Core Layout Principles Master the fundamental Flutter layout rule: Constraints go down. Sizes go up. Parent sets position. Pass Constraints Down: Always pass constraints (minimum/maximum width and height) from the parent Widget to its children. A Widget cannot choose its own size independently of its parent's constraints. Pass Sizes Up: C...
|
10.6K |
| 746 | java-spring-boot | pluginagentmarketplace/custom-plugin-java |
Java Spring Boot Skill Build production-ready Spring Boot applications with modern best practices. Overview This skill covers Spring Boot development including REST APIs, security configuration, data access, actuator monitoring, and cloud integration. Follows Spring Boot 3.x patterns with emphasis on production readiness. When to Use This Skill Use when you need to: Create REST APIs with Spring MVC/WebFlux Configure Spring Security (OAuth2, JWT) Set up database access with Spring Data Enable mon...
|
10.6K |
| 747 | create-specification | github/awesome-copilot |
Create Specification Your goal is to create a new specification file for ${input:SpecPurpose} . The specification file must define the requirements, constraints, and interfaces for the solution components in a manner that is clear, unambiguous, and structured for effective use by Generative AIs. Follow established documentation standards and ensure the content is machine-readable and self-contained. Best Practices for AI-Ready Specifications Use precise, explicit, and unambiguous language. Clear...
|
10.6K |
| 748 | state-management | supercent-io/skills-template |
State Management When to use this skill 전역 상태 필요: 여러 컴포넌트가 같은 데이터 공유 Props Drilling 문제: 5단계 이상 props 전달 복잡한 상태 로직: 인증, 장바구니, 테마 등 상태 동기화: 서버 데이터와 클라이언트 상태 동기화 Instructions Step 1: 상태 범위 결정 로컬 vs 전역 상태를 구분합니다. 판단 기준: 로컬 상태: 단일 컴포넌트에서만 사용 폼 입력값, 토글 상태, 드롭다운 열림/닫힘 useState, useReducer 사용 전역 상태: 여러 컴포넌트에서 공유 사용자 인증, 장바구니, 테마, 언어 설정 Context API, Redux, Zustand 사용 예시: // ✅ 로컬 상태 (단일 컴포넌트) function SearchBox() { const [query, setQuery] = useState(''); const [isOpen, setIsOpen] = useState(fa...
|
10.5K |
| 749 | web-design-guidelines | supercent-io/skills-template |
Web Interface Guidelines Review files for compliance with Web Interface Guidelines. How It Works Fetch the latest guidelines from the source URL below Read the specified files (or prompt user for files/pattern) Check against all rules in the fetched guidelines Output findings in the terse file:line format Guidelines Source Fetch fresh guidelines before each review: https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md Use WebFetch to retrieve the latest rules. Th...
|
10.5K |
| 750 | opencontext | supercent-io/skills-template |
OpenContext Context Management (Persistent Memory) Give your AI assistant persistent memory. Stop repeating explanations, and build smarter. When to use this skill When you need to keep context across sessions When you need to record project background/decisions When you need to search prior conclusions/lessons When you need knowledge sharing in a Multi-Agent workflow When you want to reduce repetitive background explanations 1. Core concepts Problem When working with an AI assistant, context ge...
|
10.5K |