Agent skill

App Builder

App scaffolding: Next.js, Vite, Nuxt, Astro, FastAPI, Django, Laravel, RN, Flutter.

Apache-2.0Auto-check passedBackend & APIs

Install App Builder

skills CLI

$ npx skills add softspark/ai-toolkit --skill app-builder -a claude-code

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

GitHub CLI

$ gh skill install softspark/ai-toolkit 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/softspark/ai-toolkit.git skills-src && mkdir -p .claude/skills && cp -r skills-src/app/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/

Paste into Claude Code

Install the "app-builder" agent skill from https://github.com/softspark/ai-toolkit/tree/main/app/skills/app-builder into .claude/skills/app-builder/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "app-builder", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/softspark/ai-toolkit/tree/main/app/skills/app-builder

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add softspark/ai-toolkit --skill app-builder -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install softspark/ai-toolkit app-builder --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/softspark/ai-toolkit.git skills-src && mkdir -p .agents/skills && cp -r skills-src/app/skills/app-builder .agents/skills/app-builder && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "app-builder" agent skill from https://github.com/softspark/ai-toolkit/tree/main/app/skills/app-builder into .agents/skills/app-builder/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "app-builder", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add softspark/ai-toolkit --skill app-builder -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install softspark/ai-toolkit app-builder --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/softspark/ai-toolkit.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/app/skills/app-builder .cursor/skills/app-builder && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "app-builder" agent skill from https://github.com/softspark/ai-toolkit/tree/main/app/skills/app-builder into .cursor/skills/app-builder/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "app-builder", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/softspark/ai-toolkit.git --path app/skills/app-builder

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add softspark/ai-toolkit --skill app-builder -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install softspark/ai-toolkit app-builder --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/softspark/ai-toolkit.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/app/skills/app-builder .gemini/skills/app-builder && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "app-builder" agent skill from https://github.com/softspark/ai-toolkit/tree/main/app/skills/app-builder into .gemini/skills/app-builder/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "app-builder", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install softspark/ai-toolkit app-builder

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add softspark/ai-toolkit --skill app-builder -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/softspark/ai-toolkit.git skills-src && mkdir -p .github/skills && cp -r skills-src/app/skills/app-builder .github/skills/app-builder && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "app-builder" agent skill from https://github.com/softspark/ai-toolkit/tree/main/app/skills/app-builder into .github/skills/app-builder/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "app-builder", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add softspark/ai-toolkit --skill app-builder -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install softspark/ai-toolkit app-builder --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/softspark/ai-toolkit.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/app/skills/app-builder .opencode/skills/app-builder && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "app-builder" agent skill from https://github.com/softspark/ai-toolkit/tree/main/app/skills/app-builder into .opencode/skills/app-builder/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "app-builder", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: app-builder
GitHub stars: 179
Token cost: ~2.2k tokens
SKILL.md length: 831 words
Files: 1
Skills in repo: 112
Repo updated: Oct 7, 2026
First seen: Oct 7, 2026
Licence: Apache-2.0

At a glance

App scaffolding: Next.js, Vite, Nuxt, Astro, FastAPI, Django, Laravel, RN, Flutter.

Works in 3 steps: Design Context Gate → Pre-Flight Scan (Existing Projects) → Structural Variety & Macrostructures
Tasks that involve Backend development
SKILL.md covers Project Type Detection, Tech Stack Selection (2025), Project Templates and Design Context Gate &…, plus 6 more sections
Calls npm and npx

What it does

App Builder is an agent skill from softspark/ai-toolkit. App scaffolding: Next.js, Vite, Nuxt, Astro, FastAPI, Django, Laravel, RN, Flutter. Triggers: scaffold, bootstrap, new project, starter, dashboard, mobile app.

Its SKILL.md is about 2.2k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Backend & APIs, covering Backend development, Cross-platform mobile apps and Project scaffolding. It works with Next.js, FastAPI, Vite and Astro. The repository describes itself as: Professional-grade AI coding toolkit: 94 skills, 44 agents, multi-platform (Claude, Cursor, Windsurf, Copilot, Gemini, Cline, Roo Code, Aider, Augment, Antigravity, Codex CLI… The licence is Apache-2.0.

When your agent uses it

Tasks that involve Backend development
Tasks that involve Cross-platform mobile apps
Tasks that involve Project scaffolding

Example prompts

“/app-builder”

Requirements

Node.js
Pre-approved tools (allowed-tools): Read

Workflow steps

3 steps, taken from the step headings in SKILL.md.

Design Context Gate
Pre-Flight Scan (Existing Projects)
Structural Variety & Macrostructures

What it can do on your machine

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

Tool permissions
Pre-approves these tools, so the agent can use them without asking each time:
- Read
From allowed-tools in the SKILL.md frontmatter.
Runs code
Shell commands in SKILL.md call:
- npm
- npx
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md. Its commands use npm and npx, which can reach the network depending on how they are called.
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 2.2k tokens when it runs. Until then it costs about 43 tokens; SKILL.md has 831 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~43
When it runs · the whole SKILL.md, loaded when a task matches: ~2.2k

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); files beside SKILL.md are not scanned.

