← 返回 Skills 市场

RedHat Frontend Builder

Name: RedHat Frontend Builder
Author: mzfshark

作者 Mauricio Z. · GitHub ↗ · v1.0.0 · MIT-0

cross-platform ✓ 安全检测通过

总下载

当前安装

版本数

在 OpenClaw 中安装

/install axodus-frontend-builder

功能描述

Build frontend apps with safe API integration and quality gates.

使用说明 (SKILL.md)

SKILL: frontend-builder

Purpose

Build frontend applications (React / Next.js / Vite) with predictable structure, accessibility, and safe API integration.

When to Use

A new UI app/page/component system is required.
The task includes routing, state management, or API consumption.
You need a repeatable scaffold with quality gates (lint/tests/build).

Inputs

stack (required, enum: react-vite|nextjs|react-spa).
ui_requirements (required, string|object): pages, components, UX constraints.
api_contract (optional, object): endpoints/events and schemas.
constraints (optional, string[]): theming, perf, accessibility, browser support.

Steps

Confirm scope:
- routes/pages
- global layout/navigation
- state boundaries (server vs client)
Scaffold project in the target directory with minimal dependencies.
Implement component structure:
- components/, pages//routes/, lib/, styles/
Implement API client layer with:
- base URL via env
- timeouts
- error normalization
Add accessibility and UX guardrails:
- semantic HTML
- keyboard navigation
- loading/error states
Add tests (where the repo conventions support them).
Validate build/lint/test.

Validation

App builds cleanly.
No secrets in client bundles.
API calls handle errors and cancellations.
Key user flows are covered by at least smoke tests.

Output

Files created/changed
Run commands (dev, build, test)
Notes about env vars and configuration

Safety Rules

Never embed API keys in frontend code; use server-side proxy if needed.
Avoid untrusted HTML injection; sanitize where necessary.
Prefer stable, well-maintained libraries.

Example

Input:

stack: react-vite
ui_requirements: â€œDashboard page + settings form; calls /api/me.â€ Output: Vite project with src/pages/Dashboard.tsx, src/lib/api.ts, and build validation commands.

安全使用建议

This skill appears coherent for scaffolding frontend projects, but do these checks before installing or running it: 1) Verify the skill origin — registry metadata owner ID (kn741...) differs from the internal _meta.json ownerId (redhat-agent-001) and there's no homepage/source link; prefer skills with a clear publisher and repo. 2) Decide which environment variables (e.g., API_BASE_URL) you will provide; the SKILL.md references env usage but does not declare names. 3) When the agent scaffolds files, review the generated code (especially the API client and any server proxy guidance) to ensure no secrets are embedded and endpoints are as expected. 4) Because this is instruction-only, it will create files in whatever working directory the agent runs in — run it in a controlled sandbox or repo to avoid accidental overwrites. If you want higher assurance, ask the skill author for a repository or example output to inspect before trusting it in production.

功能分析

Type: OpenClaw Skill Name: axodus-frontend-builder Version: 1.0.0 The skill bundle is a standard template for scaffolding frontend applications (React, Next.js, Vite). It includes explicit safety instructions in SKILL.md to avoid embedding API keys and to sanitize HTML, showing alignment with secure development practices. No indicators of data exfiltration, malicious execution, or prompt injection were found across the analyzed files.

能力评估

✓ Purpose & Capability

The name/description (frontend scaffolding, safe API integration, quality gates) matches the instructions (scaffold project structure, API client layer, lint/tests/build). There are no unexpected credentials, binaries, or installs required for this purpose.

ℹ Instruction Scope

Instructions are scoped to creating project files, adding a client API layer, accessibility guardrails, tests, and build validation — all consistent. Minor gap: the SKILL.md states the API client's base URL should be provided 'via env' and that outputs include 'notes about env vars', but the skill does not declare any specific required env var names. Also the runtime instructions expect writing files in a 'target directory' (normal for a scaffolder) — confirm the agent has the intended working directory and permissions.

✓ Install Mechanism

Instruction-only skill with no install spec or code to download; this is low risk and expected for a scaffolding/instruction skill.

ℹ Credentials

The skill requests no credentials or config paths (proportionate). It does reference using environment variables for base URL and notes about env configuration, but does not declare specific env vars — this convenience gap is a documentation mismatch rather than a secret-exfiltration risk. No secrets are requested or embedded by the skill itself.

✓ Persistence & Privilege

always is false, the skill is user-invocable and may be invoked autonomously (platform default) but it does not request persistent system-wide changes or modify other skills/configs. Expected privilege level for a scaffolder.

如何使用

确保已安装 OpenClaw（本地或 Docker 部署）
在对话框中输入安装命令：/install axodus-frontend-builder
安装完成后，直接呼叫该 Skill 的名称或使用 /axodus-frontend-builder 触发
根据 Skill 的参数说明提供必要输入，即可获得结构化输出

版本历史

v1.0.0

Initial release of frontend-builder. - Scaffold frontend apps using React (Vite, SPA) or Next.js with a predictable, accessible structure. - Integrates API connectivity with enforced safe practices (env-based config, error handling, no secrets in client code). - Includes quality gates: linting, tests, and build validation. - Covers accessibility, UX, and basic testing requirements. - Outputs clear information on generated files and project commands.

元数据

Slug axodus-frontend-builder

版本 1.0.0

许可证 MIT-0

累计安装 0

当前安装数 0

历史版本数 1

常见问题