Debug React Native Android iOS App Using Console.log Tutorial

Console.log() is a inbuilt predefine function in react native. This function is created for both Android and iOS applications and used to maintain and debug errors in apps on run time. Console.log() helps us to detect errors in our code. For example : If our application is crashing at a point of stage so by defining Console.log() at multiple places we can detect errors and also know the last line of code which is working. Console.log() display a message in command prompt window in Windows and in MAC it shows a message on Terminal. So in this tutorial we would going to learn about Debug React Native Android iOS App Using Console.log() Tutorial So lets’s get started 🙂 .

Contents in this example Debug React Native Android iOS App Using Console.log Tutorial:

1. Import StyleSheet, View and Button component in your project.

2. Create a function named as ConsoleFunction() and define Console.log() code inside it. We are printing 3 different type of statements inside the Console.

3. Create a Button inside the render’s return block and call the ConsoleFunction() function on Button onPress event.

4. Create Style for Root View.

5. Complete source code for App.js File :

Screenshot :

Debug React Native Android iOS App

6. Run react-native run-android command in Command Prompt in windows to run android apps and In MAC run react-native run-ios to run iOS application.

7. After successfully starting the app in emulator or real device, we do not close the NPM server and we would again execute react-native log-android  command in command prompt in windows and In iOS we would use react-native log-ios  command in terminal.

Screenshot of command prompt in Windows after executing react-native log-android command :

As you can see in above screenshot three different type of values is printing on command prompt passed in console.log() function after button click.

2 Comments

  1. hi admin i am also facing same problem how to solve this?

  2. hi admin ,i am begginer of the reactnative ,how to add images in the react native.plz guide

Leave a Reply

Your email address will not be published. Required fields are marked *