Expo vs bare React Native - Practice Questions

Challenge - 5 Problems

🧠 Conceptual

intermediate

Understanding Expo Managed Workflow

Which statement best describes the Expo managed workflow in React Native development?

A It allows you to write React Native apps without configuring native code, using Expo's tools and services.

B It requires manual setup of native iOS and Android projects before coding.

C It only supports Android development and excludes iOS.

D It forces you to eject your app to use any third-party native modules.

💡 Hint

Think about which workflow hides native code complexity.

Expo managed workflow provides a ready-to-use environment where you write JavaScript and use Expo's APIs without touching native code.

❓ ui_behavior

intermediate

Behavior Differences in Native Module Usage

You want to use a native module not supported by Expo. What happens if you try to use it in an Expo managed project without ejecting?

A The app will fail to build or run because Expo managed workflow does not support custom native modules.

B Expo automatically converts native modules to JavaScript equivalents.

C The app will build and run normally with the native module working.

D The native module will work only on Android but not on iOS.

💡 Hint

Consider Expo's limitations on native code.

Expo managed workflow does not allow adding custom native code, so unsupported native modules cause build failures.

❓ lifecycle

advanced

App Lifecycle Differences

How does the app lifecycle management differ between Expo managed and bare React Native projects?

A Both Expo managed and bare React Native apps require manual native lifecycle event handling.

B Expo managed apps handle lifecycle events internally, while bare React Native apps require manual native lifecycle handling.

C Bare React Native apps have no lifecycle events, unlike Expo managed apps.

D Expo managed apps do not support lifecycle events at all.

💡 Hint

Think about who manages native lifecycle in each workflow.

Expo managed workflow abstracts native lifecycle, while bare React Native requires developers to handle native lifecycle events if needed.

❓ navigation

advanced

Navigation Setup Differences

Which is true about navigation setup in Expo managed vs bare React Native projects?

A Expo managed projects require manual native linking for navigation libraries.

B Bare React Native projects cannot use React Navigation.

C Expo managed projects can use React Navigation without extra native linking, while bare React Native may require manual linking for some navigation dependencies.

D Navigation libraries are not supported in Expo managed projects.

💡 Hint

Consider how Expo handles native dependencies.

Expo managed workflow includes prebuilt native code for popular libraries like React Navigation, avoiding manual linking.

🔧 Debug

expert

Debugging Build Failures in Bare React Native

You ejected from Expo to bare React Native and now your iOS build fails with a native module error. What is the most likely cause?

A Expo managed workflow does not support native modules, so this error is unrelated.

B You must remove all native modules to build successfully.

C You need to reinstall Expo CLI globally to fix native module errors.

D You forgot to run 'pod install' in the ios directory after adding native modules.

💡 Hint

Think about native dependencies setup after ejecting.

After ejecting, native modules require proper linking and installation steps like 'pod install' for iOS to build correctly.

Practice

1. Which statement best describes Expo in React Native development?

easy

A. Expo provides an easy setup with many built-in tools and services.

B. Expo requires manual linking of native modules for every feature.

C. Expo does not support running apps on physical devices.

D. Expo is only for web development, not mobile apps.

Solution

1. Step 1: Understand Expo's purpose

   Expo is designed to simplify React Native development by providing many built-in tools and services out of the box.

2. Step 2: Compare with other options

   Unlike bare React Native, Expo does not require manual linking of native modules and supports running apps on physical devices easily.

3. Final Answer:

   Expo provides an easy setup with many built-in tools and services. -> Option A

4. Quick Check:

   Expo = Easy setup and built-in tools [OK]

Hint: Expo means easy start with many tools included [OK]

Common Mistakes:

• Thinking Expo requires manual native code linking
• Believing Expo can't run on real devices
• Confusing Expo with web-only frameworks

2. Which of the following is the correct way to start a new Expo project?

easy

A. npx react-native init MyApp

B. react-native run-ios

C. npm create-react-app MyApp

D. expo init MyApp

Solution

1. Step 1: Identify Expo project creation command

   The command expo init MyApp is used to create a new Expo project with templates and setup.

2. Step 2: Differentiate from bare React Native commands

   npx react-native init is for bare React Native, not Expo. Other options are unrelated or for web.

3. Final Answer:

   expo init MyApp -> Option D

4. Quick Check:

   Expo project start = expo init [OK]

Hint: Expo projects start with 'expo init' command [OK]

Common Mistakes:

• Using 'npx react-native init' for Expo projects
• Confusing React web commands with React Native
• Trying to run iOS build command before project creation

3. What will happen if you try to use a native module not supported by Expo in an Expo managed project?

medium

A. The app will build and run without errors.

B. You will get a build error or runtime crash.

C. Expo automatically adds support for all native modules.

D. The app will silently ignore the native module.

Solution

1. Step 1: Understand Expo's native module support

   Expo supports many native modules but not all. Unsupported modules cause build or runtime errors.

2. Step 2: Predict behavior when using unsupported modules

   Since Expo does not allow custom native code in managed workflow, using unsupported native modules leads to errors.

3. Final Answer:

   You will get a build error or runtime crash. -> Option B

4. Quick Check:

   Unsupported native module in Expo = error [OK]

Hint: Unsupported native modules cause errors in Expo [OK]

Common Mistakes:

• Assuming Expo adds all native modules automatically
• Thinking unsupported modules are ignored silently
• Believing Expo supports all bare React Native features

4. You have a React Native app created with Expo but need to add custom native code. What is the best way to fix this?

medium

A. Eject the Expo project to bare React Native workflow.

B. Keep using Expo and add native code directly.

C. Rewrite the app using React web instead.

D. Use Expo's managed workflow without changes.

Solution

1. Step 1: Identify the limitation of Expo managed workflow

   Expo managed workflow does not allow adding custom native code directly.

2. Step 2: Choose the correct approach to add native code

   Ejecting the Expo project converts it to bare React Native, allowing full native code access.

3. Final Answer:

   Eject the Expo project to bare React Native workflow. -> Option A

4. Quick Check:

   Need native code? Eject Expo [OK]

Hint: Eject Expo to add custom native code [OK]

Common Mistakes:

• Trying to add native code in Expo managed workflow
• Ignoring the need to eject before native code
• Switching to React web instead of native

5. You want to build a complex app with custom native modules and full control over build tools. Which approach is best?

hard

A. Build a web app instead of a mobile app.

B. Use Expo managed workflow for faster development.

C. Start with bare React Native to access native code freely.

D. Use Expo and avoid any native code.

Solution

1. Step 1: Analyze app requirements

   The app needs custom native modules and full control over build tools, which Expo managed workflow limits.

2. Step 2: Choose the suitable React Native approach

   Bare React Native allows direct native code access and full control over build configurations, fitting the requirements.

3. Final Answer:

   Start with bare React Native to access native code freely. -> Option C

4. Quick Check:

   Custom native + control = bare React Native [OK]

Hint: Complex native needs? Choose bare React Native [OK]

Common Mistakes:

• Choosing Expo for apps needing custom native code
• Confusing web apps with native mobile apps
• Avoiding bare React Native despite native needs