ocrmnav
Version:
DevStack - The Complete Developer Toolkit - Virtual file system, workflow automation, and more than 65+ other development tools / features in one seamless extension. Cutting down dev times never before seen.
278 lines (206 loc) • 11 kB
Markdown
# DevStack
>Transform your VSCode into a productivity powerhouse. DevStack consolidates 72+ essential development tools into one seamless extension, delivering everything you need without the bloat.
- [For a more in-depth overview](https://catalyst-software.vercel.app/Catalyst/DevStack/home#Hero)
>UPDATE: My sincere apologies for the recent disruption to the platform. After implementing a new feature and migrating to a different development framework, I discovered that the site had encountered critical issues. The platform migration was necessitated by Vite's inadequate error reporting capabilities, which became increasingly problematic as the codebase expanded. While this limitation might be manageable for smaller projects, the current scale of our platform—with its extensive component library—made debugging virtually impossible without proper diagnostic feedback.
>I want to assure users that this transition is entirely backend-focused; the user experience remains unchanged, and no action is required on your part to continue using the platform effectively.
>The newly introduced feature is a comprehensive UI component library offering both free and premium tiers. The premium subscription provides access to our complete collection of 1,019+ components and will be available shortly as we finalize the remaining platform optimizations.
>To foster community engagement and reward contributions, I'm implementing an incentive program: contributors will receive complimentary premium access—one month for each accepted component submission. For example, ten approved submissions would result in ten months of credited premium access, along with crediting the author on the components page.
>I remain committed to continuous improvement across all aspects of this platform and encourage community participation in expanding our component library. While submission requirements are minimal, I may make changes to enhance contributions before publication.
>Given the technical challenges of manually reviewing over 1,000 components plus additional platform files without adequate error diagnostics, this migration was essential for maintaining service reliability. I appreciate your understanding and can confidently state that the new infrastructure will prevent similar disruptions in the future.
## Features
>Due to this being more of a quick overview, any new features that have been added will be at the top. That way current users can quickly see that a new feature has been added and either go to the in-depth readme to find out more, or use/visit it within the extension. This is due to the amount of features that are available, and placing any new feature any where on the list, will not be seen by current users.
### Concurrent Command Execution
### Tailwind Converter
### Virtual Filing System ( main feature )
- Comprehensive organization system that eliminates the need for multiple extensions
- UI for creating, editing, and moving folders/items without manual config editing
- Supports multiple item types: files, folders, URLs, commands, snippets, chains
- Project-agnostic configuration with global and workspace-specific settings
### Chain Execution
- Execute sequences of VSCode/shell commands with one click
- No limits on command quantity or length
- Hidden commands keep navigation clean while allowing complex workflows
### Commands
- Preset VSCode, PowerShell, and Bash commands with required flags
- Cheat sheet with 360+ commonly used commands
- Easy command creation and management
### Markdown Tools
- Rich text editor with live preview
- Cheat sheet with GitHub-flavored Markdown examples
- File explorer and outline navigation
- Focus mode and export capabilities
### Snippets
- Global snippet management
- Intuitive creation/editing interface
- Fuzzy search and quick insertion
- Automatic workspace synchronization
### File Formatting
- Live preview of formatting changes
- 33+ supported file types (expanding to 72)
- Sticky preview panel that follows your scroll
- Right-click formatting options
### Additional Productivity Tools
- Batch file renaming
- Missing imports resolver
- ESLint/Prettier config generator
- Theme builder with Tailwind/VSCode export
- Color wheel and icon libraries
### Creating Command Chains
- Open the DevStack sidebar
- Navigate to "Create Chain"
- Add commands with labels and paths
- Reorder execution as needed
- Save to make available in your workflow
- Configuration
- File Locations
Global config: AppData/Roaming/Code/User/globalStorage/skyler.ocrmnav/global-navigator-config.json
- Workspace config: AppData/Roaming/Code/User/globalStorage/skyler.ocrmnav/project-configs/project-{uniqueID}.json
- Global snippets: AppData/Roaming/Code/User/globalStorage/skyler.ocrmnav/ocrmnavigator.code-snippets
- >Notes
>The filing system is virtual - original files remain unchanged
Folders support two levels of depth (three with hidden items)
Markdown files are stored in .vscode folder
All changes are saved to JSON configuration files
### Quick Access
Access common functions via the status bar menu:
- Auto-commit/push
- VSIX management
- Chain/item creation
- Tool quick access
- Config editing
### Create Remix Apps
>Even though remix is no longer among us, for the next couple of months I still want to use it for the projects I have lined up. The builder takes in a couple of params, one of them to configure what stack you want to use. You can choose from on of the 30 or so I put in the builder that you can choose from, just the top 30 remix-run stacks. If you need something that isnt there, thats fine just reference the stack like you did with the old builder.
#### Same remix-run, different builder
```bash
npx create-remixv2
```
- Choose package manager and template at build time
- Select from 30+ popular stacks
- Custom stack reference via user/repo
### Auto Create Action
- Form Detection: Scans for <Form> and fetcher.Form components
- Intent + Schema Parsing: Extracts intent from form data
- Prisma Method Inference: Auto-detects CRUD operations
- VS Code Integration: Works with active editor, shows warnings when no forms found
### Context Components
- Right-click in editor → Remix Components → Select component to insert
### V1 → V2 Routing Conversion
- Converts route conventions automatically
- Safety rollback if issues occur
- Warning: Always push before conversion
### Test Generation
- Creates comprehensive test files in routes/tests/
- Auto-generates tests for all prismaexport functions
- Includes parameter type validation
### Authentication
- One-click auth setup with routes
- OTP implementation available
- Installs all required dependencies
### Route Management
- Quick route file creation
- Browser preview functionality
- URL copying to clipboard
### Theme Builder
- Theme Application Options
- Preset Themes: Apply professional designs in <15s
- Quick Customization: Modify core colors in <5min
- Full Palette: Comprehensive color selection
- Manual Control: Fine-tune every element
- Export & Save Options
- Tailwind Export: Generate CSS classes for projects
- VSCode Copy: Export theme to clipboard
- Workspace Save: Auto-saves to .vscode/settings.json
- Global Save: Applies across all workspaces
### Special Themes
### Blacked Out
- Minimalist all-black theme
- Reduces eye strain on large monitors
- Mutes distracting UI elements
- Preserves code readability
### Window Differentiator
- Color-codes workspace windows
- Subtle visual indicators
- Preserves your preferred theme
- Random color selection from curated palette
### ShadCN Integration
- Component Management
- Right-click to add components
- One-click full installation
- Includes all dependencies
## Configuration
### Default Apps
- Control which features are active
- Accessible via extension settings
- Detailed explanations for each option
### Sharing Configs
- Export your setup to shareWithFriends folder
- Includes README with setup instructions
- Manual cleanup recommended for sensitive data
## GitHub Integration
### Repository Management
#### Access via status bar quick pick menu (bottom-left)
- Auto Commit & Push: Stages, commits, and pushes changes with automatic messages
- Version Control: Auto-upgrades patch version and pushes to GitHub
- VSIX Management: Creates, reveals, and installs VSIX packages with one click
- "Yeet" Command: Complete workflow (save → commit → version → build → publish)
### Quick Access
- Right-click → "Open GitHub Repo in Browser"
- Direct access to repository from any file
## Prisma Tools
### Schema Navigation
- Right-click model name → "Open Schema Object"
- Jumps directly to schema definition
### CRUD Generation
- Automatic resolver/REST endpoint creation
- Hover preview before generation
- Right-click → Prisma submenu → "CRUD"
## File Management
### Quick Actions
- Reveal in Explorer: Right-click in navigator
- Copy Path: Right-click in VSCode panel
- Batch Rename: Mass edit filenames via generated .txt file
- File Nesting (Coming Soon)
- Advanced file organization system
### Productivity UI
- Search Bar
- Title bar button for instant access
- Workspace-scoped quick searching
- Config file: .vscode/ocrmnavigator/search-config.json
### Clipboard History Pro
- Last 20 clipboard items
- Hover previews
- Status bar access
### Bookmarks
- Line-specific markers
- Stores up to 20 bookmarks
- Status bar access
## Color & Icon Tools
### Color Wheel
- ShadCN-inspired picker
- HEX/OKLCH/CSS values
- Copy with/without hashtag
### Lucide Icons
- Fuzzy search across libraries
- JSX/TSX component generation
- Instant clipboard copy
- Pagination and sizing controls
### Notes & Todos System
- Universal Access
- VSCode extension
- Mobile app (PWA)
- Web interface
- GitHub sync
- Key Features
- Priority-based organization
- Offline editing with smart sync
- Team collaboration
- Reminder notifications
## Issues and Bugs
Given the extensive scope of this extension—which consolidates functionality from over 70+ individual extensions, many containing multiple features—comprehensive testing of every component becomes increasingly challenging alongside my concurrent personal and client projects. Until I can implement automated testing suites for each module, I encourage users to report any issues they encounter.
When submitting bug reports, please provide detailed information including:
- Specific steps to reproduce the issue
- Screenshots or screen recordings when possible
- System specifications and browser version
- Any console error messages
The more comprehensive the information provided, the more efficiently I can diagnose and resolve issues. My contact information is available on my GitHub profile for direct communication regarding any problems you may experience.
Your feedback is invaluable in maintaining the quality and reliability of this platform, and I appreciate your patience as we continue to refine and optimize the user experience.