facebook / react-native-website

The React Native website and docs
https://reactnative.dev
MIT License
1.96k stars 4.38k forks source link

[Android] Missing documentation/example for integrating RN components in native Android app with Bridgeless mode #4336

Closed ysfzrn closed 6 days ago

ysfzrn commented 6 days ago

Description

Documentation needed for integrating React Native components into native Android applications using Bridgeless mode (New Architecture) in React Native 0.76+. Current docs still reference legacy bridge architecture patterns.

What is the problem?

The official documentation lacks clear guidance on how to integrate React Native components into existing Android applications using the new Bridgeless architecture. The current documentation still references ReactInstanceManager which is not available in Bridgeless mode, and there's no information about using ReactHost and ReactSurface for native integration.

How can we address it?

Add a new documentation section covering:

  1. How to initialize React Native in Bridgeless mode from native Android
  2. Examples of using ReactHost and ReactSurface
  3. Step-by-step guide for adding RN components to native Android views
  4. Props passing and lifecycle management in Bridgeless mode
  5. Kotlin code examples for all the above

Suggested documentation structure:

// Example code snippets to include
class MainActivity : AppCompatActivity() {
    private lateinit var reactHost: ReactHost

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // Initialize ReactHost
        // Create ReactSurface
        // Mount RN component
        // Pass props
    }

    // Lifecycle management
}

Why is it important?

1.  Many companies are gradually adopting React Native by integrating it into existing native applications
2.  Bridgeless mode is now the default in RN 0.76+
3.  Lack of documentation creates barriers for teams trying to adopt the new architecture
4.  Current documentation gap may lead developers to use deprecated patterns

Who needs this?

•   Android native developers integrating React Native
•   Teams migrating from old architecture to new architecture
•   Companies gradually adopting React Native
•   Mobile developers working on brownfield applications
•   Development teams maintaining hybrid native/RN applications

When should this happen?

This should be addressed as soon as possible since: • Bridgeless mode is default in React Native 0.76 • Teams are actively migrating to the new architecture • Current documentation is outdated and may lead to incorrect implementations

Version numbers:

•   React Native: 0.76+
•   Documentation update needed for current and future versions
cortinico commented 6 days ago

Documentation needed for integrating React Native components into native Android applications using Bridgeless mode (New Architecture) in React Native 0.76+. Current docs still reference legacy bridge architecture patterns.

Which part of the docs? Can you be more specific and share links?

ysfzrn commented 6 days ago

I was writing about this part where there's only an example using ReactInstanceManager, and ReactInstanceManager returns null in Bridgeless mode: https://reactnative.dev/docs/0.75/integration-with-existing-apps?language=kotlin#the-magic-reactrootview

However, as I was writing this, I noticed the link is for version 0.75. My apologies, I'm closing this issue.