Debugging and Troubleshooting Guide

Development Debugging Tools: #

React Native DevTools provides browser-based debugging with console logs, network inspection, and React component inspector. Press Ctrl+M (Android) or Cmd+D (iOS) in simulator to open dev menu. Enable Remote JS Debugging to use Chrome DevTools. Inspect component hierarchy with React DevTools browser extension. Use console.log, console.warn, and console.error for logging. Implement custom logger service for structured logging with levels. Use Reactotron for advanced debugging: state inspection, API monitoring, and async tracking. Flipper provides native debugging for iOS/Android: network, databases, layout, logs, crash reports.

Common Issues and Solutions: #

Metro bundler issues: Clear cache with npx react-native start –reset-cache or rm -rf node_modules && npm install. Module resolution errors: Check import paths, ensure case sensitivity, verify tsconfig paths. White screen on launch: Check for JavaScript errors in logs, verify main component registration. Navigation errors: Ensure all screens are registered, check navigation config. State not updating: Verify MobX observers, check for direct mutations. API connection issues: Confirm base URL in config, check network permissions, verify CORS settings. Expo CLI problems: Update with npm install -g expo-cli, clear cache with expo start -c.

Production Error Tracking: #

Integrate Sentry for crash reporting and error tracking in production. Configure Sentry in app.config.js with DSN and environment. Capture unhandled exceptions: use ErrorBoundary components, implement global error handlers. Add contextual data to errors: user ID, state snapshot, breadcrumbs. Set up alerts for critical errors. Use source maps for readable stack traces: upload during build process. Monitor performance metrics: app startup time, screen render time, API latency. Implement custom performance tracking for critical user flows. Use analytics to identify problem areas: where users drop off, what actions cause errors. Review error reports weekly and prioritize fixes by frequency and impact.