React Sight

React Sight is yet another Chrome (and Firefox) extension you can install to help you in your react-related endeavors. Note: the project is no longer actively maintained, so verify it still works with your React version before relying on it — the React Developer Tools extension covers similar ground and is actively maintained.

After installation, you'll find a new tab as part of the DevTools called “React Sight”. It displays the component hierarchy of React applications - Perfect for your own projects and for learning how organizations structure their own. This allows you to understand how the components are all connected, and by hovering over them, you can see their current states and props.