5 Console Tricks For Better Debugging in React Native

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

Here, I am going through five cool console methods for better debugging experience in React Native.

console.error()

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

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

console.warn()

Warnings are not critical as errors but you certainly need to look into before pushing the app into production. 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 more cleaner and neater. Showing arrays in table format definitely help you to analyse 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 called as output.

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 console.clear() method to empty the console programmatically. That’s cool, right?

Usage of console.clear():

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?

Leave a Reply

%d bloggers like this: