Debugging Node & React Apps


The Daily Slate | Debugging Node & React Apps
Debugging is the most frustrating aspect of programming for beginners and professionals alike. In this series, we explore the overall thought-process behind debugging in general and then we dive into a handful of bugs in the Node and React environments specifically. This is a great intro to the debugging process for beginners and for those new to React, this is a good place to see typical React errors and how to read the crash logs.

Units


1. Node Crashes

In video one, we set up a simple Node/Express project and induce a couple crashes on purpose. We then debug the crashes very slowly while explaining the step-by-step thought process involved. We use the error logs to guide our process and narrow down the root of the cause.

2. Runtime Errors

In this video, we explore errors that result in unexpected outcomes rather than crashes. These are called runtime errors and they are typically harder to debug since they do not come with error logs, stack traces or any indication as to the root cause. We encounter a few runtime errors and step through he code until we find the mistakes.

3. Simple React Bugs

In this video, we set up the React side of the project and encounter simple bugs on the frontend: typos, import errors and such. We use the browswer console as well as the Webpack shell to identify these bugs and correct them. The process is fundamentally the same but the tools are different and reading React errors takes some getting used to.

4. "Full Stack" Bugs

In this video, we deal with bugs that impact both sides of the stack. Often, the data we get from an API may not match the structure we expect or the API itself may not support the request. We explore these kinds of errors and how to correct them when combining both the Node and React environments.

Membership

Premium

$19.99/month

Join as a premium member for $19.99 each month and receive unlimited access to all tutorials, code samples, and forums on the site.

  • Downloadable Code Samples
  • Downloadable Videos
  • Q & A Forum Access
  • Discounts on Live Courses
Join

Basic

Free

Join as a basic member to gain access to the free tutorials, get notifications when new tutorials and courses are published, and participate in the Q&A forums.



Join