🎨 Pistachio Vibe: Visual App Creation for Everyone
Create web applications instantly with zero terminal knowledge - works in VS Code, Cursor, and all compatible editors
🎯 What is Pistachio Vibe?
Pistachio Vibe transforms how you create and preview web applications by removing the technical barriers that prevent designers and visual coders from building amazing things. No more terminal commands, no more complex setup - just pure creativity.
Perfect for:
- 🎨 Designers who want to build without coding
- 🚀 Visual coders who prefer UI over terminal
- 👨💻 Developers who want faster workflows
- 🌟 Anyone who wants to see their ideas come to life instantly
✨ What Makes Pistachio Special?
🚀 One-Click Everything
- Instant Preview - Start your development server with a single click
- Smart Detection - Automatically recognizes React, Next.js, Vite, and more
- Zero Configuration - Works out of the box with your existing projects
🆕 Project Creation Made Simple
- Pre-built Templates - Choose from React, Next.js, Express, and more
- Visual Workflow - Create projects through an intuitive interface
- Instant Setup - No waiting, no errors, just ready-to-use projects
🎛️ Effortless Control
- Status Bar Controls - Start, stop, and restart from anywhere
- Real-time Feedback - Always know what's running and where
- Smart Port Management - No more port conflicts or manual configuration
🎉 Latest Version: 1.1.1 (Hybrid Architecture)
Version 1.1.1 represents the most advanced and reliable release of Pistachio Vibe, combining the best features from multiple architectural approaches:
- ✅ Enhanced Reliability - v1.0.0 preview functionality with proven Simple Browser
- ✅ Modern UI/UX - Enhanced TemplatePanel with visual improvements and organization
- ✅ Working Stop Button - Multi-layer process termination that actually works
- ✅ Cross-Platform Support - Robust process management for all operating systems
- ✅ User Configuration - Flexible browser mode settings for user preference
Download: pistachio-vibe-1.1.1.vsix (151 KB)
🏗️ Hybrid Architecture Benefits:
- 🔄 Proven Preview: Uses VS Code's optimized Simple Browser
- 🎨 Enhanced UI: Organized template categories and refined visual design
- 🛑 Reliable Stop: Multi-layer process termination with verification
- ⚙️ User Control: Configurable browser preferences
🌐 Universal Compatibility
Pistachio works everywhere VS Code does:
✅ VS Code (all versions 1.74.0+)
✅ Cursor (VS Code-based editor)
✅ VSCodium (open-source VS Code)
✅ GitHub Codespaces (cloud development)
✅ Any VS Code-compatible editor
🚀 Quick Start
1. Install Pistachio
- Download the latest version:
pistachio-vibe-1.1.1.vsix
- Install in your editor:
Cmd+Shift+P → "Extensions: Install from VSIX"
- Restart if prompted
2. Start Creating
- Existing Project: Click the status bar button to start preview
- New Project: Click "🚀 New Project" to create from templates
- Zero Setup: Pistachio handles everything automatically
3. See Results Instantly
- Preview opens automatically in your editor or browser
- Changes update in real-time
- No terminal knowledge required
- Set preview browser mode:
Settings → Preview: Browser Mode
in-editor: Use VS Code's built-in Simple Browser (default)external: Use your system's default browser
- All other settings work automatically
🎨 Supported Frameworks
| Framework |
Project Creation |
Preview |
Status |
| React (Vite) |
✅ Perfect |
✅ Stable |
Ready |
| Next.js |
✅ Perfect |
✅ Stable |
Ready |
| Express + React |
✅ Perfect |
✅ Stable |
Ready |
| Node + Next.js |
✅ Perfect |
✅ Stable |
Ready |
| HTML/CSS/JS |
✅ Perfect |
✅ Stable |
Ready |
🎯 Perfect For These Use Cases
🎨 Designers & Visual Creators
- Build prototypes without learning terminal commands
- Create web apps using visual templates
- Focus on design instead of technical setup
- Share your work instantly with clients and teams
🚀 Developers & Engineers
- Rapid prototyping with pre-configured templates
- Consistent setup across all projects
- Faster development cycles
- Easy project sharing with non-technical team members
🌟 Teams & Collaborators
- Standardized workflows for everyone
- Reduced onboarding time for new team members
- Designer-developer collaboration without barriers
- Consistent development environment across the team
🔧 How It Works
Smart Project Detection
Pistachio Vibe automatically scans your workspace and:
- Identifies existing projects and frameworks
- Detects the correct start commands
- Configures ports automatically
- Sets up preview environments
Intelligent UI Switching
- Template Panel: Shows when starting new projects
- Project Control: Appears when managing existing projects
- Context-Aware: Adapts to your current workspace state
Seamless Integration
- Status Bar: Quick access to all controls
- Command Palette: Full command access via
Cmd+Shift+P
- Activity Bar: Dedicated Pistachio section with rocket icon
📚 Documentation & Resources
Complete documentation available in the project's /Docs folder for developers and contributors.
🚀 Installation
Option 1: VSIX Package (Recommended)
- Download the latest
.vsix file from releases
- Open your editor (VS Code, Cursor, etc.)
- Press
Cmd+Shift+P (or Ctrl+Shift+P on Windows/Linux)
- Type "Extensions: Install from VSIX" and select it
- Choose the downloaded
.vsix file
- Restart your editor if prompted
Option 2: Marketplace (Coming Soon)
- Search for "Pistachio Vibe" in the VS Code Extensions marketplace
- Click Install
- Start using immediately
🤝 Contributing
Pistachio Vibe is open source and welcomes contributions!
Whether you're a designer, developer, or just passionate about making coding more accessible, we'd love your help:
- 🐛 Report bugs and suggest improvements
- 💡 Propose new features and templates
- 📚 Improve documentation and user guides
- 🔧 Contribute code and technical improvements
Check out the project's documentation for setup instructions and contribution guidelines.
📄 License
This project is open source and available under the MIT License.
🙏 Acknowledgments
Built for the creative community to make web development accessible to everyone, regardless of technical background.
Pistachio Vibe makes web development as simple as clicking a button.
⭐ Star this repository if Pistachio Vibe helps you create amazing things!
Built with ❤️ for designers, developers, and creators everywhere
