realclientmirror

RealClient Mirror

Overview

RealClient Mirror is a Chrome extension that helps web developers and designers test their websites on a variety of device configurations without needing physical devices.

Features

• Realistic Device Simulation: View your websites in accurate device dimensions including popular phones, tablets, and desktops.

• URL Pattern Matching: Automatically apply specific device profiles to certain websites using customizable URL patterns.

• Custom Device Profiles: Create and save your own device profiles with specific dimensions, user agents, and scale factors.

• Orientation Switching: Instantly toggle between portrait and landscape orientations with a single click.

• Navigation Support: Browse through your website naturally with full navigation support - the URL updates properly as you navigate within the simulated device.

• URL Bar: Easily see and modify the current URL within the simulation.

• Keyboard Shortcuts: Use the Escape key to quickly exit the simulation mode.

• Cross-Origin Support: Works across domains and handles cross-origin navigation gracefully.

Installation

From Chrome Web Store

1. Visit the RealClient Mirror page on the Chrome Web Store
2. Click “Add to Chrome”

Manual Installation (Developer Mode)

1. Download or clone this repository
2. Open Chrome and go to chrome://extensions/
3. Enable “Developer mode” in the top-right corner
4. Click “Load unpacked” and select the extension directory

Usage

1. Click the RealClient Mirror icon in your browser toolbar
2. Add URL patterns for websites you want to automatically apply device profiles to
3. Select a device profile or create your own
4. Browse to a matching website, and the extension will automatically apply the selected device profile
5. Use the controls at the bottom of the screen to switch devices or toggle orientation
6. Press Escape to exit the responsive mode

Creating Custom Device Profiles

1. Click the RealClient Mirror icon in your browser toolbar
2. Click “Add New Profile”
3. Enter a name for your profile
4. Specify the width, height, and other optional settings
5. Click “Save Profile”

Privacy

RealClient Mirror does not collect any user data. All settings are stored locally in your browser. See our Privacy Policy for more details.

License

MIT License

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

Contact

If you have any questions or suggestions, please open an issue in this repository.