Skip to content

synapse init — scaffold new MCP apps with UI #1

@mgoldsborough

Description

@mgoldsborough

Summary

Add a npx @nimblebrain/synapse init <name> command that scaffolds a complete MCP app project with a UI.

Motivation

Today, building an MCP app with a Synapse UI requires manually creating ~10 files across two project roots (server + UI). The hello app is the reference, but copy-pasting and renaming is tedious and error-prone.

Proposed UX

npx @nimblebrain/synapse init my-app
# or
npx @nimblebrain/synapse init my-app --python   # default
npx @nimblebrain/synapse init my-app --typescript

Interactive prompts for anything not specified via flags:

  • App name (kebab-case, used for package name + manifest)
  • Server language (Python or TypeScript)
  • Description

Generated structure

my-app/
├── manifest.json
├── pyproject.toml          # or package.json for TS
├── Makefile
├── .mcpbignore
├── .github/workflows/release.yml
├── src/mcp_my_app/         # or src/ for TS
│   ├── __init__.py
│   ├── server.py
│   └── ui.py
└── ui/
    ├── package.json
    ├── vite.config.ts
    ├── tsconfig.json
    ├── index.html
    └── src/
        ├── main.tsx
        └── App.tsx          # SynapseProvider + useCallTool example

Details

  • manifest.json — pre-filled with name, one example tool, ui:// resource, _meta for NB platform
  • vite.config.ts — react + viteSingleFile + synapseVite() (zero-config)
  • App.tsx — working example with useCallTool, useDataSync, useTheme
  • server.py / server.ts — example tool + load_ui() pattern
  • Makefilemake dev, make build, make bump
  • .github/workflows/release.yml — UI build + mcpb-pack
  • Post-scaffold message: "Run cd my-app/ui && npm install && npm run dev to start"

Acceptance criteria

  • npx @nimblebrain/synapse init my-app creates all files
  • cd my-app/ui && npm install && npm run dev works immediately (preview at /__preview)
  • cd my-app && uv sync && uv run python -m mcp_my_app.server works (stdio mode)
  • Generated app has a working tool call from the UI
  • Python and TypeScript templates

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions