React Native Core Questions and Answers

1. What are the core components of React

Native?
React Native provides several built-in components that are
essential for building mobile applications:
 View – A container for other UI elements, similar to
<div> in web.
 Text – Used to display text.
 Image – Used for displaying images.
 ScrollView – A scrollable container for displaying
content.
 FlatList – A performant way to render large lists.
 TouchableOpacity / TouchableHighlight – Used
for handling touch interactions.
 TextInput – Used for user input fields.
2. How does React Native bridge work?
React Native uses a bridge to facilitate communication
between JavaScript and native code (Objective-C/Swift for iOS,
Java/Kotlin for Android).
 JavaScript runs on a separate thread and
communicates with the native modules through a bridge.
 The bridge converts JavaScript code into native API
calls asynchronously, reducing performance overhead.
 New architectures like JSI (JavaScript Interface)
and Fabric aim to replace the bridge with a more direct
and performant approach.
3. What is the difference between React
Native and ReactJS?
Feature React Native ReactJS
Platform Mobile (iOS, Android) Web (Browsers)
UI Uses built-in native Uses HTML, CSS for
Components components UI
Rendering Uses native APIs for Uses the DOM for
rendering rendering
Navigation Uses libraries like React Uses React Router
Navigation
Performance Near-native performance Depends on browser
rendering
4. How do you optimize performance in a
React Native app?
 Use PureComponent/memo – Prevents
unnecessary re-renders.
  Use FlatList instead of ScrollView – Efficiently
renders large lists.
 Optimize images – Use smaller sizes, WebP
format, and cache images.
 Reduce re-renders – Use useCallback and
useMemo.
 Minimize state updates – Keep state updates
localized.
 Enable Hermes – Optimizes JavaScript execution
on Android.
5. Explain how React Native handles
rendering components.
React Native follows a reconciliation process to efficiently
update the UI:
 When state or props change, React Native diffs the
Virtual DOM with the previous version.
 Only changed components are updated, minimizing
performance impact.
 The React Native bridge sends UI updates to the
native layer for rendering.
 The new Fabric architecture improves this
process by enabling synchronous rendering.
6. What are React Hooks? Can you name a
few and their use cases?
React Hooks are functions that allow you to use state and
lifecycle methods in functional components.
 useState – Manages state in functional
components.
 useEffect – Handles side effects like API calls.
 useContext – Accesses context values without
prop drilling.
 useRef – References a DOM element or persists
values across renders.
 useMemo – Memoizes expensive calculations to
improve performance.
 useCallback – Memoizes functions to prevent
unnecessary re-renders.
7. What is the difference between useEffect
and componentDidMount?
Feature useEffect componentDidMount
Type Hook Lifecycle method
(class-based)
Execution Runs after render Runs once after initial
 render
Cleanup Can return a cleanup Uses
function componentWillUnmoun
t
Dependency Uses [] to mimic No dependency array
Array componentDidMount needed
8. What is the difference between functional
and class components?
Feature Functional Class Component
Component
Syntax Uses functions Uses ES6 classes
State Uses useState Uses this.state
Management hook
Lifecycle Uses useEffect, Uses lifecycle methods
Methods useMemo, etc. (componentDidMount)
Performance More performant Slightly slower due to this
due to lack of this binding
9. How does React Native handle gestures
and animations?
 Gestures – Managed using libraries like react-
native-gesture-handler for smooth touch handling.
 Animations – Achieved using:
 Animated API – Used for declarative
animations.
 LayoutAnimation – For simple UI updates.
 Reanimated – More performant animations
using native drivers.
 Lottie – For complex animations like loading
screens.
10. How do you debug a React Native
application?
 React Native Debugger – Standalone debugger
for inspecting state, network requests, and performance.
 Chrome DevTools – Inspect network calls and logs
using react-native-debugger.
 Flipper – A powerful debugging tool provided by
Facebook.
 Reactotron – Helps with debugging Redux state
and network requests.
 Console.log – Basic debugging using console.log
