5 Console Tricks For Better Debugging in React Native

The console.log() method is the easiest way to debug your code not only in React Native but also in other JavaScript apps. Simply showing the results in the console can save you time. What if you know some console tricks which can make your debugging better?

Here, I am going through five cool console methods for a better debugging experience with console.log().

console.error()

When you are developing your mobile app with react native there would be some kind of errors that you don’t want to miss. You can use the console.error() method in such scenarios.

The console.error() throws a that specific ‘red’ color screen in your simulator so that you don’t forget to address the error.

Usage of console.error():

console.error('Unexpected Error!');
console trick react native
react native console.log tips

console.warn()

Warnings are not critical as errors but you certainly need to look into them before pushing the app into production. The console.warn method gives the developer a warning message with yellow color alerts.

So, use console.warn() method appropriately to make your app error-free.

Usage of console.warn():

console.warn('Unexpected Warning!');
console trick react native

console.table()

If your react native mobile app uses some data then you definitely need to use arrays. Arrays are very useful for storing data and hence you always monitor arrays inside your code. Use console.table() method to output arrays in table format.

This console method makes array data cleaner and neater. Showing arrays in table format definitely helps you to analyze data easily.

Usage of console.table():

let numbers = ['one', 'two', 'three', 'four', 'five'];
console.table(numbers);
console trick react native

console.count()

When you are trying to know how many times you called a specific function inside your class, the console.count() JavaScript method can help you a lot. It’s because this console method gives how many times the specific console method is called as output.

The console.count() becomes handy when you are using so many functions which are called multiple times in your code.

Usage of console.count():

componentDidMount() {
    this.count();
    this.count();
  }

  count = () => {
    console.count('count');
  };
console trick react native

console.clear()

You need to clear messages or outputs in your browser console manually to make the console clean. However, you can make use of the console.clear() method to empty the console programmatically. That’s cool, right?

I hope these five console tricks will enhance your react native debugging skills. Keep visiting this blog for more react native articles. Keep developing cool apps using react native!

1 thought on “5 Console Tricks For Better Debugging in React Native”

  1. hey mate, cool page =]
    I’m programming in react native using VSC,
    unfortunately any console.table(array) does not work for me…
    in mater of fact any console function but console.log() does not work
    any clue why?

    Reply

Leave a Reply

%d bloggers like this: