跳到正文
cccskills

开发技能

编码规范、框架、重构、代码审查(1.7万 个)

按价格或排序方式筛选

Build dashboard panels in plain TypeScript using a shared Panel class. Examples cover form submission, input validation, error messages, browser storage, and immediate display updates, with a finance tracker demonstrating how the pieces fit together.

中文简介正在准备中。当前显示英语简介。

  • Building dashboard panels with a shared structure
  • Adding required-field and numeric input checks
  • Saving entered data in the browser
HKUDS/OpenSpace77712026年8月13日 更新

Analyze an existing codebase to identify reusable design patterns in components, services, APIs, styling, and refresh scheduling. Produces structured descriptions with representative code, conventions, dependencies, and adaptation notes for reuse or later conversion into skills.

中文简介正在准备中。当前显示英语简介。

  • Understanding the structure of a large codebase
  • Extracting reusable component and service designs
  • Following an existing project's conventions in a new project
HKUDS/OpenSpace77712026年8月13日 更新

Build TypeScript services that fetch API data for display panels. Use a circuit breaker, which pauses calls after repeated failures, alongside caching and default values, while keeping API keys on the server through proxy endpoints.

中文简介正在准备中。当前显示英语简介。

  • Separating API calls from display components
  • Pausing requests after repeated API failures
  • Configuring cached data and default values
HKUDS/OpenSpace77712026年8月13日 更新

Create dashboard panels in plain TypeScript using the browser’s page-building API. Follow a shared base class to add titles, counts, loading indicators, error messages, manual retry buttons, and periodically refreshed content.

中文简介正在准备中。当前显示英语简介。

  • Add a stock price panel to a dashboard
  • Show loading indicators and retry buttons on failure
  • Standardize titles and item counts across panels
HKUDS/OpenSpace77712026年8月13日 更新

Add thumbnails, colored badges, and data-driven styling to TypeScript lists, cards, and panels. Coordinate component logic with CSS, include fallbacks for missing data, and check how the updated display handles empty lists and long text.

中文简介正在准备中。当前显示英语简介。

  • Adding category or source badges to lists
  • Displaying thumbnails with placeholders for missing images
  • Changing colors and styles based on item data
HKUDS/OpenSpace77712026年8月13日 更新

Add a complete dashboard panel in plain TypeScript, from server routes and data services to the visible component and registration. The workflow checks existing routing patterns and includes request failure handling, caching, and saved panel state.

中文简介正在准备中。当前显示英语简介。

  • Adding a dashboard panel across server and browser code
  • Connecting routes to Express or http.createServer
  • Adding caching and cooldowns after repeated failures
HKUDS/OpenSpace77712026年8月13日 更新

Build a new dashboard or admin panel by following existing project patterns. This skill coordinates server endpoints, service logic, interface components, registration, and styling, then checks that the pieces connect consistently.

中文简介正在准备中。当前显示英语简介。

  • Adding a new dashboard panel
  • Implementing a feature across server and interface layers
  • Matching existing panel conventions
HKUDS/OpenSpace77712026年8月13日 更新

Build TypeScript data services that separate API calls from display components. Add caching and a circuit breaker, which pauses calls after repeated failures, while keeping user-triggered requests able to report errors directly.

中文简介正在准备中。当前显示英语简介。

  • Building data services for automatically refreshed panels
  • Pausing repeated calls to a failing API
  • Separating generation errors from background refresh handling
HKUDS/OpenSpace77712026年8月13日 更新

Transfer CSS rules between files by checking existing styles, adapting CSS variables, and appending changes. The workflow verifies each added selector with grep, a text-search command, to identify missing selectors that line counts or end-of-file checks may overlook.

中文简介正在准备中。当前显示英语简介。

  • Moving CSS rules between projects
  • Adding component styles while preserving existing rules
  • Adapting styles to different CSS variable names
HKUDS/OpenSpace77712026年8月13日 更新

Write large text files when write_file or shell_agent fails because of content size limits. The fallback passes multiline content through run_shell to Python, with guidance on escaping characters and checking the saved file.

中文简介正在准备中。当前显示英语简介。

  • Saving large source files after a write_file failure
  • Writing long JSON or Markdown files
  • Handling content with complex shell escaping
HKUDS/OpenSpace77712026年8月13日 更新

Build dashboard panels and sidebars in plain TypeScript. Provides patterns for panels that fetch data on a timer and sidebars updated by external callers, including retries, saved display settings, and styles inserted only once.

中文简介正在准备中。当前显示英语简介。

  • Build dashboard panels that refresh on a timer
  • Create sidebars updated with externally supplied data
  • Save and restore panel size and collapsed state
HKUDS/OpenSpace77712026年8月13日 更新

Build a dark dashboard with panels that adapt to screen width. The skill provides CSS for consistent colors, monospace text, panel headers, scrolling content, status badges, and loading or error states.

中文简介正在准备中。当前显示英语简介。

  • Building dashboards with multiple information panels
  • Adapting panel layouts for phones and large screens
  • Standardizing dark colors and monospace text
