dpploomkdkooepkpbdpjkgfnkpfhbbfp
LocatorJS Chrome Extension - option-click to code (ReactJS) Stop wasting time searching for React component source code. With LocatorJS, simply Option+Click (Alt+Click on Windows) any element on your webpage to instantly jump to its source code in your editor. Perfect for: • Large codebases where finding components is time-consuming • Onboarding new developers to unfamiliar projects • Debugging complex component trees • Speeding up your daily development workflow How it works: 1. Install the extension 2. Open your React app in development mode 3. Hold Option (or Alt) and click any component 4. Your editor opens directly to that component's source file Works with VSCode, IntelliJ IDEA, WebStorm, and other popular editors. Compatible with React, Preact, Solid, and Svelte projects. This is a developer tool designed for local development environments (localhost). It helps you navigate your own code faster, saving hours of searching through project files.
Alloy · AI Prototyping for Product Management
Lifelike AI prototyping tool for Product Managers with an existing product Alloy is the world's first tool for prototypes that look exactly like your product. Capture any page of your web app from the browser and instantly turn it into an interactive prototype—perfect for exploring features, validating ideas, and sharing with stakeholders. ➤ What you can do • Capture from the browser: One click to “Capture page” on any screen of your product. • Get lifelike results: Prototypes stay on brand and reflect your component library and design system—no off-brand mockups. • Design by conversation: Use natural-language prompts to add features, remix flows, and refine details; switch to visual editing when needed. • Improve with every capture: Build a reusable library as you capture more pages; results get faster and more accurate. • Share instantly: Send a link to teammates or customers for quick review and feedback. ➤ Built for modern product teams Bring ideas, insights, and customer requests straight into Alloy from the tools you already use via integrations—so you can go from signal to prototype in minutes. Enterprise-grade protections: encryption in transit and at rest, annual third-party penetration testing, SSO (SAML/OIDC) on Enterprise, and SOC 2 Type II in progress. • Install the extension and sign in. • Open your app and click “Capture page.” • Prototype and share—iterate by prompt or visual edits and send a link. ➤ Permissions Alloy only captures the pages you choose when you activate the extension and click “Capture page.” Data is stored securely in your Alloy workspace.
GitHub Conventional Comments
A browser extension to help you write conventional comments. 🎯 GitHub Conventional Comments Make your code reviews clear, actionable, and consistent. This extension brings Conventional Comments to GitHub, helping you give structured feedback with clear intent and priority. ✅ Comment Types: Issue, Suggestion, Question, Nitpick, Todo, etc. ⚠️ Decorators: Blocking, Non-blocking, If Minor 🎚️ Modes: Button, Trigger (!), or Hybrid 🌗 Supports light & dark GitHub themes ⚡ Fast, keyboard-friendly, and seamlessly integrated Install the extension Leave meaningful comments with context and clarity
Click To Component
Click a component in your browser to instantly open the source in VS Code, WebStorm, Cursor, TRAE, etc. 1. Option+Click(Alt+Click) a component in your browser to instantly open the source in VS Code. 2. Option+RightClick(Alt+RightClick) opens a context menu with the parent components. 3. Support custom configuration to open WebStorm, Cursor, GitHub, etc. 4. Support `data-__source-code-location` - Vue using [vue-click-to-component](https://www.npmjs.com/package/vue-click-to-component) generate. - React using [babel-plugin-transform-react-jsx-data-source-code-location](https://www.npmjs.com/package/babel-plugin-transform-react-jsx-data-source-code-location) generate. 5. Support React `__source` (generated by [@babel/plugin-transform-react-jsx-source](https://babeljs.io/docs/babel-plugin-transform-react-jsx-source)). You can config `Site access` to `On Click` or `On specific sites` for this extension to control click-to-component script inject.
React-DomPicker
Click any UI element to instantly jump to its React source code in VS Code. Perfect for React + Tailwind + ShadCN projects. React-DomPicker connects your browser to VS Code. Click any element in your React app and VS Code opens the exact source file at the matching JSX node. 1. Install the companion VS Code extension (React-CodeBridge): https://marketplace.visualstudio.com/items?itemName=RajithaDisanayaka.react-codebridge 2. Install this Chrome extension 3. Run your React app on localhost 4. Click the toolbar icon to activate the picker 5. Click any element on the page - One-click navigation from browser to source code - Hover to outline elements - Shift+Click to select the parent element - Esc to turn the picker off - Ctrl+Shift+P (Cmd+Shift+P on Mac) to toggle from the keyboard - Floating status indicator on the page Works with - React 16.8, 17, 18, 19 - Next.js (App Router and Pages Router, including React Server Components) - Vite, Create React App, Remix - TypeScript and JavaScript - Tailwind, ShadCN, Material UI, styled-components, CSS Modules - React-CodeBridge VS Code extension installed - A React dev build running on localhost or 127.0.0.1 - Runs entirely on your machine - No data collection, no analytics, no external servers - Activates only on localhost and 127.0.0.1 For pixel-perfect click-to-code on every element, install code-inspector-plugin in your project config. React-DomPicker reads its output automatically. Useful for Next.js projects with React Server Components, i18n, or computed text.
