links: [[React Native MOC]]
---
# Debug React Native apps in VS Code
1. Install [VS Code Extension](https://marketplace.visualstudio.com/items?itemName=msjsdiag.vscode-react-native)
2. Open Debug Panel in VS Code
You might either see a drop down with debug options are you will be prompted to setup a file called `launch.json`
Select **create a launch.json file** and choose an option to let VS Code create the file (for example *chrome*)
Delete the configuration created by VS Code
Now you can find an option called **Add Configuration** on the right bottom, press it
You will be seeing some options choose React Native --> Debug Application --> Choose your platform to debug -->
Now there are two options
1. Application in Direct mode (with Hermes)
2. Classic (without Hermes)
Choose an option based on your app.
You can see configuration similar to this
```json
{
"name": "Debug Android",
"request": "launch",
"type": "reactnative",
"cwd": "${workspaceFolder}",
"platform": "android"
},
```
Final Steps:
Click the play button to start vs code debugger and then in your app open dev tools and select **Debug**.
Now put a break point at the place you wish to debug
That's it. 🎉
---
sources:
- [React Native VS code Extension](https://marketplace.visualstudio.com/items?itemName=msjsdiag.vscode-react-native)