react.dev/content/blog/2015-09-02-new-react-develo...

---
title: "New React Developer Tools"
layout: post
author: [sophiebits]
---

A month ago, we [posted a beta](/blog/2015/08/03/new-react-devtools-beta.html) of the new React developer tools. Today, we're releasing the first stable version of the new devtools. We're calling it version 0.14, but it's a full rewrite so we think of it more like a 2.0 release.

![Video/screenshot of new devtools](../images/blog/devtools-full.gif)

It contains a handful of new features, including:

* Built entirely with React, making it easier to develop and extend
* Firefox support
* Selected component instance is available as `$r` from the console
* More detail is shown in props in the component tree
* Right-click any node and choose "Show Source" to jump to the `render` method in the Sources panel
* Right-click any props or state value to make it available as `$tmp` from the console
* Full React Native support

## Installation {#installation}

Download the new devtools from the [Chrome Web Store](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi) and on [Firefox Add-ons](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/) for Firefox. If you're developing using React, we highly recommend installing these devtools.

If you already have the Chrome extension installed, it should autoupdate within the next week. You can also head to `chrome://extensions` and click "Update extensions now" if you'd like to get the new version today. If you installed the devtools beta, please remove it and switch back to the version from the store to make sure you always get the latest updates and bug fixes.

If you run into any issues, please post them on our [react-devtools GitHub repo](https://github.com/facebook/react-devtools).
New devtools blog post 9 years ago			`---`
			`title: "New React Developer Tools"`
			`layout: post`
Add new docs website (#10896) Adds a new docs website, built with Gatsby JS, to replace the old Jekyll site. Source code for the new site lives in /www (although markdown and YML data still comes from the legacy /docs folder). Changes to either markdown or website source code can be previewed on Netlify. The react-js bot should automatically add comments to each PR with preview links. (This preview is generated by running the newly-added yarn build:docs command in the root package.json.) The majority of the changes in this PR are contained within the new /www directory. However some minor modifications have been made to existing content in the /docs directory: * Modified frontmatter author block to always be an array * Small markdown formatting tweaks 7 years ago			`author: [sophiebits]`
New devtools blog post 9 years ago			`---`

Add new docs website (#10896) Adds a new docs website, built with Gatsby JS, to replace the old Jekyll site. Source code for the new site lives in /www (although markdown and YML data still comes from the legacy /docs folder). Changes to either markdown or website source code can be previewed on Netlify. The react-js bot should automatically add comments to each PR with preview links. (This preview is generated by running the newly-added yarn build:docs command in the root package.json.) The majority of the changes in this PR are contained within the new /www directory. However some minor modifications have been made to existing content in the /docs directory: * Modified frontmatter author block to always be an array * Small markdown formatting tweaks 7 years ago			`A month ago, we [posted a beta](/blog/2015/08/03/new-react-devtools-beta.html) of the new React developer tools. Today, we're releasing the first stable version of the new devtools. We're calling it version 0.14, but it's a full rewrite so we think of it more like a 2.0 release.`
New devtools blog post 9 years ago
Fixes to markdown content/paths 7 years ago			`![Video/screenshot of new devtools](../images/blog/devtools-full.gif)`
New devtools blog post 9 years ago
			`It contains a handful of new features, including:`

			`* Built entirely with React, making it easier to develop and extend`
			`* Firefox support`
			* Selected component instance is available as `$r` from the console
			`* More detail is shown in props in the component tree`
			* Right-click any node and choose "Show Source" to jump to the `render` method in the Sources panel
			* Right-click any props or state value to make it available as `$tmp` from the console
			`* Full React Native support`

reapply, correctly generating links 6 years ago			`## Installation {#installation}`
New devtools blog post 9 years ago
Update 2015-09-02-new-react-developer-tools.md (#2252) 5 years ago			`Download the new devtools from the [Chrome Web Store](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi) and on [Firefox Add-ons](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/) for Firefox. If you're developing using React, we highly recommend installing these devtools.`
New devtools blog post 9 years ago
			If you already have the Chrome extension installed, it should autoupdate within the next week. You can also head to `chrome://extensions` and click "Update extensions now" if you'd like to get the new version today. If you installed the devtools beta, please remove it and switch back to the version from the store to make sure you always get the latest updates and bug fixes.

			`If you run into any issues, please post them on our [react-devtools GitHub repo](https://github.com/facebook/react-devtools).`