statements.
  Breakpoints in VS Code – Use VS Code’s
debugger to pause execution.
 Using Expo Debugger – If using Expo, debug
using Expo Developer Tools.
State Management in React Native
1. What are the different ways to manage
state in a React Native app?
State in a React Native app can be managed using:
1. useState Hook – Best for local component state.
2. useReducer Hook – Suitable for more complex
state logic.
3. Context API – Used for global state management
without third-party libraries.
4. Redux – Centralized state management for larger
applications.
5. Zustand – Lightweight alternative to Redux with
simpler API.
6. MobX – Uses observables for reactive state
management.
7. Recoil – Provides atomic state management with
better performance.
8. Apollo Client – Manages state in GraphQL-based
applications.
2. How does Redux work in React Native?
Redux follows a unidirectional data flow:
1. Store – Centralized place where the entire app
state is stored.
2. Actions – Describes what should change in the
state (e.g., { type: 'INCREMENT' }).
3. Reducers – Pure functions that take the current
state and action, returning a new state.
4. Dispatch – Triggers actions to update the state.
5. Selectors – Used to extract specific data from the
store.
Example flow:
// Action
const increment = () => ({ type: 'INCREMENT' });

// Reducer
const counterReducer = (state = 0, action) => {
switch (action.type) {
case 'INCREMENT': return state + 1;
default: return state;
}
};

// Store
const store = createStore(counterReducer);
store.dispatch(increment()); // Updates state
3. What is the difference between Redux and
Context API?
Feature Redux Context API
Use Case Large, complex Small to medium
applications applications
Performan Optimized with selective Causes re-renders in
ce updates consumers
Middlewar Supports middleware No built-in middleware
e (Thunk/Saga)
Boilerplate Requires setup (actions, Minimal setup required
reducers)
Debugging Redux DevTools No built-in debugging
available tools
Use Redux for large-scale applications and Context API for
simple state sharing.
4. How do you handle asynchronous state
updates in Redux?
Since Redux is synchronous by default, we use middleware like
Redux Thunk or Redux Saga to handle async operations
such as API calls.
Example with Redux Thunk:
// Action creator with async API call
export const fetchData = () => async (dispatch) => {
dispatch({ type: 'FETCH_START' });
try {
const response = await
fetch('https://api.example.com/data');
const data = await response.json();
dispatch({ type: 'FETCH_SUCCESS', payload: data });
} catch (error) {
dispatch({ type: 'FETCH_ERROR', error });
}
};
5. What is Redux Saga/Thunk, and when
should you use them?
Feature Redux Thunk Redux Saga
Type Middleware for async Middleware for handling side
 logic effects
Approach Uses async/await in Uses generator functions
actions
Complexi Simple, easy to More complex, powerful
ty implement
Best for Basic API calls, Complex async flows,
simple logic background tasks
• Use Redux Thunk for simple API calls.
 Use Redux Saga for advanced use cases like
polling, caching, and background tasks.
6. How do you structure a Redux store in a
React Native project?
A well-structured Redux project follows a modular structure:
src/
│── store/
│ ├── actions/
│ │ ├── authActions.js
│ │ ├── userActions.js
│ ├── reducers/
│ │ ├── authReducer.js
│ │ ├── userReducer.js
│ │ ├── index.js (combines reducers)
│ ├── middleware/
│ │ ├── thunk.js (if using Thunk)
│ │ ├── saga.js (if using Saga)
│ ├── store.js
│── components/
│── screens/
│── navigation/
│── App.js
Example store.js configuration:
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers';

const store = createStore(rootReducer,

applyMiddleware(thunk));

export default store;

This keeps the Redux logic organized and scalable.

Navigation & Routing in React Native

