What is Flipper in React Native?
Answer
Flipper is a desktop debugging platform for mobile apps (iOS, Android, React Native) developed by Meta. It provides a visual interface for inspecting, debugging, and profiling your React Native app. Core features: (1) Network inspector: see all network requests with URL, method, headers, request/response body, status codes, timing; (2) React DevTools: inspect component tree, props, state, hooks — integrated React DevTools; (3) Layout inspector: inspect view hierarchy, dimensions, styles — like Chrome DevTools Elements panel for native views; (4) Crash reporter: symbolicated crash reports; (5) Shared Preferences / AsyncStorage viewer — inspect stored values; (6) SQLite viewer; (7) Logs viewer — device logs; (8) Hermes Debugger — JS debugging when using Hermes engine. Setup: Flipper desktop app + Flipper SDK in React Native (included by default in recent RN versions). Status of Flipper (2024): Meta announced Flipper will be removed from React Native default setup (React Native 0.74+). The New Architecture uses new DevTools. React Native DevTools (replacing Flipper): React Native 0.73+ ships with a new DevTools experience based on Chrome DevTools Protocol. Open via j in Metro console or npx react-native start. Provides: JS debugging, network requests, profiling. For existing projects: Flipper still works and is actively maintained by the community even as Meta moves away from it.
Previous
What is the useEffect hook and common patterns in React Native?
Next
What are background tasks in React Native?
More React Native Questions
View all →- Intermediate What is the React Native New Architecture?
- Intermediate What is React Navigation nested navigators?
- Intermediate How do you handle network requests in React Native?
- Intermediate What are Native Modules in React Native?
- Intermediate What is the difference between react-native-reanimated and the Animated API?