Debugging React

Articles & Tutorials

Supercharge your logging and debugging (react.christmas)
Dec 13, 2018
How to use Reactrotron to really improve your React and React Native development
  • Hannes Waller
Hunting JS memory leaks in React Native apps (blog.swmansion.com)
Jul 26, 2018
In this article, we gathered the typical approaches to debug and solve memory problems in a React Native app.
  • Krzysztof Magiera
Debugging a Create React App with VS Code (elijahmanor.com)
Feb 05, 2018
In this post we’ll look at how to configure Visual Studio Code to debug React Components and Jest Unit Tests inside a web application that was created by create-react-app.
  • Elijah Manor
Debugging React Native and Redux with React Native Debugger (blog.reactnativecoach.com)
Nov 24, 2017
Every developer will get to a point when they’re working where they’re going to have to debug their code.
  • Gunnari Auvinen
React-Native: Debugging like a God (medium.com)
Sep 06, 2017
Let’s talk about debugging and performance measurement.
  • Shahen Hovhannisyan

Video Guides & Talks

Sneak peek at the DevTools Profiler with "interactions" (youtube.com)
Jul 28, 2018
Prototype UI built on top of the new React "Profiler" component.
Sneak peek at new React DevTools "profiler" feature (youtube.com)
Jun 21, 2018
Prototype UI built on top of the new React "Profiler" component.
Use React DevTools (youtube.com)
May 14, 2018
This is a quick intro to react devtools.
Debugging a Create React App with VS Code (youtube.com)
Feb 05, 2018
In this post we’ll look at how to configure Visual Studio Code to debug React Components and Jest Unit Tests inside a web application that was created by create-react-app.
React Devtools theme editor GUI (youtube.com)
May 30, 2017
Walkthrough video of the new built-in themes editor.
React devtools theme editor preview panel (youtube.com)
May 29, 2017
Another demo of the work-in-progress theme editor for React devtools.
Creating a custom React dev tools theme (youtube.com)
May 25, 2017
This video walks through the process of creating a custom theme for React dev tools- from GitHub fork to PR submission.

Courses & Video Series

React: Testing and Debugging (lynda.com)
Jul 05, 2017
Learn how to test, debug, and optimize your React code with tools like Jest, Chrome, ESLint, and flow.

Podcast Episodes

React Perf Devtool with Nitin Tulswani (reactpodcast.com)
May 08, 2018
Nitin Tulswani is a prolific developer and the creator of react-perf-devtool, a library that helps with profiling the performance of your React components since react-addons-perf was deprecated in React 16. In this episode we discuss Nitin's approach to writing code and the motivation behind several of his open source projects.

Libraries

react-hot-loader (gaearon.github.io)10246
v4.12.0
Jun 30, 2019
Tweak React components in real time
redux-devtools (github.com)10618
v3.5.0
Dec 22, 2018
DevTools for Redux with hot reloading, action replay, and customizable UI.