https://github.com/varundeva/storageflow
StorageFlow is a powerful and intuitive Chrome extension for managing browser storage (localStorage and sessionStorage) with professional-grade tools for developers and power users. Seamlessly import, export, edit, and transfer data across tabs and domains with an elegant, modern interface.
https://github.com/varundeva/storageflow
chromeapi chromedevtools chromeextension crosstab datavisualization developertools export javascript json localstorage manifestv3 opensource opensource-projects privacyfocused productivity sessionstorage storageinspector storagemanager vanillajavascript webextension
Last synced: 4 months ago
JSON representation
StorageFlow is a powerful and intuitive Chrome extension for managing browser storage (localStorage and sessionStorage) with professional-grade tools for developers and power users. Seamlessly import, export, edit, and transfer data across tabs and domains with an elegant, modern interface.
- Host: GitHub
- URL: https://github.com/varundeva/storageflow
- Owner: varundeva
- Created: 2025-07-31T14:21:08.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2025-08-15T16:26:31.000Z (4 months ago)
- Last Synced: 2025-08-15T18:36:56.196Z (4 months ago)
- Topics: chromeapi, chromedevtools, chromeextension, crosstab, datavisualization, developertools, export, javascript, json, localstorage, manifestv3, opensource, opensource-projects, privacyfocused, productivity, sessionstorage, storageinspector, storagemanager, vanillajavascript, webextension
- Language: JavaScript
- Homepage: https://chromewebstore.google.com/detail/ingjgnjmllenigkebdjnilghaoemhnbn?utm_source=item-share-cb
- Size: 97.7 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# StorageFlow - Professional Browser Storage Manager
[](./manifest.json)
[](https://developer.chrome.com/docs/extensions/)
[](#license)
StorageFlow is a powerful and intuitive Chrome extension for managing browser storage (localStorage and sessionStorage) with professional-grade tools for developers and power users. Seamlessly import, export, edit, and transfer data across tabs and domains with an elegant, modern interface.
## 🚀 Key Features
### Core Storage Management
- **Dual Storage Support**: Manage both localStorage and sessionStorage with easy toggle switching
- **Real-time Data Visualization**: Live updates with type detection (String, JSON, Number, Boolean)
- **Advanced Search & Filter**: Quickly find storage items across keys and values
- **Bulk Operations**: Select multiple items for batch delete, export, or transfer
### Import/Export Capabilities
- **File-based Import/Export**: JSON format with version control and metadata
- **Clipboard Integration**: Copy/paste data directly to/from clipboard
- **Selective Operations**: Export only selected items or all data
- **Backup Creation**: Automatic backup before major operations
### Cross-Tab Data Transfer
- **Tab-to-Tab Transfer**: Move storage data between different browser tabs
- **Domain-aware Operations**: Intelligent handling of cross-domain transfers
- **Transfer Logging**: Complete audit trail of all transfer operations
### Professional UI/UX
- **Modern Design**: Clean, responsive interface with professional styling
- **Theme Support**: Light, dark, and auto (system) theme modes
- **Accessibility**: Full keyboard navigation and screen reader support
- **Toast Notifications**: Non-intrusive feedback system
### Developer Tools
- **Context Menu Integration**: Right-click options for quick access
- **Background Processing**: Efficient service worker for seamless operations
- **Error Handling**: Comprehensive error reporting and recovery
- **Extension Security**: Full compliance with Manifest V3 requirements
## 📦 Installation
### From Chrome Web Store (Recommended)
[Install from Chrome Extensions](https://chromewebstore.google.com/detail/ingjgnjmllenigkebdjnilghaoemhnbn?utm_source=item-share-cb)
### Developer Installation
1. **Clone or Download** this repository
2. **Open Chrome** and navigate to `chrome://extensions/`
3. **Enable Developer Mode** (toggle in top-right corner)
4. **Click "Load unpacked"** and select the project directory
5. **Pin the extension** to your toolbar for easy access
## 🎯 Quick Start
1. **Click the StorageFlow icon** in your Chrome toolbar
2. **Select storage type** using the toggle (Local ↔ Session)
3. **View current data** for the active tab
4. **Add, edit, or delete** storage items using the intuitive interface
5. **Export or import** data using the Transfer tab
6. **Customize settings** in the Settings tab
## 🔧 Usage Guide
### Managing Storage Data
- **Add Item**: Click the "Add" button to create new storage entries
- **Edit Item**: Click the edit icon (pencil) next to any storage item
- **Delete Item**: Click the delete icon (trash) to remove items
- **Search**: Use the search bar to filter items by key or value
### Bulk Operations
- **Select Items**: Check the boxes next to items you want to manage
- **Bulk Actions**: Use the bulk action bar for selected items
- **Select All**: Toggle all items at once with the "Select All" button
### Import/Export Operations
- **Export All**: Download all storage data as a JSON file
- **Export Selected**: Download only selected items
- **Import File**: Drag & drop or browse for JSON files to import
- **Copy to Clipboard**: Copy data in JSON format for sharing
### Settings & Customization
- **Theme**: Choose between Light, Dark, or Auto (system) themes
- **Safety Settings**: Enable confirmations and auto-backup features
- **Advanced Options**: Clear all data or export extension settings
## 🏗️ Architecture
StorageFlow follows a modular architecture with clear separation of concerns:
### Component Structure
```
StorageFlow/
├── manifest.json # Extension configuration
├── src/
│ ├── background/ # Service worker & background tasks
│ ├── content/ # Content script for page interaction
│ ├── popup/ # Main UI components
│ └── assets/ # Icons and static resources
└── docs/ # Documentation (auto-generated)
```
### Technology Stack
- **Manifest V3**: Latest Chrome extension standard
- **Vanilla JavaScript**: No external dependencies for performance
- **Modular CSS**: Structured stylesheets with theme support
- **Chrome APIs**: Extensive use of storage, tabs, scripting, and contextMenus APIs
## 🛡️ Security & Privacy
StorageFlow is built with security and privacy as top priorities:
- **No External Connections**: All operations are performed locally
- **Minimal Permissions**: Only requests necessary permissions
- **Data Isolation**: Respects Chrome's security model
- **No Data Collection**: Zero tracking or analytics
- **Open Source**: Full transparency of all operations
## 🔧 Development
### Prerequisites
- Google Chrome (latest version)
- Basic understanding of JavaScript and Chrome Extensions
- Text editor or IDE
### Development Setup
1. Clone the repository
2. Load as unpacked extension in Chrome
3. Make changes to source files
4. Reload extension in `chrome://extensions/`
### File Structure
```
src/
├── background/
│ └── background.js # Service worker, context menus, notifications
├── content/
│ └── content.js # Page script injection, storage monitoring
├── popup/
│ ├── popup.html # Main UI structure
│ ├── popup-controller.js # UI logic and state management
│ └── styles/ # Modular CSS architecture
└── assets/
└── icons/ # Extension icons
```
## 🤝 Contributing
Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.
### Contribution Guidelines
1. Fork the repository
2. Create a feature branch (`git checkout -b feature/AmazingFeature`)
3. Commit your changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request
## 📝 Changelog
### Version 2.0.0 (Current)
- Complete rewrite with Manifest V3 support
- Modern UI with theme support
- Enhanced import/export functionality
- Cross-tab data transfer capabilities
- Improved error handling and user feedback
- Modular CSS architecture
- Comprehensive documentation
### Version 1.0.0
- Initial release with basic storage management
- Simple import/export functionality
- Basic UI implementation
## 🐛 Known Issues
- Import preview may not display correctly for very large files (>10MB)
- Cross-domain transfers require manual confirmation
- Some websites with strict CSP may limit functionality
## 📞 Support
If you encounter any issues or have questions:
1. Check the [documentation](./docs/) for detailed information
2. Search existing issues in the GitHub repository
3. Create a new issue with detailed description and steps to reproduce
## 📄 License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
## 🙏 Acknowledgments
- Font Awesome for beautiful icons
- Inter font family for clean typography
- Chrome Extension documentation and community
- All contributors and users providing feedback
---
**Made with ❤️ for developers and power users who need better browser storage tools.**
For detailed technical documentation, see the [docs](./docs/) directory.