MyContext CLI

Spec-Driven Development for the AI Era — Generate comprehensive context + visual screens, then code with Claude/Cursor


The missing piece: Start with an idea, get comprehensive specs + visual screens, then let AI tools build your app.

🚀 Two Paths to Code

$3

Best for reverse-engineering designs or cloning styles.

``bash


1. Initialize project with InstantDB (interactive setup)

mycontext init my-app --framework instantdb

→ Runs shadcn/ui init

→ Prompts for instant-cli init & schema push

→ Installs @instantdb/react, @instantdb/admin, auth deps

→ Copies template files to lib/ (instant-client.ts, auth.ts, etc.)

2. Analyze Screenshot (Powered by Gemini 2.0 Flash)

mycontext analyze mockup.png

→ Generates .mycontext/context.md

→ Extracts Design System (colors, fonts, spacing)

→ Identifies components & layout

3. Code (with full context)

pnpm dev
`

$3

Best for new projects from scratch.

`bash


1. Initialize with description and framework

mycontext init my-saas-app \
--framework instantdb \
--description "AI-powered code review SaaS"

Choose framework: instantdb | nextjs | other

2. Generate Full Context (PRD, Features, Flows, Specs)

mycontext generate context --full

3. Generate UI Artifacts

mycontext generate:screens-list # Extract screens from flows
mycontext generate:sample-data # Generate realistic test data
mycontext generate:components-manifest # Component specs with props
mycontext generate:actions # Backend connection hooks

4. Use context with Claude/Cursor

All files in .mycontext/ are ready for AI coding tools

`

🎯 Framework Support

MyContext adapts to your preferred tech stack with flexible initialization options:

$3

Complete real-time backend with authentication and storage

`bash
mycontext init my-app --framework instantdb
`

Includes:
- ✅ shadcn/ui components setup
- ✅ InstantDB client & admin SDK
- ✅ Auth utilities (bcrypt, magic codes, subdomain generation)
- ✅ File storage helpers
- ✅ Template files in lib/ or src/lib/:
- instant-client.ts - Client SDK with schema
- instant-admin.ts - Admin SDK for server operations
- auth.ts - Auth helpers (password hashing, magic codes)
- instantdb-storage.ts - File upload/download utilities

Dependencies Installed:
- @instantdb/react, @instantdb/admin
- bcryptjs, nanoid, @types/bcryptjs

---

$3

shadcn/ui + MyContext for Next.js projects

`bash
mycontext init my-app --framework nextjs
`

Includes:
- ✅ shadcn/ui components setup
- ✅ MyContext project structure (.mycontext/)
- ⏭️ No database setup (bring your own backend)

---

$3

Minimal setup for any project type

`bash
mycontext init my-app --framework other
`

Includes:
- ✅ MyContext project structure only
- ⏭️ No UI library or database setup

---

✨ Key Features

$3

- PRD: Complete product specification
- Brand System: Colors, typography, tokens
- User Flows: Step-by-step journeys
- Technical Specs: Constraints & requirements
- Types & Schema: TypeScript/Database definitions

$3

- HTML/JSX Screens: Production-ready HTML/Tailwind or React components
- Realistic Data: Context-aware sample content
- Hosted Preview: Preview all screens at studio.mycontext.app

$3

- Claude Code / Cursor: Optimized context packs
- Stitch / v0: Dedicated design prompts
- Figma: (Coming soon) Direct export

🤖 AI Provider Setup

MyContext works best with Gemini (Free Tier + Vision).

`bash


1. Get free API key: https://aistudio.google.com/apikey

2. Configure project

echo 'GEMINI_API_KEY=your-key' > .mycontext/.env
`

Also supports: Anthropic (Claude), OpenRouter (DeepSeek), xAI (Grok)

📚 Documentation

Note: The MyContext CLI is a focused scaffolding and code generation tool. To preview generated screens and components visually, use the hosted MyContext Studio app.

Detailed guides available in the docs/` directory:
- Getting Started
- Core Features
- Command Reference
- Architecture

🤝 Contributing

Contributions welcome! See CONTRIBUTING.md.

📄 License

MIT © MyContext - See LICENSE for details.