React-Sight (aalppolilappfakpmdfdkpppdnhpgifn): Extends the Developer Tools, adding a sidebar that displays React Component Hierarchy.... Read More > or Download Now >
React-Sight for Chrome
Tech Specs
- • Type: Browser Extension
- • Latest Version: 1.3.0
- • Price: Freeware
- • Offline: No
- • Developer: www.reactsight.com
User Reviews
- • Rating Average
- 2.53 out of 5
- • Rating Users
- 49
Download Count
- • Total Downloads
- 103
- • Current Version Downloads
- 62
- • Updated: April 14, 2020
React-Sight is a free Developer Tools Extension for Chrome. You could download the latest version crx file or old version crx files and install it.
More About React-Sight
A Chrome Developer tool that displays the component hierarchy of React applications - Perfect for your own projects and for learning how organizations structure their own.
After adding React Sight to your browser, you will have a new tab in your Chrome Dev Tools. React Sight will read React's virtual DOM and render an interactive tree diagram of the components rendered on the page. By hovering over the nodes, you can see the components state and props and how they change in real time.
***SET UP***
1. Install React Dev Tools
2. Install React Sight
3. Run your React application, or open (almost!) any website running React!
4. Open Chrome Developer Tools -> Click on React Sight panel
*If you are running local file URLs, make sure to enable "Allow access to file URLs" in the extension settings for both React Dev Tools and React Sight
Be sure to check us out on GitHub and www.reactsight.com!
-----
This has been the side project and & passion of just a few devs. There are some bugs, and it won't work on every application. If it's not working for your project, please send use an email at reactsight@gmail.com and we'll take a look at how we can make it work!
Thanks for checking out React Sight!
After adding React Sight to your browser, you will have a new tab in your Chrome Dev Tools. React Sight will read React's virtual DOM and render an interactive tree diagram of the components rendered on the page. By hovering over the nodes, you can see the components state and props and how they change in real time.
***SET UP***
1. Install React Dev Tools
2. Install React Sight
3. Run your React application, or open (almost!) any website running React!
4. Open Chrome Developer Tools -> Click on React Sight panel
*If you are running local file URLs, make sure to enable "Allow access to file URLs" in the extension settings for both React Dev Tools and React Sight
Be sure to check us out on GitHub and www.reactsight.com!
-----
This has been the side project and & passion of just a few devs. There are some bugs, and it won't work on every application. If it's not working for your project, please send use an email at reactsight@gmail.com and we'll take a look at how we can make it work!
Thanks for checking out React Sight!