HKUDS/OpenSpace77712026年8月13日 更新

Set up a personal monitoring dashboard with Vite and TypeScript. The skill provides a folder layout, dependency and build settings, and a page entry point for organizing stock and news panels, data services, and shared utilities.

中文简介正在准备中。当前显示英语简介。

  • Start a personal stock and news dashboard
  • Organize panels separately from data-fetching code
  • Prepare TypeScript and Vite configuration files
HKUDS/OpenSpace77712026年8月13日 更新

Build TypeScript summary panels that combine data already fetched by other panels. Accept partial updates, wait for required fields before rendering, and update displayed metrics without additional network requests, using reusable base classes and a coordinator.

中文简介正在准备中。当前显示英语简介。

  • Combine email and stock metrics in one summary panel
  • Wait for required data before showing a summary
  • Update metrics using data fetched by other panels
HKUDS/OpenSpace77712026年8月13日 更新

Build dashboard panels in vanilla TypeScript with shared loading and error displays, saved panel state, and request handling. Examples show retries with increasing delays and CircuitBreaker integration to pause repeated failures and reuse cached results.

中文简介正在准备中。当前显示英语简介。

  • Building dashboard panels in vanilla TypeScript
  • Adding caching and cooldowns to existing service calls
  • Retrying requests with increasing delays
HKUDS/OpenSpace77712026年8月13日 更新

Build dashboard panels with patterns for handling failed API requests. TypeScript examples cover retries, cached data, temporary pauses after repeated failures, loading and error displays, and saving panel size and expansion state in the browser.

中文简介正在准备中。当前显示英语简介。

  • Building dashboard panels that handle API failures
  • Adding loading, error, and retry displays
  • Preserving panel size and expansion state
HKUDS/OpenSpace77712026年8月13日 更新

Build dashboard panels in plain TypeScript with saved sizes and expanded or collapsed states. The pattern includes data fetching retries with increasing delays, loading indicators, error messages, and a shared base class for consistent panel behavior.

中文简介正在准备中。当前显示英语简介。

  • Restoring panel sizes and expanded or collapsed states
  • Adding automatic retries when data fetching fails
  • Standardizing loading and error displays across panels
HKUDS/OpenSpace77712026年8月13日 更新

Build dashboard panels in plain TypeScript with automatic retries, saved panel settings, and clear error states. Keep panel-specific helper functions in the same file to make each component easier to understand and maintain.

中文简介正在准备中。当前显示英语简介。

  • Build a panel that retries failed data requests
  • Save panel dimensions and expanded or collapsed state
  • Keep time and status formatting helpers beside panel code
HKUDS/OpenSpace77712026年8月13日 更新

Turn existing source code into reusable learning materials. This skill identifies architectural patterns and implementation techniques, then organizes them into a SKILL.md with structured metadata, explanatory code templates, practical examples, and validation steps.

中文简介正在准备中。当前显示英语简介。

  • Create teaching materials from reference code
  • Document reusable implementation patterns
  • Prepare code templates with usage examples
HKUDS/OpenSpace77712026年8月13日 更新

Build dashboard panels in vanilla TypeScript with resizing, saved layout state, loading indicators, and retry controls. Examples also show how to wrap existing data-fetching functions with caching and temporary request pauses after repeated failures.

中文简介正在准备中。当前显示英语简介。

  • Building dashboard panels in vanilla TypeScript
  • Saving panel sizes across page reloads
  • Adding retry controls to failed data requests
HKUDS/OpenSpace77712026年8月13日 更新

Transfer CSS styles between files by comparing existing rules and adding missing styles. The workflow preserves existing content, maps CSS variables to the destination’s names, and checks the appended rules after the update.

中文简介正在准备中。当前显示英语简介。

  • Moving styles between projects
  • Reusing component styles while preserving existing rules
  • Matching CSS variables to the destination
HKUDS/OpenSpace77712026年8月13日 更新

List and count folders in a specified path using list_dir results. Distinguishes directories from files, handles hidden and system entries, and presents an alphabetically sorted inventory with the path and total count.

中文简介正在准备中。当前显示英语简介。

  • Check the folders that make up a project
  • Create an inventory of skill or module directories
  • Explore the directory layout of a repository
HKUDS/OpenSpace77712026年8月13日 更新

Build sidebars and widgets that receive data updates from their caller. This skill uses a single shared module instance, separate creation and update functions, and stored references to page elements for partial updates.

中文简介正在准备中。当前显示英语简介。

  • Build a sidebar that updates frequently
  • Display data supplied by an external controller
  • Update selected page elements without rebuilding the whole widget
HKUDS/OpenSpace77712026年8月13日 更新

Compare a file’s current content with its intended replacement before writing. Skip matching files to avoid unnecessary rebuilds and timestamp changes, with guidance on readable diffs, line endings, encoding, and exact content requirements.

中文简介正在准备中。当前显示英语简介。

  • Replacing configuration files only when content changes
  • Avoiding rebuilds caused by unchanged generated files
  • Reviewing differences before replacing a whole file
HKUDS/OpenSpace77712026年8月13日 更新