app-pages — community app-pages, mkbrowser, community, ide skills, Claude Code, Cursor, Windsurf

Name: app-pages
Availability: InStock
Author: Clay-Ferguson

v1.0.0

Perfect for Frontend Agents needing comprehensive app page management and Electron desktop app integration. File Explorer and Markdown Browser/Editor (Electron Desktop App)

Clay-Ferguson

[0]

Updated: 3/5/2026

GitHub

Agent Capability Analysis

The app-pages skill by Clay-Ferguson is an open-source community AI agent skill for Claude Code and other IDE workflows, helping agents execute tasks with better context, repeatability, and domain-specific guidance.

Ideal Agent Persona

Perfect for Frontend Agents needing comprehensive app page management and Electron desktop app integration.

Core Value

Empowers agents to manage multiple app pages, including browser, search results, and settings views, using TypeScript and React components, with capabilities like Markdown browsing and editing, and file exploration.

↓ Capabilities Granted for app-pages

Creating custom app pages with specific components

Managing multiple views in an Electron desktop application

Editing Markdown content within the app

! Prerequisites & Limits

Requires Electron desktop app setup
Limited to predefined app view types (browser, search-results, settings)

Labs Demo

Browser Sandbox Environment

⚡️ Ready to unleash?

Experience this Agent in a zero-setup browser environment powered by WebContainers. No installation required.

Boot Container Sandbox

app-pages

Install app-pages, an AI agent skill for AI agent workflows and automation. Works with Claude Code, Cursor, and Windsurf with one-command setup.

SKILL.md

Readonly

Instructions

Page Name and Component Location

Pages are the different top level views (aka panels) that we display in the application. Their names are defined in file src/store/types.ts in the following line of code.

export type AppView = 'browser' | 'search-results' | 'settings';

The 'browser' one is the main default application src/App.tsx, but any pages other than the main (browser) page should follow a pattern similar to what you find in src/components/SearchResultsView.tsx

Each page has a corresponding tab button in the tab panel at the top of the screen (Browse, Search, Settings). When the user clicks a tab button, we update the currentView in the global AppState, and that causes the page to display at next render.

React Global State Management

Example: setCurrentView('search-results');

FAQ & Installation Steps

These questions and steps mirror the structured data on this page for better search understanding.

? Frequently Asked Questions

What is app-pages?

Perfect for Frontend Agents needing comprehensive app page management and Electron desktop app integration. File Explorer and Markdown Browser/Editor (Electron Desktop App)

How do I install app-pages?

Run the command: npx killer-skills add Clay-Ferguson/mkbrowser/app-pages. It works with Cursor, Windsurf, VS Code, Claude Code, and 19+ other IDEs.

What are the use cases for app-pages?

Key use cases include: Creating custom app pages with specific components, Managing multiple views in an Electron desktop application, Editing Markdown content within the app.

Which IDEs are compatible with app-pages?

This skill is compatible with Cursor, Windsurf, VS Code, Trae, Claude Code, OpenClaw, Aider, Codex, OpenCode, Goose, Cline, Roo Code, Kiro, Augment Code, Continue, GitHub Copilot, Sourcegraph Cody, and Amazon Q Developer. Use the Killer-Skills CLI for universal one-command installation.

Are there any limitations for app-pages?

Requires Electron desktop app setup. Limited to predefined app view types (browser, search-results, settings).

↓ How To Install

1. Open your terminal

Open the terminal or command line in your project directory.
2. Run the install command

Run: npx killer-skills add Clay-Ferguson/mkbrowser/app-pages. The CLI will automatically detect your IDE or AI agent and configure the skill.
3. Start using the skill

The skill is now active. Your AI agent can use app-pages immediately in the current project.

Related Skills

Looking for an alternative to app-pages or another community skill for your workflow? Explore these related open-source skills.

View All

widget-generator

f.k.a. Awesome ChatGPT Prompts. Share, discover, and collect prompts from the community. Free and open source — self-host for your organization with complete privacy.

★ 149.6k

⑂ 0

flags

vercel

flags is a Next.js feature management skill that enables developers to efficiently add or modify framework feature flags, streamlining React application development.

★ 138.4k

⑂ 0

Browser

zustand

lobehub

The ultimate space for work and life — to find, build, and collaborate with agent teammates that grow with you. We are taking agent harness to the next level — enabling multi-agent collaboration, effortless agent team design, and introducing agents as the unit of work interaction.

★ 72.8k

⑂ 0

data-fetching