JoinGrove

Studio Wizard Flow

Source: docs/agent/studio-wizard.md
Generated: 01/09/2026

Studio is JoinGrove's idea → template → agent → preview → publish path — alongside Classic IDE for existing repos.

Key Concepts

  • What: Studio flows cover mode chooser, Studio home, build-from-prompt, wizard steps, in-workbench preview shell, publish, and grow features (auth/DB).
  • Why: Founders and campus cohorts need guided app building without learning the full IDE first.
  • Related: Full flow doc (studio-flow.md), comparisons (comparisons.md), customize (../overview/customize.md).

API / Reference

Phase Command Description
A — Home joingrove.openStudioHome Welcome hub with prompt box
B — Shell joingrove.openStudioShell Chat + preview split
C — Build joingrove.studioBuildFromPrompt Prompt → stack → preview
D — Publish joingrove.studioPublish Deploy from preview toolbar
E — Grow joingrove.studioAddLogin, joingrove.studioAddDatabase Auth/DB stubs
F — Design joingrove.openStudioDesign, joingrove.studioBuildFromDesign Visual mockup → code
Wizard joingrove.studioWizard Step-by-step quick-pick menu
Mode chooser joingrove.chooseBuildMode Studio vs Classic

Setup & Installation

  1. First launch → Choose How You Want to Build… → Studio.
  2. Open JoinGrove Studio Home — enter an idea in the prompt box or pick a use-case card.
  3. Build from Idea… runs the full Phase C flow automatically.
  4. For manual control → Open JoinGrove Studio… (joingrove.studioWizard).
  5. Sign in for cloud projects → joingrove.platformSignIn + npm run platform-server.

Code Examples

Start platform server for cloud Studio:

npm run platform-server

Verify Studio phases:

npm run verify-studio-phases
npm run verify-platform

Example Studio home use-case prompt:

School fees portal with M-Pesa payments and admin reports

Next: Read the full mermaid flow in studio-flow.md.

How It Connects