ProAppStore Premium Web Apps

Build a pro app with AI.

Three ways to go from idea to deployed app. Pick the one that fits how you work.

Recommended

MCP Direct

Your AI tool writes code directly to GitHub via MCP. No local clone needed. Full SDK knowledge built in.

Requires: Claude Code, Cursor, or any MCP client

Agent Teams

Describe what you want. A team of AI agents (PO, BA, Dev, QA) builds it autonomously.

Requires: MCP connection + BYO Anthropic key

Local Dev

Scaffold with the CLI, code locally with any AI tool, git push to deploy.

Requires: Node.js + pnpm + CLI

Path 1: MCP Direct Build

Your AI tool connects to ProAppStore via MCP and writes code directly to the repo. No local clone, no terminal, no deploy commands. The AI reads the SDK docs, gets code recipes, and pushes files — all through MCP tools.

  1. Connect your AI tool via MCP

    Add to your Claude Code settings (~/.claude/settings.json):

    { "mcpServers": { "proappstore": { "command": "npx", "args": ["mcp-remote", "https://mcp.proappstore.online/mcp"] } } }

    Works with Cursor, Windsurf, and any MCP-compatible editor too. On first connection, auth-capable clients open browser sign-in. Clients without browser OAuth can send a PAS session token from pas login.

  2. Create your app

    Tell your AI tool: "Create a Pro app called chess-academy". It will call scaffold_app to create the GitHub repo from the template, then provision_app to register the route and database.

  3. Build it

    Tell your AI tool what to build. It uses sdk_reference to understand the API, recipe to get copy-paste patterns (CRUD lists, forms, maps, AI chat), and write_file / batch_write_files to write the code directly to the repo.

    # Example prompts: Build a chess academy app. Use app.db for puzzles and games. Add real-time game rooms with app.rooms. Show a leaderboard with app.counters. Use the crud-list recipe for the puzzle browser.

  4. It's live

    Every push to the repo auto-deploys to R2. Your app is live at chess-academy.proappstore.online within 30 seconds of the push.

Path 2: Agent Teams

Describe your app idea. A team of AI agents builds it autonomously — the PO creates tickets, the BA writes specs, the Dev writes code, and QA writes tests. You watch the build in real-time on the Console.

  1. Connect via MCP (same as Path 1)

    You need the MCP connection. You also need a BYO Anthropic API key stored in the Console key vault.

  2. Create a project

    Tell your AI: "Create an Agent Teams project called chess-academy — a chess learning platform with puzzles, game rooms, and lessons." It calls create_app.

  3. Chat with the PO

    The PO agent reads your idea and files tickets. Chat via chat_agent(thread:'build') to refine. Use chat_agent(thread:'research') to have the Architect research the market and build a Knowledge Base.

  4. Start the build

    Call set_project_running(running: true). The BA/Dev/QA agents pick up tickets and build autonomously. Watch progress with list_tickets or in the Console.

Path 3: Local Development

Scaffold locally with the CLI, open in your AI-powered editor, code it, and push to deploy. Full control over every file.

Prerequisites

You need Node.js and pnpm installed. If you already have them, skip to Step 1.

# Check if Node is installed (need v22+) node --version # v22.x.x or higher? You're good. If not: # Install Node.js (macOS) brew install node # Install Node.js (Windows) — download from nodejs.org # Install Node.js (Linux) curl -fsSL https://deb.nodesource.com/setup_22.x | sudo -E bash - sudo apt-get install -y nodejs
# Install pnpm (the package manager) npm install -g pnpm # Verify pnpm --version # Should print 10.x.x

Step-by-step: Local + Claude Code