SKILL.md

The full file from softspark/ai-toolkit at commit d64db2b, republished under its Apache-2.0 licence (© softspark). 831 words, ~2,177 tokens.

Download SKILL.mdSave it as .claude/skills/app-builder/SKILL.md (or your agent's skills folder).

name: app-builder
description: App scaffolding: Next.js, Vite, Nuxt, Astro, FastAPI, Django, Laravel, RN, Flutter. Triggers: scaffold, bootstrap, new project, starter, dashboard, mobile app.
allowed-tools: Read
effort: medium
user-invocable: false

App Builder Skill

Project Type Detection

Keywords	Project Type	Primary Agents
landing, website, marketing	Static Site	frontend-specialist
dashboard, admin, crud	Web App	frontend + backend
api, rest, graphql	API Only	backend-specialist
mobile, ios, android	Mobile App	mobile-developer
cli, command, terminal	CLI Tool	backend-specialist
game, unity, godot	Game	game-developer
ai, ml, rag	AI/ML	ai-engineer
e-commerce, shop, store	E-commerce	backend + frontend

Tech Stack Selection (2025)

Web Applications

Scenario	Stack
Full-stack, SSR	Next.js 14+ (App Router)
SPA with API	React + Vite
Vue ecosystem	Nuxt 3
Static/Blog	Astro
E-commerce	Next.js + Medusa/Shopify

Mobile Applications

Scenario	Stack
Cross-platform (JS team)	React Native + Expo
Cross-platform (any)	Flutter
iOS only	SwiftUI
Android only	Kotlin + Jetpack Compose

Backend/API

Scenario	Stack
Node.js, edge-ready	Hono
Node.js, high perf	Fastify
Python, async	FastAPI
PHP, full-featured	Laravel
E-commerce	Magento/Sylius/PrestaShop

Database

Scenario	Stack
General purpose	PostgreSQL
Serverless	Neon (PG), Turso (SQLite)
Document store	MongoDB
Vector search	PostgreSQL + pgvector
Cache	Redis / Upstash

Project Templates

Next.js Full-Stack

project/
├── src/
│   ├── app/              # App Router
│   │   ├── (auth)/       # Auth group
│   │   ├── api/          # API routes
│   │   ├── layout.tsx
│   │   └── page.tsx
│   ├── components/       # Shared components
│   │   └── ui/           # UI primitives
│   ├── lib/              # Utilities
│   └── server/           # Server-only code
├── prisma/               # Database schema
├── public/
├── next.config.ts
├── tailwind.config.ts
└── package.json

FastAPI Backend

project/
├── app/
│   ├── api/
│   │   └── v1/
│   │       └── endpoints/
│   ├── core/             # Config, security
│   ├── models/           # Pydantic models
│   ├── db/               # Database
│   └── main.py
├── tests/
├── alembic/              # Migrations
├── pyproject.toml
└── Dockerfile

React Native + Expo

project/
├── app/                  # Expo Router
│   ├── (tabs)/
│   ├── _layout.tsx
│   └── index.tsx
├── components/
├── hooks/
├── store/                # State management
├── services/             # API clients
├── app.json
└── package.json

Design Context Gate & Pre-Flight Discipline (Web & UI Projects)

Before scaffolding UI pages, establish the design foundation to avoid generic "AI slop":

1. Design Context Gate

Gather 3 essential dimensions (ask once, or infer with clear stated assumptions):

Audience: Who will use this? What do they care about?
Use Case: What is the single primary action the page drives? (Sign up, purchase, explore, read, configure?)
Tone: Pick an explicit extreme — editorial, brutalist, soft, utilitarian, luxury, playful, technical, austere ("clean and modern" is not a tone).

2. Pre-Flight Scan (Existing Projects)

Before generating new pages or components, scan:

design.md (or DESIGN.md) — if present, it is the locked design system and overrides defaults.
Font Stack — inspect package dependencies and CSS imports (preserve existing font pairings).
Palette Tokens — read :root variables, Tailwind @theme definitions, and OKLCH color spaces.
Motion Stance — detect installed motion libraries (framer-motion, motion, gsap) vs motion-cut projects.
Framework & Spacing Scale — conform to existing grid and spacing scale (4-pt / 8-pt).

3. Structural Variety & Macrostructures

Break the repetitive "Hero → 3 features → CTA → footer" template. Select a named whole-page macrostructure matched to the brief:

Bento Grid: Modular irregular grid where visual rhythm comes from varying card sizes and asymmetric spans.
Long Document: Literature-led, memo/journal prose format with inline section heads.
Marquee Hero: The hero fills the viewport above the fold; content shifts below the fold into a list or dense grid.
Stat-Led: A massive metric/number anchors the narrative; subsequent content qualifies the data.
Workbench: Guided product tour with real screenshots in frames; focus on functional workflow over marketing copy.
Conversational FAQ: Bold questions and honest accordion answers reading like an interview with the product.
Manifesto: Large declaration typography; establishes core philosophy before presenting product.
Photographic / Quote-Led: Led by primary imagery or borrowed credibility pull-quotes.

Agent Coordination

New Project Flow

1. project-planner     → Task breakdown & tech selection
2. database-architect  → Schema design & migrations
3. backend-specialist  → API & business logic implementation
4. frontend-specialist → UI implementation (anti-slop, 8 states)
5. test-engineer       → Unit, integration, and E2E test coverage
6. devops-implementer  → Deployment & CI/CD setup

Feature Addition Flow

1. explorer-agent      → Understand codebase
2. project-planner     → Plan changes
3. [appropriate agent] → Implement
4. test-engineer       → Add tests
5. code-reviewer       → Review

Common Patterns

Authentication

JWT for APIs
Session for web apps
OAuth for third-party

State Management

Server state: TanStack Query
Client state: Zustand/Jotai
Form state: React Hook Form

Styling

Tailwind CSS as default
CSS Modules for isolation
Styled Components for dynamic

Testing

Unit: Jest/Vitest
E2E: Playwright
API: Supertest

Show full SKILL.md (331 more words)Show less

Best Practices

✅ Start with TypeScript
✅ Add linting (ESLint/Biome)
✅ Use environment variables
✅ Set up CI/CD from start
✅ Document as you build
❌ Don't skip tests
❌ Don't hardcode config
❌ Don't ignore accessibility
❌ Don't over-engineer early

Rules

MUST confirm the stack selection with the user before scaffolding — the matrix above is a default, not a verdict
MUST include .gitignore, .env.example, a README, a linter config, and a working test harness in every scaffold
NEVER overwrite an existing project directory without the user's explicit go-ahead
NEVER scaffold Create React App or other EOL starters — steer to Vite, Next.js, or Astro instead
CRITICAL: prefer the team's existing expertise over trend-chasing. If the team ships Laravel, scaffolding FastAPI "because it's faster" creates training debt that outweighs the runtime gain.

Gotchas

Next.js App Router (app/) and Pages Router (pages/) can coexist technically, but middleware, layouts, and loading-state conventions diverge. Pick one router per project and never mix inside a single feature — debugging the overlap wastes hours.
Expo Router (file-based, Expo SDK 49+) and React Navigation (imperative) use completely different navigation APIs. Tutorials mix freely; an agent copying code across the split produces uncompilable projects.
Prisma on SQLite silently ignores features that work on Postgres: no CHECK constraints, no deferrable foreign keys, no array columns, limited enum support. Dev-on-SQLite / prod-on-Postgres teams hit this at deploy time.
FastAPI --reload uses a file watcher that rebuilds Pydantic models on every edit — startup time doubles and benchmark numbers are unreliable. Disable reload for perf tests.
npm create vite@latest respects --template but npx create-next-app@latest prompts interactively even with flags. Fully unattended scaffolds need --ts --tailwind --eslint --app --src-dir --import-alias spelled out.

When NOT to Load

For modifying an existing project's stack — use /migrate or /refactor-plan
For adding a feature to a running app — use /plan and the relevant language-pattern skill (/typescript-patterns, etc.)
For onboarding to an unfamiliar codebase — use /onboard or /explore
For deciding between 2-3 specific stacks under stated constraints — use /architecture-decision
For plugin or agent scaffolding inside ai-toolkit itself — use /plugin-creator, /agent-creator

Files

Just SKILL.md in app/skills/app-builder of softspark/ai-toolkit.

Open the folder on GitHubat commit d64db2b

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
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
App Builder this skillsoftspark/ai-toolkit	179	—	~2.2k	Automated safety check: Pass	Apache-2.0	today
Spec To Repoalirezarezvani/claude-skills	28k	—	~2.7k	Automated safety check: Notes	MIT	1 mo ago
Cloudbase Sites RuntimeTencentCloudBase/CloudBase-AI-Toolkit	1.1k	—	~5k	Automated safety check: Notes	MIT	yesterday
Clerkgeekskai/blog	103	3 repos	~1.5k	Automated safety check: Pass	MIT	yesterday
PayRam Checkout IntegrationPayRam/payram-mcp	158	—	~3.4k	Automated safety check: Notes	None	1 mo ago
App BuilderxenitV1/Antigravity-Workflows	130	8 repos	~767	Automated safety check: Notes	MIT	8 mo ago

Similar skills

Spec To Repo
alirezarezvani/claude-skills
A skill your agent uses when the user says 'build me an app', 'create a project from this spec', 'scaffold a new repo', 'generate a starter', 'turn this idea into code', 'bootstrap a project', 'I…
28k GitHub stars~2.7k tokensUpdated 1 mo ago
Backend & APIsAuto-check: notes
Cloudbase Sites Runtime
TencentCloudBase/CloudBase-AI-Toolkit
A skill your agent uses when the user wants to develop, run, preview, save, deploy, or roll back a CloudBase Web app in this conversation as a Lovable/Codex-Sites-like vibe- coding session — i.e.
1.1k GitHub stars~5k tokensUpdated yesterday
MobileAuto-check: notes
Clerk
geekskai/blog
Clerk authentication router. An agent skill from geekskai/blog.
103 GitHub starsUsed in 3 repos~1.5k tokens
Backend & APIsAuto-check passed
PayRam Checkout Integration
PayRam/payram-mcp
Adds crypto checkout to a web app with PayRam: create a payment from your backend, send the customer to the payment page, then confirm the result.
158 GitHub stars~3.4k tokensUpdated 1 mo ago
Backend & APIsAuto-check: notes
App Builder
xenitV1/Antigravity-Workflows
Main application building orchestrator. An agent skill from xenitV1/Antigravity-Workflows.
130 GitHub starsUsed in 8 repos~767 tokens
DevelopmentAuto-check: notes
Payram Webhook Integration
PayRam/payram-mcp
Integrate PayRam webhook handlers for real-time payment and payout event notifications.
158 GitHub stars~3.6k tokensUpdated 1 mo ago
Backend & APIsAuto-check: notes

Questions about App Builder

What does App Builder do?

App scaffolding: Next.js, Vite, Nuxt, Astro, FastAPI, Django, Laravel, RN, Flutter. App Builder is an agent skill from softspark/ai-toolkit.js, Vite, Nuxt, Astro, FastAPI, Django, Laravel, RN, Flutter.

When should I use App Builder?

App Builder fits situations like: tasks that involve Backend development; tasks that involve Cross-platform mobile apps; tasks that involve Project scaffolding.

How do I install App Builder in Claude Code?

Run `npx skills add softspark/ai-toolkit --skill app-builder -a claude-code`. Or copy the skill folder (app/skills/app-builder in softspark/ai-toolkit) 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 softspark/ai-toolkit --skill app-builder -a codex`. Or copy the skill folder (app/skills/app-builder in softspark/ai-toolkit) 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 softspark/ai-toolkit --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 the command-line tools its instructions call (npm and npx). Our summary lists: Node.js. Its frontmatter pre-approves these tools: Read.

Does App Builder access the network?

SKILL.md contains no URLs. Its commands use npm and npx, which can reach the network depending on how they are called. 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. Review the folder before installing.

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 2.2k tokens (SKILL.md is roughly 8.7k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to App Builder?

Skills that share tags, products or a category with App Builder: Spec To Repo (alirezarezvani/claude-skills, 28k stars), Cloudbase Sites Runtime (TencentCloudBase/CloudBase-AI-Toolkit, 1.1k stars), Clerk (geekskai/blog, 103 stars) and PayRam Checkout Integration (PayRam/payram-mcp, 158 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains App Builder?

softspark (a GitHub user) maintains it in softspark/ai-toolkit, which has 179 GitHub stars. The repository holds 112 skills in this directory. The repository was last updated on October 7, 2026.

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

Install App Builder

Facts

At a glance

What it does

When your agent uses it

Example prompts

Requirements

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

App Builder Skill

Project Type Detection

Tech Stack Selection (2025)

Web Applications

Mobile Applications

Backend/API

Database

Project Templates

Next.js Full-Stack

FastAPI Backend

React Native + Expo

Design Context Gate & Pre-Flight Discipline (Web & UI Projects)

1. Design Context Gate

2. Pre-Flight Scan (Existing Projects)

3. Structural Variety & Macrostructures

Agent Coordination

New Project Flow

Feature Addition Flow

Common Patterns

Authentication

State Management

Styling

Testing

Best Practices

Rules

Gotchas

When NOT to Load

Files

Compare with similar skills

Similar skills

More from softspark/ai-toolkit

Related

Questions about App Builder