Elevate your web development workflow with SnapPreview, the ultimate live preview extension for Visual Studio Code. SnapPreview provides a seamless, real-time bridge between your editor and any device, featuring a stunning premium design and powerful mobile debugging capabilities.
✨ Premium Features
🚀 Instant Preview: Zero-configuration start for any web project.
🔄 Real-Time Live Reload: See changes instantly as you type.
📱 Advanced Mobile Access:
WiFi Mode: Scan a beautiful, prismatic QR code to open your project on any device on the same network.
USB Mode (ADB): Direct high-speed connection via USB cable—no WiFi required.
🎨 Modern Design System: A sleek, translucent glassmorphism UI with aurora gradients and fluid animations.
📶 Interactive Control Panel: Sidebar view with server status, active endpoints, and connected client counting.
🔌 Framework Aware: Automatically detects and supports React, Vue, Vite, Flutter Web, and static HTML/CSS.
🚀 Getting Started
Install SnapPreview from the VS Code Marketplace.
Open your web project folder.
Click the "SnapPreview" icon in the Activity Bar or the "🚀 SnapPreview" button in the Status Bar.
Launch the preview and start coding!
🔌 Connection Modes
Wireless (WiFi)
Ensure your phone and computer are on the same network. Simply scan the generated QR code in the sidebar to view your project mobile-ready.
Wired (USB)
Enable USB Debugging on your Android device.
Connect your phone via USB.
Toggle to USB Cable mode in SnapPreview and click Start.
ADB port forwarding is automatically handled—your phone connects directly via the cable.
📋 Commands
SnapPreview: Start - Boot up the active preview server.
SnapPreview: Stop - Shut down all preview processes.
SnapPreview: Open in Browser - Open the desktop preview in your default browser.
SnapPreview: Show QR - Display the mobile access QR code.