1. What are the differences between React
Navigation and React Native Navigation?
Feature React Navigation React Native
Navigation
Implementati Pure JavaScript (built Uses native navigation
on on React Native) components
Performance Slightly slower (due to Faster, uses native
JS-based routing) transitions
Customizatio Highly customizable More native-like but
n via JS APIs limited customization
Ease of Use Easier to set up and More complex to
use configure
Best For Most React Native High-performance
apps native apps
• Use React Navigation if you need flexibility and easier
integration.
 Use React Native Navigation if you require
better native performance.

2. How do you implement deep linking in

React Native?
Deep linking allows users to open a specific screen in the app
from a URL or external app.
Steps to implement deep linking:
1. Define the linking configuration in React
Navigation
const linking = {
prefixes: ['myapp://', 'https://myapp.com'],
config: {
screens: {
Home: 'home',
Profile: 'profile/:id',
},
},
};

export default function App() {

return (
<NavigationContainer linking={linking}>
<Stack.Navigator>
<Stack.Screen name="Home"
component={HomeScreen} />
 <Stack.Screen name="Profile"
component={ProfileScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}
1. Handle deep links on Android
(AndroidManifest.xml)
<intent-filter>
<action android:name="android.intent.action.VIEW"/>
<category
android:name="android.intent.category.DEFAULT"/>
<category
android:name="android.intent.category.BROWSABLE"/>
<data android:scheme="myapp"
android:host="myapp.com"/>
</intent-filter>
1. Handle deep links on iOS (Info.plist)
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<string>myapp</string>
</array>
</dict>
</array>

3. How do you pass parameters between

screens in React Navigation?
You can pass parameters using the navigation.navigate
function.
Passing parameters
navigation.navigate('Profile', { userId: 123 });
Accessing parameters in the destination screen
const { userId } = route.params;
console.log(userId);
Setting default parameters
const { userId = 0 } = route.params || {};
Updating screen parameters dynamically
navigation.setParams({ userId: 456 });

4. What are stack navigation, tab navigation,

and drawer navigation?
 1. Stack Navigation – Navigates between screens
like a stack (push & pop behavior).
 Example: Moving between screens in a linear
flow.
 Uses: createStackNavigator().
2. import { createStackNavigator } from '@react-
navigation/stack';
3. const Stack = createStackNavigator();
4.
5. Tab Navigation – Uses bottom tabs to switch
between screens.
 Example: Instagram bottom tabs (Home,
Search, Profile).
 Uses: createBottomTabNavigator().
6. import { createBottomTabNavigator } from '@react-
navigation/bottom-tabs';
7. const Tab = createBottomTabNavigator();
8.
9. Drawer Navigation – Uses a side menu drawer for
navigation.
 Example: Gmail's side menu.
 Uses: createDrawerNavigator().
10. import { createDrawerNavigator } from '@react-
navigation/drawer';
11. const Drawer = createDrawerNavigator();
12.

5. How do you handle navigation state

persistence in React Native?
Navigation state persistence ensures the app restores the last
visited screen after being closed or restarted.
Steps to persist navigation state:
1. Enable persistence in NavigationContainer
import AsyncStorage from '@react-native-async-storage/async-
storage';

const PERSISTENCE_KEY = 'NAVIGATION_STATE';

export default function App() {

const [isReady, setIsReady] = React.useState(false);
const [initialState, setInitialState] = React.useState();

React.useEffect(() => {
const restoreState = async () => {
 const savedState = await
AsyncStorage.getItem(PERSISTENCE_KEY);
if (savedState) {
setInitialState(JSON.parse(savedState));
}
setIsReady(true);
};

restoreState();
}, []);

if (!isReady) return null;

return (
<NavigationContainer
initialState={initialState}
onStateChange={(state) =>
AsyncStorage.setItem(PERSISTENCE_KEY,
JSON.stringify(state))}
>
<Stack.Navigator>
<Stack.Screen name="Home"
component={HomeScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}
This ensures that when the app restarts, it restores the last
navigation state.

Native Modules & Bridges in React Native

1. How do you create a native module in
React Native?
A native module allows React Native to communicate with
platform-specific code (Java/Kotlin for Android,
Objective-C/Swift for iOS).
Steps to create a native module in Android (Java/Kotlin)
1. Create a new Java class in
android/app/src/main/java/com/project/
package com.project;

import android.widget.Toast;
import com.facebook.react.bridge.ReactApplicationContext;
import
com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;

public class ToastModule extends

ReactContextBaseJavaModule {
public ToastModule(ReactApplicationContext reactContext) {
super(reactContext);
}

@Override
public String getName() {
return "ToastModule";
}

@ReactMethod
public void showToast(String message) {
Toast.makeText(getReactApplicationContext(), message,
Toast.LENGTH_SHORT).show();
}
}
1. Register the module in MainApplication.java
import com.project.ToastModule;

@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new CustomReactPackage() // Register package
);
}
1. Expose it to JavaScript
import { NativeModules } from 'react-native';
const { ToastModule } = NativeModules;

ToastModule.showToast('Hello from Native Module!');

2. What are the steps to integrate native

code in a React Native app?
1. Create the native module in Java/Kotlin (Android)
or Objective-C/Swift (iOS).
2. Expose methods using @ReactMethod
(Android) or RCT_EXPORT_METHOD (iOS).
3. Register the module in ReactPackage
(Android) or RCTBridgeModule (iOS).
 4. Access it in JavaScript using NativeModules.
5. Link it properly (for manual linking in older
versions).

3. How does communication happen between

JavaScript and native code?
React Native uses a bridge for communication:
 JS → Native: Using NativeModules (e.g.,
NativeModules.ToastModule.showToast('Hello')).
 Native → JS: Using callbacks, Promises, or
EventEmitters.
Example of sending data from Native to JavaScript
(Android)
import
com.facebook.react.modules.core.DeviceEventManagerModule
;

public void sendEventToJS(String eventName, String message)

{
getReactApplicationContext()
.getJSModule(DeviceEventManagerModule.RCTDeviceEve
ntEmitter.class)
.emit(eventName, message);
}
Receive event in JavaScript
import { NativeEventEmitter, NativeModules } from 'react-
native';

const eventEmitter = new

NativeEventEmitter(NativeModules.ToastModule);
eventEmitter.addListener('eventName', (message) => {
console.log(message);
});

4. Have you worked with third-party native

modules? How do you handle issues with
them?
Yes, working with third-party native modules like react-native-
device-info or react-native-reanimated is common.
Handling issues with third-party native modules
1. Check installation steps – Ensure dependencies
are installed and linked (react-native link or pod install for
iOS).
 2. Use the correct versions – Check compatibility
with React Native versions.
3. Manually link if auto-linking fails – Some older
modules require manual linking.
4. Fix build issues – If a module doesn't compile,
update Gradle/Xcode settings.
5. Modify native code if necessary – Sometimes,
you need to tweak the native code inside node_modules.
Example: Fixing issues with react-native-reanimated
 Ensure Reanimated is properly installed in
babel.config.js:
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
plugins: ['react-native-reanimated/plugin'],
};

5. Can you explain TurboModules and how

they improve React Native performance?
TurboModules is a new React Native architecture that
enhances performance by improving the way native modules
are loaded and accessed.
How TurboModules improve performance:
1. No need for a bridge – Uses JSI (JavaScript
Interface) for direct communication instead of a slow
bridge.
2. Lazily loaded modules – Only loads modules
when needed, reducing startup time.
3. Synchronous native calls – Allows synchronous
execution of native code, improving UI performance.
4. Better memory management – Reduces memory
overhead compared to the traditional bridge.
Current adoption:
 TurboModules are part of the new Fabric
architecture in React Native.
 Some libraries like react-native-reanimated v2
already use JSI instead of the old bridge.

Performance Optimization in React Native

1. What are the best practices to improve
React Native performance?
 Use useMemo & useCallback – Prevent
unnecessary re-renders.
  Optimize FlatList – Use keyExtractor,
getItemLayout, and removeClippedSubviews.
 Avoid unnecessary state updates – Keep state
minimal and local where possible.
 Use React Native Reanimated – For smooth
animations instead of Animated.
 Optimize images – Use react-native-fast-image
instead of Image.
 Minimize re-renders – Use React.memo and
PureComponent.
 Use Hermes Engine – Improves JS execution
speed.
 Enable Proguard (Android) & Bitcode (iOS) –
Reduces app size.

2. How do you handle memory leaks in a

React Native application?
 Remove event listeners in useEffect cleanup
useEffect(() => {
 const listener = someEvent.addListener(() => {});

 return () => listener.remove();
 }, []);

 Clear timers & intervals useEffect(() => {
 const timer = setInterval(() => {}, 1000);
 return () => clearInterval(timer);
 }, []);

 Avoid keeping large objects in state – Store
large data in context or AsyncStorage.
 Use the VirtualizedList component – Prevents
memory overload in large lists.

3. What is the impact of using FlatList vs

ScrollView?
Feature FlatList ScrollView
Performanc Efficient, renders only Renders all items at
e visible items once (slow)
Use case Large lists with many Small lists (few items)
items
Memory Low (due to High (renders
usage virtualization) everything)
✅ Use FlatList for large lists
✅ Use ScrollView only when dealing with a few items

4. How do you optimize images in React

Native?
 Use react-native-fast-image – Faster and
supports caching.
 Use correct image formats – WebP/AVIF are
smaller than PNG/JPG.
 Use responsive images – Provide multiple
resolutions using Image.resizeMode.
 Optimize images before uploading – Use tools
like TinyPNG.
 Use a CDN – Reduce image load time from remote
sources.
Example using react-native-fast-image:
import FastImage from 'react-native-fast-image';

<FastImage
source={{ uri: 'https://example.com/image.jpg' }}
style={{ width: 100, height: 100 }}
resizeMode={FastImage.resizeMode.contain}
/>

5. How does React Native handle background

tasks?
 Use react-native-background-fetch – Schedule
periodic background tasks.
 Use react-native-push-notification – For
background notifications.
 Use Headless JS – Run tasks when the app is in
the background (Android).
 Use TaskManager (Expo) – For background
location updates.
Example using Headless JS (Android):
AppRegistry.registerHeadlessTask('BackgroundTask', () =>
async () => {
console.log('Running background task...');
});

Testing & Debugging in React Native

1. What are the different types of testing in
React Native?
 1. Unit Testing – Tests individual
functions/components (Jest, react-test-renderer).
2. Integration Testing – Tests interactions between
components (Jest, Enzyme).
3. End-to-End (E2E) Testing – Tests user flows
(Detox, Appium).

2. How do you test a React Native application

with Jest?
 Install Jest and React Native Testing Library: npm
install --save-dev jest @testing-library/react-native

 Example test for a button component: import
{ render, fireEvent } from '@testing-library/react-native';
 import Button from '../Button';

 test('calls onPress when clicked', () => {
 const onPress = jest.fn();
 const { getByText } = render(<Button
title="Click" onPress={onPress} />);
 fireEvent.press(getByText('Click'));
 expect(onPress).toHaveBeenCalled();
 });

 Run tests: npm test


3. What is Detox? How does it differ from

Jest?
 Detox is an E2E testing framework for React
Native.
 Jest is used for unit & integration tests.
Feature Jest (Unit Testing) Detox (E2E Testing)
Scope Single components, Full user flows (login,
functions checkout)
Execution Runs in JS Runs on an actual
environment device/simulator
Performan Fast Slower (requires UI
ce rendering)
4. Have you written end-to-end (E2E) tests?
What tools do you use?
Yes, Detox is commonly used for E2E testing in React Native.
Example Detox test:
describe('Login Flow', () => {
 it('should login successfully', async () => {
await device.launchApp();
await element(by.id('email-
input')).typeText('test@example.com');
await element(by.id('password-input')).typeText('password');
await element(by.id('login-button')).tap();
await expect(element(by.id('home-screen'))).toBeVisible();
});
});
To run Detox tests:
detox test

5. How do you debug performance issues in

React Native?
 Use React DevTools – Inspect component re-
renders.
 Use Flipper – Debug UI, logs, and network calls.
 Use why-did-you-render – Detect unnecessary re-
renders.
 Profile with Hermes – Use console.profile() to
analyze JS execution.
 Optimize list rendering – Use FlatList over
ScrollView.
 Check memory usage – Use adb shell dumpsys
meminfo (Android).

Offline & Storage in React Native

1. What are different methods of offline
storage in React Native?
React Native provides several ways to store data offline:
 AsyncStorage – Key-value storage for small data
(secure alternative: react-native-encrypted-storage).
 MMKV – Fast and efficient key-value storage
(alternative to AsyncStorage).
 SQLite – Structured relational database (react-
native-sqlite-storage).
 WatermelonDB – Optimized for syncing large
datasets.
 Realm DB – NoSQL database for high performance.
 Firebase Firestore (offline mode) – Caches data
for offline use.
2. How do you implement SQLite in a React
Native app?
Install SQLite package:
npm install react-native-sqlite-storage
Example usage:
import SQLite from 'react-native-sqlite-storage';

const db = SQLite.openDatabase({ name: 'mydb.db', location:

'default' });

db.transaction(tx => {
tx.executeSql(
'CREATE TABLE IF NOT EXISTS users (id INTEGER PRIMARY
KEY AUTOINCREMENT, name TEXT)',
[]
);
});

db.transaction(tx => {
tx.executeSql('INSERT INTO users (name) VALUES (?)', ['John
Doe']);
});

3. What are the advantages of using

AsyncStorage over SQLite?
Feature AsyncStorage SQLite
Data Type Key-value storage Structured relational DB
(JSON)
Use Case Storing small data Large structured data
(tokens, settings) (CRUD operations)
Performan Faster for small dataBetter for querying large
ce datasets
Complexity Simple to use Requires schema and
queries
Use AsyncStorage for lightweight storage, and SQLite
for complex, structured data.

4. How do you sync offline data with a remote

server in React Native?
 Use Redux Persist – Saves state offline and
rehydrates on startup.
 Use WatermelonDB or Firebase Firestore –
Syncs changes automatically.
  Implement a sync strategy:
 Save offline actions in a queue.
 When online, send pending requests to the
server.
 Example using Redux & API sync:
const syncOfflineData = async () => {
const pendingRequests = await
AsyncStorage.getItem('pendingRequests');
if (pendingRequests) {
JSON.parse(pendingRequests).forEach(async req => {
await fetch(req.url, req.options);
});
AsyncStorage.removeItem('pendingRequests');
}
};

Networking & APIs

1. How does React Native handle API calls?
React Native uses the fetch API, Axios, and third-party
libraries like React Query.
Example API call using fetch:
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));

2. What is the difference between fetch API

and Axios?
Feature Fetch API Axios
Syntax Native JS API Third-party package
Error Requires .then/.catch
Auto-detects errors &
Handling throws exceptions
Interceptor No built-in support Supports
s request/response
interceptors
Features No timeout, no Supports timeouts,
cancellation request cancellation
Use Axios for better error handling, interceptors, and
canceling requests.

3. How do you handle authentication in React

Native apps?
  Token-based authentication (JWT) – Store tokens
securely using react-native-encrypted-storage.
 OAuth – Use react-native-app-auth for
Google/Facebook login.
 Session-based authentication – Cookies stored
via AsyncStorage.
 Example using JWT:
const login = async (email, password) => {
const response = await axios.post('/login', { email,
password });
await EncryptedStorage.setItem('token',
response.data.token);
};

4. What are the best practices for handling

API failures?
 Retry failed requests – Use exponential backoff.
 Show proper error messages – Alert users about
network issues.
 Cache responses – Use react-query for caching.
 Use a global error handler:
axios.interceptors.response.use(
response => response,
error => {
console.error('API Error:', error);
return Promise.reject(error);
}
);

5. How do you implement WebSockets in

React Native?
Use react-native-websocket or the native WebSocket API:
const ws = new WebSocket('wss://example.com/socket');

ws.onopen = () => ws.send('Hello Server');

ws.onmessage = event => console.log(event.data);
ws.onerror = error => console.error(error);
ws.onclose = () => console.log('Connection closed');
For advanced use, socket.io-client is recommended.

CI/CD & Deployment

1. What are the steps to deploy a React
Native app to Google Play Store and App
Store?
1. Android Deployment
 Generate a signed APK/AAB: cd android &&
./gradlew bundleRelease

 Upload to Google Play Console.
2. iOS Deployment
 Archive the app in Xcode.
 Upload to App Store via Transporter.

2. What tools do you use for Continuous

Integration (CI/CD)?
 Fastlane – Automates builds and uploads.
 GitHub Actions – Automates testing and
deployments.
 Bitrise/App Center – Full CI/CD for React Native.

3. How do you automate React Native builds?

 Use Fastlane to automate builds: fastlane ios
release

 Set up GitHub Actions for automatic
testing/builds.
 Use App Center for OTA updates and
deployment.

4. What are app signing keys? How do they

work in Android and iOS?
 Android Keystore (keystore.jks) – Used to sign
APK/AAB files.
 release.keystore contains private keys.
 iOS Provisioning Profile & Certificates – Used to
sign iOS builds.
 Managed via Apple Developer Portal.

5. How do you handle Over-The-Air (OTA)

updates in React Native?
 Use CodePush (react-native-code-push) –
Deploy updates without Play Store/App Store approval.
 Configure CodePush: appcenter codepush
release-react -a YourApp/android -d Production

  Set update strategy:
CodePush.sync({ updateDialog: true, installMode:
CodePush.InstallMode.IMMEDIATE });

✅ CodePush works only for JavaScript updates (not native
dependencies).

Security in React Native

1. How do you secure API calls in React
Native?
 Use HTTPS – Always use https:// to encrypt
network traffic.
 Token-based authentication (JWT) – Use access
tokens instead of storing credentials.
 Secure API keys – Avoid storing them in the
frontend; use environment variables or backend
authentication.
 Use request signing – Hash requests with HMAC
(e.g., AWS Signature v4).
 Prevent man-in-the-middle attacks – Use SSL
pinning (react-native-ssl-pinning).
Example of token-based API request:
const fetchData = async () => {
const token = await SecureStore.getItemAsync('auth_token');
const response = await fetch('https://api.example.com/data',
{
headers: { Authorization: `Bearer ${token}` },
});
return response.json();
};

2. How do you handle authentication and

authorization?
 Authentication: Verify user identity using JWT,
OAuth, or Firebase Auth.
 Authorization: Use role-based access control
(RBAC) to manage permissions.
 Secure token storage: Use react-native-
encrypted-storage or SecureStore instead of
AsyncStorage.
Example using JWT authentication:
import EncryptedStorage from 'react-native-encrypted-
storage';
const storeToken = async token => {
await EncryptedStorage.setItem('auth_token', token);
};

const getToken = async () => {

return await EncryptedStorage.getItem('auth_token');
};

3. How do you prevent reverse engineering in

a React Native app?
 Code obfuscation – Use Proguard (Android) and
Bitcode (iOS) to make decompilation harder.
 Remove debugging tools – Disable Flipper,
DevTools, and logs in production.
 Use tamper detection – Check for root/jailbreak
(react-native-root-detection).
 Encrypt sensitive logic – Offload critical
computations to the backend.
To enable Proguard in Android (android/app/proguard-
rules.pro):
-keep class com.example.** { *; }
-dontwarn okhttp3.**

4. What security measures should be taken

while handling sensitive data?
 Use Secure Storage – Use EncryptedStorage or
Keychain for tokens.
 Implement biometric authentication – Face ID /
Fingerprint with react-native-keychain.
 Mask sensitive UI elements – Hide passwords
and private data.
 Use Secure Cookies for WebView
authentication – Avoid passing tokens via query
params.
 Use clipboard clearing techniques – Prevent
token leaks via clipboard.

Behavioral & Project-Based Questions

1. Can you describe a complex React Native
project you've worked on?
I worked on Aditya Birla Wealth, a large-scale financial app
for wealth management. It involved:
  Complex state management (Redux + Redux
Saga).
 Real-time updates via WebSockets.
 Offline data sync with SQLite.
 Performance optimizations for handling large
datasets.
 Integration with third-party APIs (market data,
mutual funds, etc.).

2. What was the most challenging bug you

encountered, and how did you resolve it?
A memory leak issue in a FlatList caused performance drops
after prolonged usage.
Solution:
 Used useEffect cleanup to remove event listeners.
 Switched from ScrollView to FlatList with
removeClippedSubviews.
 Used React DevTools & Flipper to debug memory
usage.

3. Have you worked on a project with a large

codebase? How did you manage it?
Yes, I worked on a large-scale fintech app with over 100+
screens.
To manage it:
 Used feature-based folder structure for
modularity.
 Implemented ESLint & Prettier for consistent
formatting.
 Used TypeScript for type safety.
 Followed Clean Architecture – separating UI,
business logic, and API layers.
 Introduced unit & integration tests to avoid
regressions.

4. How do you work in an Agile/Scrum

environment?
 Participate in daily standups to discuss
progress/blockers.
 Work in 2-week sprints with defined user stories.
 Use JIRA/Trello for task tracking.
 Conduct code reviews and retrospectives for
continuous improvement.
5. Have you led a React Native development
team?
While I have primarily worked as an individual contributor, I
have:
 Mentored junior developers on best practices.
 Reviewed PRs to ensure code quality.
 Managed deployments & CI/CD pipelines for
production releases.
 Conducted tech discussions on improving app
performance.

6. What strategies do you use to ensure

maintainability in your code?
 Follow DRY (Don’t Repeat Yourself) – Use
reusable components.
 Follow SOLID principles – Maintain modular,
scalable code.
 Use TypeScript for strict type checking.
 Maintain clear documentation – Write inline
comments and API docs.

7. How do you handle code reviews?

 Check for best practices – Proper state
management, error handling, and performance
optimizations.
 Ensure consistency – Code follows project
guidelines (ESLint, Prettier).
 Give constructive feedback – Suggest
improvements instead of just pointing out errors.
 Test the code – Run tests and check for
regressions before approval.

8. Have you worked with third-party

libraries? How do you evaluate their quality?
Yes, I’ve used libraries like React Navigation, Redux Saga,
Axios, Reanimated.
I evaluate them based on:
✅ Community support – GitHub stars, issues, and activity.
✅ Performance impact – Measure FPS and memory usage.
✅ Security – Ensure no known vulnerabilities (npm audit).
✅ Documentation – Well-documented APIs.
✅ Maintainability – Frequent updates and TypeScript support.
9. Can you give an example of a time you
improved an app’s performance?
I optimized a slow dashboard screen by:
 Using FlatList with getItemLayout instead of
ScrollView.
 Implementing lazy loading for images with react-
native-fast-image.
 Reducing re-renders with React.memo and
useCallback.
 Enabling Hermes engine to improve JS execution
speed.
Result: Reduced app startup time by 40% and improved
smoothness.

10. How do you stay updated with the latest

trends in React Native?
Follow React Native blog & GitHub discussions – Stay
informed on new releases.
Join React Native communities – Engage in Twitter, Discord,
and LinkedIn groups.
Follow top developers – Watch talks from William
Candillon, Evan Bacon, and React Native team.
Experiment with new libraries – Try out tools like
Reanimated 3, React Query, and Expo Router.
Read Medium & Dev.to articles – Follow latest best
practices and case studies.