diff --git a/docs/pages/brownfield/installing-expo-modules.mdx b/docs/pages/brownfield/installing-expo-modules.mdx
index af9ae831f47c1..92ca9e62c9205 100644
--- a/docs/pages/brownfield/installing-expo-modules.mdx
+++ b/docs/pages/brownfield/installing-expo-modules.mdx
@@ -4,49 +4,192 @@ description: Learn how to prepare your existing native project to install and us
---
import InstallSection from '~/components/plugins/InstallSection';
-import { DiffBlock } from '~/ui/components/Snippet';
+import { DiffBlock, Terminal } from '~/ui/components/Snippet';
import { YesIcon, NoIcon } from '~/ui/components/DocIcons';
import { Collapsible } from '~/ui/components/Collapsible';
-import Step from '~/components/Step';
+import { Step } from '~/ui/components/Step';
## Prerequisites
-You should have a native project with React Native installed and configured to render a root view.
+You should have a native project with React Native installed and configured to render a root view. If not, you can follow [this](https://reactnative.dev/docs/integration-with-existing-apps) guide to get set up.
## Install Expo modules
First, add the `expo` package to your project. Ensure you are using a version of the `expo` package that is compatible with the React Native version in your project. [Learn more](/versions/latest/#each-expo-sdk-version-depends-on-a-react-native-version).
-
+
### iOS
- Next thing goes here
+ Add the following to your `Podfile` in the `ios` directory:
+ ' do
++ use_expo_modules!
+ config = use_native_modules!
+ `}
+ />
- Next thing goes here again
+ Open your `ios` directory in XCode. From the project navigator, select your project and then
+ select your app target under `TARGETS`. In `Build Settings`, using the search bar, search for
+ `ENABLE_USER_SCRIPT_SANDBOXING`. If it is not already, set its value to `No`.
- And more if needed
+ Run `pod install` in the `ios` directory.
+
+ You will need to do this everytime you add a dependency that uses native code.
+
+
+
+ (Optional) Complete the following if you would like to use Expo modules lifecycle listeners.
+ /AppDelegate.swift b/ios//AppDelegate.swift
+index ff83531..bd8651d 100644
+--- a/ios//AppDelegate.swift
++++ b/ios//AppDelegate.swift
+@@ -1,31 +1,29 @@
+ import UIKit
++import ExpoModulesCore
+
+ @main
+-class AppDelegate: UIResponder, UIApplicationDelegate {
++class AppDelegate: ExpoAppDelegate {
+
+- func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
++ override func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
+- return true
++ super.application(application, didFinishLaunchingWithOptions: launchOptions)
+ }
+ `}
+ />
### Android
- Next thing goes here but for Android this time
+ Add the following to the `gradle.properties` file in the `android` directory:
+
+
+
+
+ Add the following to the `setting.gradle` file in the `android` directory:
+
+
+
+
+ From the `android` directory, run the following command:
+
+ Once this completes, run the following command:
+
+
+ (Optional) Complete the following steps if you would like to use Expo modules lifecycle listeners
+ in your app:
+
+If you already have a class that extends the `Application` class you can move to step 3.
+If you do not have it, we need to create one. Add a file called `MainApplication.kt` file to your `android/app/src/main/java/com/` directory with the following content:
+
+/MainApplication.kt b/android/app/src/main/java/com//MainApplication.kt
+new file mode 100644
+index 0000000..2c8525a
+--- /dev/null
++++ b/android/app/src/main/java/com//MainApplication.kt
+@@ -0,0 +1,19 @@
++package
++
++import android.app.Application
++import android.content.res.Configuration
++import com.facebook.soloader.SoLoader
++import expo.modules.ApplicationLifecycleDispatcher
++
++class MainApplication() : Application() {
++ override fun onCreate() {
++ super.onCreate()
++ ApplicationLifecycleDispatcher.onApplicationCreate(this)
++ }
++
++ override fun onConfigurationChanged(newConfig: Configuration) {
++ super.onConfigurationChanged(newConfig)
++ ApplicationLifecycleDispatcher.onConfigurationChanged(this, newConfig)
++ }
++}`} />
+
- Next thing goes here again
+Register the class in the `AndroidManifest.xml` file.
+
- And more if needed
+If you have your own class extending `Application`, you can add the following to it:
+
+/MainApplication.kt b/android/app/src/main/java/com//MainApplication.kt
+new file mode 100644
+index 0000000..2c8525a
+--- /dev/null
++++ b/android/app/src/main/java/com//MainApplication.kt
+@@ -0,0 +1,19 @@
+class MainApplication() : Application() {
+ override fun onCreate() {
+ super.onCreate()
++ ApplicationLifecycleDispatcher.onApplicationCreate(this)
+ }
++
++ override fun onConfigurationChanged(newConfig: Configuration) {
++ super.onConfigurationChanged(newConfig)
++ ApplicationLifecycleDispatcher.onConfigurationChanged(this, newConfig)
++ }
+
+}`} />
+Override `onConfigurationChanged` if you have not done so already.
+
+
## Limitations
-Here we list limitations.
\ No newline at end of file
+Here we list limitations.