Full walkthrough using Claude Code locally. Other tools follow the same pattern — see tool-specific setup below.

  1. Install Claude Code and the ProAppStore CLI

    # Install Claude Code (Anthropic's terminal AI) npm install -g @anthropic-ai/claude-code # Install the ProAppStore CLI npm install -g @proappstore/cli # Verify both are installed claude --version pas --version

  2. Create your app

    This scaffolds a full project, provisions a database, and deploys a data worker. Takes about 30 seconds.

    # Create a new Pro app called "my-app" pas create my-app # Output: # Creating My App... # # [1/3] Scaffolding from template... # [2/3] Installing dependencies... # [3/3] Initializing git... # [4/4] Provisioning platform resources... # [+] create_d1: pas-data-my-app (abc123...) # [+] deploy_worker: Deployed pas-data-my-app # [+] record_app: creator: your-username # # Done! Your app is ready.

  3. Open the project in Claude Code

    # Go into the project folder cd my-app # Start Claude Code claude

    Claude Code reads your project's CLAUDE.md file automatically. That file already contains:

    See https://proappstore.online/skills.md for platform conventions.

    Claude now knows the entire SDK, the database API, the hooks, the design system — everything.

  4. Tell Claude what to build

    Type your prompt in the Claude Code terminal. Be specific about what features you want.

    # Example prompts you can type: Build a todo app. Store todos in the database using app.db. Use useProGate for auth. Let users create, complete, and delete todos. Show a count of completed todos. # Or something more complex: Build an event planner. Users create events with a title, date, city, and description. Store in the database. Show events on a map using app.maps.geocode(). Let users RSVP. Add real-time chat per event using app.rooms. Upload event photos with app.storage.uploadPublic().

    Claude will edit web/src/App.tsx and create any additional files needed.

  5. Run it locally

    # Start the development server pnpm dev # Output: # VITE v8.x.x ready in 200ms # ➜ Local: http://localhost:5173/ # Open http://localhost:5173 in your browser to see your app

  6. Deploy

    Push to GitHub. Cloudflare R2 auto-deploys in ~30 seconds.

    # Push your code git add -A git commit -m "Build my app" git push origin main # Your app is now live at: # https://my-app.proappstore.online
That's it. Six steps from zero to a deployed app with a database, auth, file storage, and maps. The whole thing takes about 10 minutes.

Other AI tools

Steps 1-2 and 5-6 are the same for every tool. The only difference is Step 3 — how you tell the AI tool about the platform. Here's where to put the skills.md reference for each tool:

Terminal

Claude Code

Reads CLAUDE.md automatically — already set up by pas create.

CLAUDE.md
Editor

Cursor

Create a rules file in your project root.

.cursorrules
Editor

GitHub Copilot

Create an instructions file for Copilot.

.github/copilot-instructions.md
Terminal

Codex CLI

Create an agents file in your project root.

AGENTS.md
Terminal

Aider

Create a conventions file.

CONVENTIONS.md
Editor

Windsurf

Create a rules file in your project root.

.windsurfrules
Editor

Cline

Paste into the custom instructions field in settings.

Custom instructions
Editor

Zed

Paste the URL into the assistant panel context.

Assistant context
Editor

Continue

Create a rules file in your project root.

.continuerules
Web

ChatGPT

Paste the skills.md content into the chat.

Paste in chat

For all tools, the content to add is the same one line:

See https://proappstore.online/skills.md for platform conventions.

pas create already adds this to CLAUDE.md. For other tools, create the appropriate file and add this line.

MCP Tools Reference

All 35 MCP tools available when connected. Used by both Path 1 (Direct Build) and Path 2 (Agent Teams).

Platform info

sdk_reference, recipe, platform_guide, deploy_status, app_info, list_apps, discover_tools

Build apps

scaffold_app, write_file, batch_write_files, read_file, list_files, search_files, provision_app

Agent Teams

create_app, chat_agent, add_ticket, run_tests, set_model, set_project_running, list_tickets

App data

Per-app SQL tools from mcp.json — query any app's D1 database via <app>/<tool>

MCP endpoint: https://mcp.proappstore.online/mcp — connect from Claude Code, Cursor, Windsurf, or any MCP-compatible client.

What your app gets automatically

When you run pas create, the platform provisions all of this:

SQL Database

Your own database. Create tables, run queries, store anything.

Auth (GitHub)

Users sign in with GitHub. One line of code.

File Storage

Upload images, videos, documents. Get shareable URLs.

Maps

Geocode addresses, show maps. No API keys needed.

Real-time

WebSocket rooms for chat, collaboration, multiplayer.

Hosting

Push to main = deployed globally. Zero config.

SDK cheat sheet

Copy-paste these into your AI prompts. Full docs here.

// Initialize import { initPro } from '@proappstore/sdk' const app = initPro({ appId: 'my-app' }) // Auth (React hook) import { useProGate } from '@proappstore/sdk/hooks' const { gate, user, signIn } = useProGate(app, { allowFree: true }) // Database await app.db.execute('CREATE TABLE IF NOT EXISTS todos (id TEXT PK, text TEXT, done INT)') await app.db.execute('INSERT INTO todos VALUES (?, ?, ?)', [id, 'Buy milk', 0]) const { rows } = await app.db.query('SELECT * FROM todos WHERE done = ?', [0]) // File uploads await app.storage.uploadPublic('photo.jpg', file, 'image/jpeg') const url = app.storage.publicUrl('photo.jpg') // use in <img src> // Maps const results = await app.maps.geocode('San Francisco') const mapUrl = app.maps.embedUrl(37.77, -122.42) // use in <iframe src> // Real-time chat const room = app.rooms.join('room-1') room.send({ text: 'hello' }) room.onMessage(msg => console.log(msg))

Other reading