.agents/skills/app-builder/SKILL.md
Main application building orchestrator. Creates full-stack applications from natural language requests. Determines project type, selects tech stack, coordinates agents.
npx skillsauth add datamonsterr/mycoai_projects app-builderInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
Analyzes user's requests, determines tech stack, plans structure, and coordinates agents.
Read ONLY files relevant to the request! Check the content map, find what you need.
| File | Description | When to Read |
|------|-------------|--------------|
| project-detection.md | Keyword matrix, project type detection | Starting new project |
| tech-stack.md | 2025 default stack, alternatives | Choosing technologies |
| agent-coordination.md | Agent pipeline, execution order | Coordinating multi-agent work |
| scaffolding.md | Directory structure, core files | Creating project structure |
| feature-building.md | Feature analysis, error handling | Adding features to existing project |
| templates/SKILL.md | Project templates | Scaffolding new project |
Quick-start scaffolding for new projects. Read the matching template only!
| Template | Tech Stack | When to Use | |----------|------------|-------------| | nextjs-fullstack | Next.js + Prisma | Full-stack web app | | nextjs-saas | Next.js + Stripe | SaaS product | | nextjs-static | Next.js + Framer | Landing page | | nuxt-app | Nuxt 3 + Pinia | Vue full-stack app | | express-api | Express + JWT | REST API | | python-fastapi | FastAPI | Python API | | react-native-app | Expo + Zustand | Mobile app | | flutter-app | Flutter + Riverpod | Cross-platform mobile | | electron-desktop | Electron + React | Desktop app | | chrome-extension | Chrome MV3 | Browser extension | | cli-tool | Node.js + Commander | CLI app | | monorepo-turborepo | Turborepo + pnpm | Monorepo |
| Agent | Role |
|-------|------|
| project-planner | Task breakdown, dependency graph |
| frontend-specialist | UI components, pages |
| backend-specialist | API, business logic |
| database-architect | Schema, migrations |
| devops-engineer | Deployment, preview |
User: "Make an Instagram clone with photo sharing and likes"
App Builder Process:
1. Project type: Social Media App
2. Tech stack: Next.js + Prisma + Cloudinary + Clerk
3. Create plan:
├─ Database schema (users, posts, likes, follows)
├─ API routes (12 endpoints)
├─ Pages (feed, profile, upload)
└─ Components (PostCard, Feed, LikeButton)
4. Coordinate agents
5. Report progress
6. Start preview
This skill is applicable to execute the workflow or actions described in the overview.
data-ai
Foundation model for image segmentation with zero-shot transfer. Use when you need to segment any object in images using points, boxes, or masks as prompts, or automatically generate all object masks in an image.
development
Implement comprehensive testing strategies with pytest, fixtures, mocking, and test-driven development. Use when writing Python tests, setting up test suites, or implementing testing best practices.
tools
Guide for creating high-quality MCP (Model Context Protocol) servers that enable LLMs to interact with external services through well-designed tools. Use when building MCP servers to integrate external APIs or services, whether in Python (FastMCP) or Node/TypeScript (MCP SDK).
development
Process images for web development — resize, crop, trim whitespace, convert formats (PNG/WebP/JPG), optimise file size, generate thumbnails, create OG card images. Uses Pillow (Python) — no ImageMagick needed. Trigger with 'resize image', 'convert to webp', 'trim logo', 'optimise images', 'make thumbnail', 'create OG image', 'crop whitespace', 'process image', or 'image too large'.