New: 97,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

App Builder

by Undertone0809 in Undertone0809/rudder

Create and iteratively improve local web products from natural-language requests, then prepare them to run as Rudder Apps.

Apache-2.0Auto-check passedFrontend & Design

Install App Builder

skills CLI
$ npx skills add Undertone0809/rudder --skill app-builder -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install Undertone0809/rudder app-builder --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/Undertone0809/rudder.git skills-src && mkdir -p .claude/skills && cp -r skills-src/server/resources/bundled-skills/app-builder .claude/skills/app-builder && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
app-builder
GitHub stars
292
Token cost
~2k tokens
SKILL.md length
1,037 words
Files
80 (incl. scripts, references, assets)
Skills in repo
30
Repo updated
First seen
Licence
Apache-2.0

At a glance

Create and iteratively improve local web products from natural-language requests, then prepare them to run as Rudder Apps.

  • Works in 11 steps: Capture a compact brief in the… → Choose the source path → Read references/scaffold-contract.md → …
  • Tasks that involve Static sites and blogs
  • SKILL.md covers Build Workflow, Real Data Decision, Runtime Boundary and Completion Gate
  • Runs TypeScript scripts from its folder; calls node

What it does

App Builder is an agent skill from Undertone0809/rudder. Create and iteratively improve local web products from natural-language requests, then prepare them to run as Rudder Apps. Use Rudder's maintained scaffold for new websites and preserve the existing stack for Next.js, React, Vue, Astro, SvelteKit, Nuxt, and other local web projects.

Its SKILL.md is about 2k tokens, which your agent loads only when the skill is triggered. The skill folder holds 90 other files, including scripts, reference files and assets (for example `agents/openai.yaml`, `assets/scaffold/app/api/%5F%5Frudder/health/route.ts` and `assets/scaffold/app/api/contacts/[id]/route.ts`).

It sits in Frontend & Design, covering Static sites and blogs. It works with Astro, Next.js, Nuxt and React. The repository describes itself as: Open-source local Agent harness for self-improving agent teams: run agents, review work, and turn feedback into reusable skills. The licence is Apache-2.0.

When your agent uses it

  • Tasks that involve Static sites and blogs

Example prompts

  • “/app-builder”

Requirements

  • Node.js

Workflow steps

11 steps, taken from the first numbered list in SKILL.md.

  1. Capture a compact brief in the conversation: user/job, primary workflow,
  2. Choose the source path
  3. Read references/scaffold-contract.md
  4. Implement the user's domain model and workflows. Keep the generated project
  5. Follow references/data-safety.md whenever an app
  6. Follow references/design-guidelines.md
  7. Run migrations against development or snapshot data, then run typecheck,
  8. Prepare the website for its Rudder Apps handoff
  9. Read references/verification.md, then verify
  10. Materialize final screenshots and validation evidence in the originating
  11. For an originating managed App handoff, use the injected run context without

What it can do on your machine

Read from SKILL.md and the folder at commit a3f49e8. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 1 file in scripts/ (TypeScript, from the files we listed), which the agent can run.

    Shell commands in SKILL.md call:

    • node

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

App Builder loads about 2k tokens when it runs, and up to ~5.6k if it reads all its reference files. Until then it costs about 74 tokens; SKILL.md has 1,037 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~74
When it runs · the whole SKILL.md, loaded when a task matches
~2k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~5.6k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

The full file from Undertone0809/rudder at commit a3f49e8, republished under its Apache-2.0 licence (© Undertone0809). 1,037 words, ~1,983 tokens.

