1.
Differences between React and React Native: React is for building web UIs using HTML, CSS,
and JS. React Native builds mobile apps using native components (View, Text) instead of
HTML/CSS, leveraging JavaScript for logic and native APIs for rendering.
2. Bridge in React Native: The bridge allows asynchronous communication between JavaScript
and native code (Objective-C/Java). JS sends commands over the bridge; native modules
execute them and send results back.
3. Components in React Native:
o View: container for layout.
o Text: displays text.
o ScrollView: scrollable container for few items.
o FlatList: efficiently renders large lists with virtualization.
o SectionList: renders grouped lists with headers.
4. Functional vs Class Components: Functional components use hooks (useState, useEffect)
and are simpler. Class components have lifecycle methods (componentDidMount) and state.
Hooks allow functional components to handle state and side effects.
5. Styling: React Native uses StyleSheet.create to define JS objects for styles. Inline styles are
also possible. Differences from CSS: no cascading, no class selectors, units are numbers
(density-independent pixels).
6. Flexbox: React Native uses Flexbox for layout. Default direction is column. Key properties:
flexDirection, justifyContent, alignItems. Differences: no CSS float/grid; all layout is flexbox-
based.
7. Navigation:
o Stack Navigator: push/pop screens like a call stack.
o Tab Navigator: bottom/top tab navigation.
o Drawer Navigator: side menu navigation. Uses react-navigation.
8. Gestures and Touch Events:
o TouchableOpacity: wraps elements for tap with opacity feedback.
o Pressable: customizable touch behavior.
o PanResponder: handles complex gestures like drag/swipe.
9. State Management:
o Context API: lightweight, global state.
o Redux: predictable state container for large apps.
o Recoil: flexible state management for component-level and global state.
10. Network Requests: Use fetch or axios. Handle offline scenarios with caching strategies using
libraries like react-query or local storage.
11. Push Notifications:
• iOS: APNS via react-native-push-notification or Firebase.
• Android: FCM via Firebase SDK. Requires permissions setup in manifest/plist.
12. Performance Optimization:
• PureComponent/React.memo prevent unnecessary re-renders.
• FlatList with keyExtractor and getItemLayout improves large list performance.
13. Access Native Features: Use native modules or libraries:
• Camera: react-native-camera
• Location: react-native-geolocation-service
• Sensors: react-native-sensors
14. Controlled vs Uncontrolled Inputs:
• Controlled: input value managed by state (value={stateVar} + onChange).
• Uncontrolled: input manages its own value (ref used to access).
15. Hot Reloading vs Fast Refresh:
• Hot Reloading: reloads only changed files, preserving state (older).
• Fast Refresh: modern, reliable, preserves state across edits, merges with React lifecycle.
16. Debugging:
• React DevTools for component inspection.
• Flipper for network, logs, performance.
• console.log for JS debugging.
17. Animations:
• Animated API: declarative animation API.
• Reanimated: high-performance, native-driven animations.
18. Offline Storage:
• AsyncStorage: key-value storage, simple.
• SQLite: relational database.
• MMKV: fast, modern key-value storage.
19. Permissions:
• iOS: modify Info.plist for camera, location, etc.
• Android: modify AndroidManifest.xml + runtime permission checks.
20. Building & Deploying:
• Android: generate signed APK/AAB (./gradlew assembleRelease)
• iOS: build IPA in Xcode.
• Submit to Play Store/App Store with correct signing, provisioning, and metadata.
