maverick/docbrown
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Preact/React developer tools documentation. (#5884)

Browse source
This commit is contained in:
Nick Taylor 2020-02-05 17:21:09 -05:00 • committed by GitHub
parent 52759c9427
commit 5ede660601
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 17 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
docs/frontend/debugging.md
View file

@ -9,11 +9,9 @@ title: Debugging
Browsers ship with their own developer tools. These are amazing tools to help
you debug your web application. Consider learning how to use them.
- [Chrome Developer
Tools](https://developers.google.com/web/tools/chrome-devtools)
- [Chrome Developer Tools](https://developers.google.com/web/tools/chrome-devtools)
- [Firefox Developer Tools](https://developer.mozilla.org/en-US/docs/Tools)
- [Safari Developer
Tools](https://support.apple.com/en-ca/guide/safari/sfri20948/mac)
- [Safari Developer Tools](https://support.apple.com/en-ca/guide/safari/sfri20948/mac)
## Visual Studio Code
@ -21,10 +19,10 @@ you debug your web application. Consider learning how to use them.
editor that allows you to debug many languages including JavaScript. Thanks to
remote debugging technologies, we can debug our frontend code in VS Code. When
you clone the DEV repository and open the project in VS Code, you will be
prompted to install recommended extensions which include the [Chrome
Debugger](https://code.visualstudio.com/blogs/2016/02/23/introducing-chrome-debugger-for-vs-code)
and the [Edge
Debugger](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-edge).
prompted to install recommended extensions which include the
[Chrome Debugger](https://code.visualstudio.com/blogs/2016/02/23/introducing-chrome-debugger-for-vs-code)
and the
[Edge Debugger](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-edge).
Setup:
@ -45,3 +43,14 @@ menu for debugger in VS Code')
If you do not see your editor here, consider contributing to the documentation.
😉
## Preact Developer Tools
Preact has their
[own developer tools](https://preactjs.github.io/preact-devtools/) in the form
of a browser extension. These tools are currently supported for Preact version
10.x and up.
DEV currently uses Preact 8.x so the Preact developer tools are not an option,
however Preact 8.x+ is compatible with the React developer tools extension which
is available for Chrome and Firefox.