Download SKILL.mdSave it as .claude/skills/app-builder/SKILL.md (or your agent's skills folder). This skill also uses 79 other files; get the full folder from GitHub.
name
app-builder
description
Create and iteratively improve local web products from natural-language requests, then prepare them to run as Rudder Apps. Use Rudder's maintained scaffold for new websites and preserve the existing stack for Next.js, React, Vue, Astro, SvelteKit, Nuxt, and other local web projects.

App Builder

Create or improve a useful local web product without making a non-technical user choose a framework, database, package manager, or process topology.

A Rudder App is an ordinary local website presented as an App inside Rudder. This Skill owns requirements, source changes, and product verification. Rudder Desktop owns folder selection, launch-definition review, process lifecycle, loopback attestation, and embedded opening.

Build Workflow

  1. Capture a compact brief in the conversation: user/job, primary workflow, essential screens, durable data, external integrations, constraints, and exclusions. Ask at most three grouped questions, and only when an answer materially changes behavior, real-data safety, or external authority.
  2. Choose the source path:
    • For a new App, use the maintained scaffold in assets/scaffold/. Prefer the Apps workspace flow when it is available. Otherwise run scripts/scaffold.mjs with an explicit workspace root and target. Never recreate the foundation from memory or overwrite a non-empty directory.
    • For an existing web project, inspect its current framework, package manager, development script, data boundary, and tests before editing. Preserve its stack and conventions; never replace it with the maintained scaffold merely to make it a Rudder App. When the originating prompt includes Rudder App handoff, retain its App ID for the completion protocol below. Do not guess an App ID or use one from a different conversation.
  3. Read references/scaffold-contract.md before changing the runtime, database foundation, manifest, health endpoint, import/export contract, or background-job runner.
  4. Implement the user's domain model and workflows. Keep the generated project conventional and independently runnable.
  5. Follow references/data-safety.md whenever an app already has data, imports user data, changes its schema, or needs a real-data diagnosis.
  6. Follow references/design-guidelines.md for visible UI work. For a new App, also read references/rudder-ui-preset.md and start from the versioned Rudder UI preset already present in the maintained scaffold. Keep its semantic tokens and source-owned shadcn primitives unless the brief explicitly requires a different product identity. For an existing project, preserve its design system by default; align it to Rudder only when the user asks for that change. Prefer coherent workflow screens over a generic dashboard assembled from decorative cards.
  7. Run migrations against development or snapshot data, then run typecheck, unit tests, build, and relevant app E2E tests. Review the final source and rendered product for correctness, regressions, usability, data safety, and evidence integrity; resolve every blocking finding before handoff.
  8. Prepare the website for its Rudder Apps handoff:
    • A new managed App created from Apps Home keeps its typed manifest. After the completion gate passes, report verified_source_ready with the originating App ID so Rudder Desktop can verify, start, and open that App automatically. Do not load the same source through the manual Local App path.
    • An independently authored existing project keeps a direct supported development script. Add the package.json rudder readiness or open-path fields only when discovery cannot infer them safely, then direct the operator to Apps + > Add local web project to select the folder and review the launch definition. The Agent writes and verifies source; Desktop alone owns runtime admission and process start. Do not invent a public URL, tunnel, cloud deployment, or unreviewed launch command.
  9. Read references/verification.md, then verify the rendered app with Rudder Browser. Exercise the main workflow plus at least one production-shaped edge case and inspect console errors.
  10. Materialize final screenshots and validation evidence in the originating Chat or Run. A localhost URL or tool-only screenshot is not durable output.
  11. For an originating managed App handoff, use the injected run context without printing or requesting credentials:
    • Run node scripts/report-build-status.mjs building <app-id> when implementation begins.
    • Run node scripts/report-build-status.mjs verified_source_ready <app-id> only after every Completion Gate item passes. This is the machine-visible signal that authorizes Desktop to verify, start, and open the exact assigned source root.
    • Run node scripts/report-build-status.mjs failed <app-id> when work ends in a terminal failure. Do not emit verified_source_ready for a question, partial implementation, canceled run, missing evidence, or blocker. Finish by telling the user the App is opening and that they can continue improving it in this Chat. If the status command fails, report that failure honestly instead of claiming the App opened.
Show full SKILL.md (356 more words)Show less

Real Data Decision

  • New app with no user data: use the scaffold's development database and synthetic fixtures.
  • UI or ordinary logic change on an app with user data: verify against a temporary database snapshot by default.
  • Diagnosis that genuinely depends on user records: ask whether to use the original database, a snapshot, or a redacted copy. State that relevant data may be sent to the configured model provider.
  • Schema change: snapshot first and rehearse the migration on the snapshot. Applying it to user data is an application-specific action and requires explicit user intent.
  • A direct operation on the formal database requires explicit user intent.

Never claim the Agent is sandboxed from files it can access. Use product controls and least-data workflow choices; explain the boundary honestly.

Runtime Boundary

  • App source, data, builds, and execution stay on the user's device.
  • The app may use outbound APIs only when requested and configured.
  • Background tasks implemented by the App run only with that managed App process. V1 does not provide a separate Rudder job scheduler or catch-up UI.
  • Never place secret values in source, rudder.app.json, tool arguments, Chat, screenshots, test fixtures, or logs. V1 does not provide a Rudder Secret binding UI, so ask the user how the App should obtain any required integration credential.
  • Opening Chat, Apps Home, or a saved view must not passively start an app. A run-scoped verified_source_ready handoff may start and open its managed App.
  • Cloud builds, hosted runtimes, public preview links, custom domains, managed cloud databases, and cross-device synchronization are outside this skill.

Completion Gate

Do not call the app complete until:

  • source and any required manifest or package.json Rudder configuration are durable;
  • typecheck, unit tests, and build pass;
  • blocking code and product review findings are resolved;
  • the reviewed readiness path is ready on an attested loopback process;
  • Browser verification covers the primary workflow and a relevant edge case;
  • the versioned Rudder UI preset check passes for a new maintained App;
  • persistence behavior is verified against development or snapshot data;
  • current screenshot evidence is attached to the work;
  • user data was not modified without explicit intent; and
  • stop/cleanup leaves no owned process behind.

© Undertone0809, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 79 other files (scripts, references, assets) in server/resources/bundled-skills/app-builder of Undertone0809/rudder.

  • SKILL.md
  • agents/openai.yaml
  • assets/scaffold/.env.example
  • assets/scaffold/.gitignore
  • assets/scaffold/.npmrc
  • assets/scaffold/app/api/%5F%5Frudder/health/route.ts
  • assets/scaffold/app/api/contacts/[id]/route.ts
  • assets/scaffold/app/api/contacts/route.ts
  • assets/scaffold/app/api/data/export/route.ts
  • assets/scaffold/app/api/data/import
  • … and 70 more

Open the folder on GitHubat commit a3f49e8

Compare with similar skills

App Builder next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

App Builder compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
App Builder this skillUndertone0809/rudder292—~2kAutomated safety check: PassApache-2.0
Vue Nuxtericrisco/rsc-harness156—~4.2kAutomated safety check: PassMIT
Sanity Best Practicesrobotostudio/turbo-start-sanity182—~940Automated safety check: PassMIT
Cloudflare Workers Frameworkssecondsky/claude-skills227—~1.4kAutomated safety check: PassMIT
Sanity Best Practicessanity-io/agent-toolkit187—~1.3kAutomated safety check: PassMIT
Kill AI Slopyetone/kill-ai-slop1.3k—~1.4kAutomated safety check: PassApache-2.0

Similar skills

  • Vue Nuxt

    ericrisco/rsc-harness

    A skill your agent uses when building or reviewing a Vue 3 + Nuxt 4 app — <script setup reactivity, SSR/SSG/hybrid routeRules, the app/+server/ layout, SSR-safe fetching (useFetch/useAsyncData) and…

    156 GitHub stars~4.2k tokensUpdated today
    Frontend & DesignAuto-check passed

  • Sanity Best Practices

    robotostudio/turbo-start-sanity

    Sanity development best practices for schema design, GROQ queries, TypeGen, Visual Editing, images, Portable Text, Studio structure, localization, migrations, Sanity Functions, Blueprints, and…

    182 GitHub stars~940 tokensUpdated 2 days ago
    Frontend & DesignAuto-check passed

  • Cloudflare Workers Frameworks

    secondsky/claude-skills

    Framework integration for Cloudflare Workers. An agent skill from secondsky/claude-skills.

    227 GitHub stars~1.4k tokensUpdated 9 days ago
    Frontend & DesignAuto-check passed

  • Sanity Best Practices

    sanity-io/agent-toolkit

    Official

    Sanity development best practices for schema design, GROQ queries, TypeGen, Visual Editing, images, Portable Text, Studio structure, localization, migrations, Sanity Functions, webhooks, Blueprints…

    187 GitHub stars~1.3k tokensUpdated 2 days ago
    Backend & APIsAuto-check passed

  • Kill AI Slop

    yetone/kill-ai-slop

    Find and remove AI slop — the generic, machine-default visual and copy tics of vibe-coded products — from a web project.

    1.3k GitHub stars~1.4k tokensUpdated 22 days ago
    Frontend & DesignAuto-check passed

  • Motion Dev Animations

    199-biotechnologies/motion-dev-animations-skill

    Creates 120fps GPU-accelerated animations with Motion.dev (Framer Motion successor) for React, Next.js, Svelte, and Astro projects.

    104 GitHub starsUsed in 1 repo~2.8k tokens
    Frontend & DesignAuto-check: notes

More from Undertone0809/rudder

All 30 skills in this repo

  • Conversation To Skill

    Undertone0809/rudder

    Turn the current conversation's workflow into a reusable agent skill.

    292 GitHub stars~3.6k tokensUpdated today
    Auto-check passed

  • Rudder Worktree Preview Maintainer

    Undertone0809/rudder

    A skill your agent uses when starting the current Rudder checkout as a temporary managed local preview with a stable URL, readiness check, logs, stop command, and cleanup path for manual inspection…

    292 GitHub stars~2.1k tokensUpdated today
    Auto-check passed

  • Stop Rudder Dev Maintainer

    Undertone0809/rudder

    A skill your agent uses when the user explicitly asks to stop, restart, kill, or clean Rudder repo-local pnpm dev processes or local dev runtime residue, including “把 pnpm dev 停了”, “重启 dev”, or “清掉…

    292 GitHub stars~1.3k tokensUpdated today
    Auto-check passed

  • Deep Research

    Undertone0809/rudder

    Conducts enterprise-grade research with multi-source synthesis, citation tracking, and verification.

    292 GitHub stars~1.2k tokensUpdated today
    Auto-check passed

  • Rudder Workspace Hygiene Maintainer

    Undertone0809/rudder

    A skill your agent uses to audit or clean Rudder worktrees, generated artifacts, logs, caches, and repo-owned processes without deleting active work, user data, or unrelated machine state.

    292 GitHub stars~664 tokensUpdated today
    Auto-check passed

  • Visualize

    Undertone0809/rudder

    Create safe inline visual explanations in Rudder Chat. An agent skill from Undertone0809/rudder.

    292 GitHub stars~1.8k tokensUpdated today
    Auto-check passed

Works with

Categories

Questions about App Builder

What does App Builder do?

Create and iteratively improve local web products from natural-language requests, then prepare them to run as Rudder Apps. App Builder is an agent skill from Undertone0809/rudder. Create and iteratively improve local web products from natural-language requests, then prepare them to run as Rudder Apps.

When should I use App Builder?

App Builder fits situations like: tasks that involve Static sites and blogs.

How do I install App Builder in Claude Code?

Run `npx skills add Undertone0809/rudder --skill app-builder -a claude-code`. Or copy the skill folder (server/resources/bundled-skills/app-builder in Undertone0809/rudder) into .claude/skills/app-builder in your project. Claude Code loads it when a task matches its description.

How do I install App Builder in Codex?

Run `npx skills add Undertone0809/rudder --skill app-builder -a codex`. Or copy the skill folder (server/resources/bundled-skills/app-builder in Undertone0809/rudder) into .agents/skills/app-builder in your project. Codex loads it when a task matches its description.

Can I use App Builder in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add Undertone0809/rudder --skill app-builder -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/app-builder, .gemini/skills/app-builder, .github/skills/app-builder and .opencode/skills/app-builder in your project.

What does App Builder need to run?

Going by SKILL.md and its folder, App Builder needs TypeScript for the scripts in its folder and the command-line tools its instructions call (node). Our summary lists: Node.js.

Does App Builder access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is App Builder safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does App Builder use?

App Builder is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does App Builder use?

About 2k tokens (SKILL.md is roughly 7.9k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 3.6k tokens, read only when the agent opens those files.

What are the alternatives to App Builder?

Skills that share tags, products or a category with App Builder: Vue Nuxt (ericrisco/rsc-harness, 156 stars), Sanity Best Practices (robotostudio/turbo-start-sanity, 182 stars), Cloudflare Workers Frameworks (secondsky/claude-skills, 227 stars) and Sanity Best Practices (sanity-io/agent-toolkit, 187 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains App Builder?

Undertone0809 (a GitHub user) maintains it in Undertone0809/rudder, which has 292 GitHub stars. The repository holds 30 skills in this directory. The repository was last updated on October 7, 2026.

Source: Undertone0809/rudder on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.