From 7a5709669b09966a137abe07f10819a1aaa4a5aa Mon Sep 17 00:00:00 2001
From: Brent Vatne <brentvatne@gmail.com>
Date: Tue, 12 Mar 2024 15:55:23 -0700
Subject: [PATCH 1/7] [docs] Rough outline for brownfield docs

---
 docs/constants/navigation.js                  |  6 ++-
 .../brownfield/installing-expo-modules.mdx    | 52 +++++++++++++++++++
 docs/pages/brownfield/overview.mdx            | 41 +++++++++++++++
 3 files changed, 98 insertions(+), 1 deletion(-)
 create mode 100644 docs/pages/brownfield/installing-expo-modules.mdx
 create mode 100644 docs/pages/brownfield/overview.mdx

diff --git a/docs/constants/navigation.js b/docs/constants/navigation.js
index baf1808bdeb71..651c53f134791 100644
--- a/docs/constants/navigation.js
+++ b/docs/constants/navigation.js
@@ -415,7 +415,7 @@ const general = [
         makePage('accounts/working-together.mdx'),
         makePage('accounts/sso.mdx'),
       ]),
-      makeSection('Bare React Native', [
+      makeSection('Existing React Native apps', [
         makePage('bare/overview.mdx'),
         makePage('bare/installing-expo-modules.mdx'),
         makePage('bare/using-expo-cli.mdx'),
@@ -424,6 +424,10 @@ const general = [
         makePage('bare/install-dev-builds-in-bare.mdx'),
         makePage('bare/upgrade.mdx'),
       ]),
+      makeSection('Existing Native apps', [
+        makePage('brownfield/overview.mdx'),
+        makePage('brownfield/installing-expo-modules.mdx'),
+      ]),
     ],
     { expanded: true }
   ),
diff --git a/docs/pages/brownfield/installing-expo-modules.mdx b/docs/pages/brownfield/installing-expo-modules.mdx
new file mode 100644
index 0000000000000..af9ae831f47c1
--- /dev/null
+++ b/docs/pages/brownfield/installing-expo-modules.mdx
@@ -0,0 +1,52 @@
+---
+title: Install Expo modules
+description: Learn how to prepare your existing native project to install and use Expo modules and the module API.
+---
+
+import InstallSection from '~/components/plugins/InstallSection';
+import { DiffBlock } from '~/ui/components/Snippet';
+import { YesIcon, NoIcon } from '~/ui/components/DocIcons';
+import { Collapsible } from '~/ui/components/Collapsible';
+import Step from '~/components/Step';
+
+## Prerequisites
+
+You should have a native project with React Native installed and configured to render a root view.
+
+## 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).
+
+<Terminal cmdCopy="npm install expo" />
+
+### iOS
+
+<Step label="1">
+  Next thing goes here
+</Step>
+
+<Step label="2">
+  Next thing goes here again
+</Step>
+
+<Step label="3">
+  And more if needed
+</Step>
+
+### Android
+
+<Step label="1">
+  Next thing goes here but for Android this time
+</Step>
+
+<Step label="2">
+  Next thing goes here again
+</Step>
+
+<Step label="3">
+  And more if needed
+</Step>
+
+## Limitations
+
+Here we list limitations.
\ No newline at end of file
diff --git a/docs/pages/brownfield/overview.mdx b/docs/pages/brownfield/overview.mdx
new file mode 100644
index 0000000000000..8693bd324b4ec
--- /dev/null
+++ b/docs/pages/brownfield/overview.mdx
@@ -0,0 +1,41 @@
+---
+title: Integrating Expo tools into existing native apps
+sidebar_title: Overview
+hideTOC: true
+description: An overview of how you can integrate Expo tools into existing native apps ("brownfield" apps).
+---
+
+import { BoxLink } from '~/ui/components/BoxLink';
+import { Terminal } from '~/ui/components/Snippet';
+import { DEMI, CODE } from '~/ui/components/Text';
+
+If you already have a native app for Android and/or iOS and want to learn how to use Expo and React Native in your project, perhaps on a single screen or feature to start, this guide is for you. This type of app is commonly referred to as a "brownfield" app in the React Native ecosystem (as opposed to "greenfield" apps, which are created from scratch using Expo and React Native).
+
+## Compatibility
+
+Expo is primarily built with greenfield apps in mind — not all Expo tools and services are compatible with existing native projects.
+
+| Tool/Service                                        | Supports brownfield? |
+| --------------------------------------------------- | -------------------- |
+| [Expo SDK](/versions/latest/)                       | Yes                  |
+| [Expo Modules API](/modules/overview/)              | Yes                  |
+| [Expo Router](/router/introduction/)                | No                   |
+| [Expo CLI](/more/expo-cli/)                         | No                   |
+| [Expo Dev Client](/versions/latest/sdk/dev-client/) | No                   |
+| [EAS Build](/build/introduction/)                   | Yes                  |
+| [EAS Submit](/submit/introduction/)                 | Yes                  |
+| [EAS Update](/eas-update/introduction/)             | No                   |
+
+## Next steps
+
+<BoxLink
+  title="Integrating your first React Native view"
+  description="Learn how to add a React Native root view to your existing native app"
+  href="<TODO>"
+/>
+
+<BoxLink
+  title="Install Expo modules"
+  description="Install the Expo Modules API and use it to add existing Expo modules or write your own modules"
+  href="/brownfield/installing-expo-modules"
+/>

From 293de3470c57a44f7cfa4464f8af541b10c32547 Mon Sep 17 00:00:00 2001
From: Alan Hughes <alan@expo.io>
Date: Wed, 13 Mar 2024 12:50:26 +0000
Subject: [PATCH 2/7] [docs] brownfield guide

---
 .../brownfield/installing-expo-modules.mdx    | 165 ++++++++++++++++--
 1 file changed, 154 insertions(+), 11 deletions(-)

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).
 
-<Terminal cmdCopy="npm install expo" />
+<Terminal cmd={['npm install expo']} />
 
 ### iOS
 
 <Step label="1">
-  Next thing goes here
+  Add the following to your `Podfile` in the `ios` directory:
+  <DiffBlock
+    raw={`
+diff --git a/ios/Podfile b/ios/Podfile
+index 2d3a979..825a9d4 100644
+--- a/ios/Podfile
++++ b/ios/Podfile
+@@ -1,3 +1,4 @@
++require File.join(File.dirname(\`node --print "require.resolve('expo/package.json')"\`), "scripts/autolinking")
+ require Pod::Executable.execute_command('node', ['-p',
+   'require.resolve(
+   "react-native/scripts/react_native_pods.rb",
+@@ -14,6 +15,7 @@ if linkage != nil
+ end
+ 
+ target '<YourAppTarget>' do
++  use_expo_modules!
+   config = use_native_modules!
+  `}
+  />
 </Step>
 
 <Step label="2">
-  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`.
 </Step>
 
 <Step label="3">
-  And more if needed
+  Run `pod install` in the `ios` directory.
+  <Terminal cmd={['cd ios && pod install']} />
+  You will need to do this everytime you add a dependency that uses native code.
+</Step>
+
+<Step label="4">
+  (Optional) Complete the following if you would like to use Expo modules lifecycle listeners.
+  <DiffBlock
+    raw={`diff --git a/ios/<MyAppProject>/AppDelegate.swift b/ios/<MyAppProject>/AppDelegate.swift
+index ff83531..bd8651d 100644
+--- a/ios/<MyAppProject>/AppDelegate.swift
++++ b/ios/<MyAppProject>/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)
+   }
+ `}
+  />
 </Step>
 
 ### Android
 
 <Step label="1">
-  Next thing goes here but for Android this time
+  Add the following to the `gradle.properties` file in the `android` directory:
+  <DiffBlock
+    raw={`diff --git a/android/gradle.properties b/android/gradle.properties
+index 20e2a01..e98ad88 100644
+--- a/android/gradle.properties
++++ b/android/gradle.properties
+@@ -20,4 +20,8 @@ kotlin.code.style=official
++newArchEnabled=false
++
++hermesEnabled=true`}
+  />
+</Step>
+
+<Step label="2">
+  Add the following to the `setting.gradle` file in the `android` directory:
+  <DiffBlock
+    raw={`diff --git a/android/settings.gradle b/android/settings.gradle
+index a26c7c6..dd8802a 100644
+--- a/android/settings.gradle
++++ b/android/settings.gradle
+@@ -1,5 +1,11 @@
++apply from: new File(["node", "--print", "require.resolve('expo/package.json')"].execute(null, rootDir).text.trim(), "../scripts/autolinking.gradle");
++useExpoModules()
++
+ include ':app'
+ includeBuild("../node_modules/@react-native/gradle-plugin")`}
+  />
+</Step>
+
+<Step label="3">
+  From the `android` directory, run the following command:
+  <Terminal cmd={['./gradlew clean']} />
+  Once this completes, run the following command:
+  <Terminal cmd={['./gradlew assembleDebug']} />
 </Step>
 
+<Step label="4">
+  (Optional) Complete the following steps if you would like to use Expo modules lifecycle listeners
+  in your app:
+<Step label="1">
+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/<your-app-package>` directory with the following content:
+
+<DiffBlock raw={`diff --git a/android/app/src/main/java/com/<my-app-package>/MainApplication.kt b/android/app/src/main/java/com/<my-app-package>/MainApplication.kt
+new file mode 100644
+index 0000000..2c8525a
+--- /dev/null
++++ b/android/app/src/main/java/com/<my-app-package>/MainApplication.kt
+@@ -0,0 +1,19 @@
++package <my.app.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)
++    }
++}`} />
+</Step>
 <Step label="2">
-  Next thing goes here again
+Register the class in the `AndroidManifest.xml` file.
+<DiffBlock raw={`diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml
+index a71b5e7..d6d406e 100644
+--- a/android/app/src/main/AndroidManifest.xml
++++ b/android/app/src/main/AndroidManifest.xml
+@@ -7,6 +7,7 @@
+     <application
+         android:allowBackup="true"
++        android:name=".MainApplication"
+         android:fullBackupContent="@xml/backup_rules"`} />
 </Step>
 
 <Step label="3">
-  And more if needed
+If you have your own class extending `Application`, you can add the following to it:
+
+<DiffBlock raw={`diff --git a/android/app/src/main/java/com/<my-app-package>/MainApplication.kt b/android/app/src/main/java/com/<my-app-package>/MainApplication.kt
+new file mode 100644
+index 0000000..2c8525a
+--- /dev/null
++++ b/android/app/src/main/java/com/<my-app-package>/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.
+
+</Step>
 </Step>
 
 ## Limitations
 
-Here we list limitations.
\ No newline at end of file
+Here we list limitations.

From 512e2fea11e3c4219192df1b419f2d3d2e361ba8 Mon Sep 17 00:00:00 2001
From: Brent Vatne <brentvatne@gmail.com>
Date: Tue, 2 Apr 2024 18:07:47 -0700
Subject: [PATCH 3/7] Clean up the existing * apps sections

---
 docs/common/error-utilities.ts                |  3 +
 docs/constants/navigation.js                  | 25 +++---
 .../{bare => archive}/using-expo-client.mdx   |  0
 .../pages/bare/install-dev-builds-in-bare.mdx | 50 +++++++-----
 docs/pages/bare/installing-expo-modules.mdx   |  2 +-
 docs/pages/bare/installing-updates.mdx        | 31 ++++---
 docs/pages/bare/overview.mdx                  | 81 +++++++++----------
 .../brownfield/installing-expo-modules.mdx    | 20 +++--
 docs/pages/brownfield/overview.mdx            | 36 +++++----
 .../development-builds/create-a-build.mdx     |  2 +-
 10 files changed, 140 insertions(+), 110 deletions(-)
 rename docs/pages/{bare => archive}/using-expo-client.mdx (100%)

diff --git a/docs/common/error-utilities.ts b/docs/common/error-utilities.ts
index 0ef8aa9b61f27..6b2181d2cdaa6 100644
--- a/docs/common/error-utilities.ts
+++ b/docs/common/error-utilities.ts
@@ -446,4 +446,7 @@ const RENAMED_PAGES: Record<string, string> = {
 
   // Deprecated Webpack support
   '/guides/customizing-webpack': '/archive/customizing-webpack',
+
+  // Stop encouraging usage of Expo Go when using native modules
+  '/bare/using-expo-client': '/archive/using-expo-client',
 };
diff --git a/docs/constants/navigation.js b/docs/constants/navigation.js
index 651c53f134791..a58f1b7ae121b 100644
--- a/docs/constants/navigation.js
+++ b/docs/constants/navigation.js
@@ -157,6 +157,18 @@ const general = [
       ],
       { expanded: false }
     ),
+    makeSection('Existing React Native apps', [
+      makePage('bare/overview.mdx'),
+      makePage('bare/installing-expo-modules.mdx'),
+      makePage('bare/using-expo-cli.mdx'),
+      makePage('bare/installing-updates.mdx'),
+      makePage('bare/install-dev-builds-in-bare.mdx'),
+      makePage('bare/upgrade.mdx'),
+    ]),
+    makeSection('Existing native apps', [
+      makePage('brownfield/overview.mdx'),
+      makePage('brownfield/installing-expo-modules.mdx'),
+    ]),
     makeGroup(
       'Reference',
       [
@@ -415,19 +427,6 @@ const general = [
         makePage('accounts/working-together.mdx'),
         makePage('accounts/sso.mdx'),
       ]),
-      makeSection('Existing React Native apps', [
-        makePage('bare/overview.mdx'),
-        makePage('bare/installing-expo-modules.mdx'),
-        makePage('bare/using-expo-cli.mdx'),
-        makePage('bare/installing-updates.mdx'),
-        makePage('bare/using-expo-client.mdx'),
-        makePage('bare/install-dev-builds-in-bare.mdx'),
-        makePage('bare/upgrade.mdx'),
-      ]),
-      makeSection('Existing Native apps', [
-        makePage('brownfield/overview.mdx'),
-        makePage('brownfield/installing-expo-modules.mdx'),
-      ]),
     ],
     { expanded: true }
   ),
diff --git a/docs/pages/bare/using-expo-client.mdx b/docs/pages/archive/using-expo-client.mdx
similarity index 100%
rename from docs/pages/bare/using-expo-client.mdx
rename to docs/pages/archive/using-expo-client.mdx
diff --git a/docs/pages/bare/install-dev-builds-in-bare.mdx b/docs/pages/bare/install-dev-builds-in-bare.mdx
index e4adb42c32bbd..ae47c540888a2 100644
--- a/docs/pages/bare/install-dev-builds-in-bare.mdx
+++ b/docs/pages/bare/install-dev-builds-in-bare.mdx
@@ -1,33 +1,37 @@
 ---
-title: Install development builds in bare React Native
-sidebar_title: Install development builds in bare React Native
-description: Learn how to configure development builds for bare React Native projects.
+title: Install expo-dev-client in a bare React Native project
+sidebar_title: Install expo-dev-client
+description: Learn how to install and configure expo-dev-client in bare React Native projects.
 ---
 
 import { Terminal } from '~/ui/components/Snippet';
 import { Step } from '~/ui/components/Step';
 import ImageSpotlight from '~/components/plugins/ImageSpotlight';
+import { Collapsible } from '~/ui/components/Collapsible';
 
+The following guide explains how to install and configure `expo-dev-client` in an exisitng React Native project.
 
-The installation steps on this page are only required to add the `expo-dev-client` library to a React Native or a bare project. To add the `expo-dev-client` library to an existing managed project, see ["Create a development build"](/develop/development-builds/create-a-build/).
+<Collapsible summary="Do you need to create a new project?">
 
-If you're starting your project, you can create a new project with our `with-dev-client` template. Run the following command to initialize the project:
+If you're starting a project, you can create a new project with with `with-dev-client` template. Run the following command to initialize the project:
 
 <Terminal cmd={['$ npx create-expo-app -e with-dev-client']} />
 
-Otherwise, if you already have an existing React Native or a bare project, follow the steps below to add `expo-dev-client` to it.
+</Collapsible>
 
-<Step label="1">
+<Collapsible summary="Do you use Continuous Native Generation (CNG) in your project?">
 
-## Install Expo modules
+You may be reading the wrong guide then! To use `expo-dev-client` in a project that uses [CNG](/workflow/continuous-native-generation/), see ["Create a development build"](/develop/development-builds/create-a-build/).
 
-If you created your project with `npx react-native init` and do not have any other Expo packages installed, **you will need to [install Expo modules](/bare/installing-expo-modules)** before proceeding.
+</Collapsible>
 
-Otherwise, if you already have `expo` and/or other Expo modules up and running, you can skip this step.
+## Prerequisites
 
-</Step>
+**The `expo` package must be installed and configured**: if you created your project with `npx react-native init` and do not have any other Expo packages installed, you will need to [install Expo modules](/bare/installing-expo-modules) before proceeding.
 
-<Step label="2">
+## Installation
+
+<Step label="1">
 
 ## Install expo-dev-client
 
@@ -43,19 +47,27 @@ If your project doesn't have an **ios/** directory, you can skip this step.
 
 </Step>
 
-<Step label="3">
+<Step label="2">
 
 ## Configure deep links
 
-Development builds use deep links to open projects from the QR code. If you have added a custom deep link scheme to your project, your development build will use it. However, if this isn't the case, you need to configure the deep link support for your app. The `uri-scheme` package will do this for you once you have chosen a scheme.
+Expo CLI uses a deep link to launch your project, and it's also useful if you use plan to [use `expo-dev-client` for launching preview updates](/eas-update/getting-started/) If you have added a custom deep link scheme to your project. If you haven't configured a `scheme` for your app yet to support deep linking, then you can use `uri-scheme` package to do this for you.
 
-<Terminal cmd={['$ npx uri-scheme add <your scheme>']} />
+<Terminal
+  cmd={[
+    "# List your project's schemes",
+    '$ npx uri-scheme list',
+    '',
+    '# Add a scheme to your project',
+    '$ npx uri-scheme add <your scheme>',
+  ]}
+/>
 
 For more information, see [uri-scheme package](https://www.npmjs.com/package/uri-scheme).
 
 </Step>
 
-<Step label="4">
+<Step label="3">
 
 ## Add additional optional configuration
 
@@ -71,10 +83,10 @@ For more information, see [Error handling](/develop/development-builds/use-devel
 
 </Step>
 
-<Step label="5">
+<Step label="4">
 
-## Build and install
+## Build and install the app
 
-You're now ready to [build your first development build](/develop/development-builds/create-a-build/#initialize-eas-build).
+Create a debug build of your app using the tools of your choice. For example, you can do this [locally with Expo CLI](/guides/local-app-development/) or [in the cloud with EAS Build](/develop/development-builds/create-a-build/).
 
 </Step>
diff --git a/docs/pages/bare/installing-expo-modules.mdx b/docs/pages/bare/installing-expo-modules.mdx
index e941aac57a303..c686f9ae659e2 100644
--- a/docs/pages/bare/installing-expo-modules.mdx
+++ b/docs/pages/bare/installing-expo-modules.mdx
@@ -12,7 +12,7 @@ To use Expo modules in your app, you will need to install and configure the `exp
 
 The `expo` package has a small footprint; it includes only a minimal set of packages that are needed in nearly every app and the module and autolinking infrastructure that other Expo SDK packages are built with. Once the `expo` package is installed and configured in your project, you can use `npx expo install` to add any other Expo module from the SDK.
 
-Depending on how you [initialized the project](/bare/overview/), there are two ways you can install the Expo modules: [automatic](#automatic-installation) or [manual](#manual-installation).
+Depending on how you [initialized the project](/bare/overview/), there are two ways you can install the Expo modules: [automatically](#automatic-installation) or [manually](#manual-installation).
 
 ## Automatic installation
 
diff --git a/docs/pages/bare/installing-updates.mdx b/docs/pages/bare/installing-updates.mdx
index 8c8651b795fd6..a4c95d4dcabe8 100644
--- a/docs/pages/bare/installing-updates.mdx
+++ b/docs/pages/bare/installing-updates.mdx
@@ -1,18 +1,31 @@
 ---
-title: Add expo-updates to an existing project
-description: Learn how to add expo-updates to an existing React Native project.
+title: Install expo-updates in a bare React Native project
+description: Learn how to install and configure expo-updates in bare React Native projects.
 ---
 
 import { Terminal } from '~/ui/components/Snippet';
 import { DiffBlock } from '~/ui/components/Snippet';
+import { Collapsible } from '~/ui/components/Collapsible';
 
-The `expo-updates` library fetches and manages updates received from a remote server. It supports [EAS Update](/eas-update/introduction), a hosted service that serves updates for projects using the `expo-updates` library.
+The `expo-updates` library fetches and manages updates to app JavaScript and assets received from a remote server. It supports [EAS Update](/eas-update/introduction), a hosted service that serves updates and provides a variety of tools for managing them. It can also be configured to work with a [custom server](/eas-update/custom-updates-server/). This guide explains how set it up for use with EAS Update.
 
-> If you are creating a new project, we recommend using `npx create-expo-app --template bare-minimum` (or `yarn create expo-app --template bare-minimum`) instead of `npx react-native init` because it will handle the following configuration for you automatically. It includes the `expo-updates` [config plugin](/config-plugins/introduction/), which will handle the following steps for you.
+<Collapsible summary="Do you need to create a new project?">
 
-## Installation
+If you are creating a new project, we recommend using `npx create-expo-app --template bare-minimum` (or `yarn create expo-app --template bare-minimum`) because it will handle the following configuration for you automatically. It includes the `expo-updates` [config plugin](/config-plugins/introduction/), which will handle the following steps for you.
+
+</Collapsible>
+
+<Collapsible summary="Do you use Continuous Native Generation (CNG) in your project?">
+
+You may be reading the wrong guide then! To use `expo-updates` in a project that uses [CNG](/workflow/continuous-native-generation/), refer to the [EAS Update "Get started" guide](/eas-update/getting-started/).
 
-The `expo-updates` library requires that your project already has [Expo modules configured](/bare/installing-expo-modules). Be sure to install it before continuing.
+</Collapsible>
+
+## Prerequisites
+
+**The `expo` package must be installed and configured**: if you created your project with `npx react-native init` and do not have any other Expo packages installed, you will need to [install Expo modules](/bare/installing-expo-modules) before proceeding.
+
+## Installation
 
 To get started, install `expo-updates`:
 
@@ -24,7 +37,7 @@ Then, install pods:
 
 Once installation is complete, apply the changes from the following diffs to configure `expo-updates` in your project.
 
-## Configuration in JavaScript and JSON
+### Configuration in JavaScript and JSON
 
 Modify the `expo` section of **app.json**. (If you originally created your app using `npx react-native init`, you will need to add this section.)
 The changes below add the updates URL to the Expo configuration.
@@ -79,7 +92,7 @@ If you want to set up a [custom server](/eas-update/custom-updates-server) inste
  }
 ```
 
-## Configuration for iOS
+### Configuration for iOS
 
 Add the file **Podfile.properties.json** to the **ios** directory:
 
@@ -137,7 +150,7 @@ Add the **Supporting** directory containing **Expo.plist** to your project in Xc
 </plist>
 ```
 
-## Configuration for Android
+### Configuration for Android
 
 Modify **android/app/build.gradle** to check for the JS engine configuration (JSC or Hermes) in Expo files:
 
diff --git a/docs/pages/bare/overview.mdx b/docs/pages/bare/overview.mdx
index 50384429751fe..5045c8ba45fba 100644
--- a/docs/pages/bare/overview.mdx
+++ b/docs/pages/bare/overview.mdx
@@ -1,50 +1,33 @@
 ---
-title: 'Bare React Native: Overview'
+title: Overview of using Expo with existing React Native apps
 sidebar_title: Overview
 hideTOC: true
-description: An overview of bare React Native apps with Expo tools.
+description: Learn how to use Expo tools and services with existing React Native apps.
 ---
 
 import { BoxLink } from '~/ui/components/BoxLink';
 import { Terminal } from '~/ui/components/Snippet';
 import { DEMI, CODE } from '~/ui/components/Text';
+import {
+  BookOpen02Icon,
+  Rocket02Icon,
+  Lightbulb01Icon,
+  RefreshCw02Icon,
+  BuildArtifactIcon,
+  ChevronUpDoubleIcon,
+} from '@expo/styleguide-icons';
 
-A bare React Native app is a project where developers make direct changes to their native **android** and **ios** project directories rather than continuously generating them on demand using [app config](/workflow/configuration/) and [prebuild](/workflow/prebuild). All tools and services offered by Expo including [EAS](/eas), Expo CLI, and the libraries in the Expo SDK, are built around bare React Native apps.
+A bare React Native app is a project where developers make direct changes to their native **android** and **ios** project directories rather than continuously generating ([with CNG](/workflow/continuous-native-generation/)) them using [app config](/workflow/configuration/) and [prebuild](/workflow/prebuild).
 
-## Prerequisites
+All tools and services provided by Expo, including [EAS](/eas), [Expo CLI](/more/expo-cli/), and [Expo SDK libraries](/versions/latest/), work great whether you use CNG to generate your native directories or you modify them directly (bare workflow).
 
-Before you get started with a React Native app, make sure you have set up your developer environment from [React Native](https://reactnative.dev/docs/environment-setup).
+{/* TODO: add information here about why you would want to use Expo tools and services in existing React Native apps */}
 
-## Get started
-
-To bootstrap a new React Native project, use `create-expo-app` and run the following command:
-
-<Terminal
-  cmd={['# Create a new bare project', '$ npx create-expo-app --template bare-minimum']}
-  cmdCopy="npx create-expo-app --template bare-minimum"
-/>
-
-> If you have an existing project or want to bootstrap with `npx react-native init`, then you need to [install the `expo` package](/bare/installing-expo-modules) manually.
-
-Navigate into your project directory, and run the following commands to build the app locally for each platform:
-
-<Terminal
-  cmd={[
-    '# Build your native Android project',
-    '$ npx expo run:android',
-    '',
-    '# Build your native iOS project',
-    '$ npx expo run:ios',
-  ]}
-/>
-
-> Learn more about [compiling native apps](/more/expo-cli/#compiling).
-
-## Next steps
+## Next Steps
 
 <BoxLink
   title="Install Expo modules"
-  description="If you have already initialized a React Native app without `create-expo-app`, learn how to install the Expo module library."
+  Icon={Rocket02Icon}
   description={
     <>
       If you have already initialized a React Native app without <CODE>create-expo-app</CODE>, learn
@@ -54,22 +37,38 @@ Navigate into your project directory, and run the following commands to build th
   href="/bare/installing-expo-modules"
 />
 <BoxLink
-  title="Install libraries"
-  description="Learn how to install and configure native libraries."
-  href="/workflow/using-libraries#installing-a-third-party-library"
+  title="Use Expo SDK"
+  Icon={BookOpen02Icon}
+  description="Use one of the many libraries provided by the Expo SDK, an extensive set of libraries that provide access to native APIs."
+  href="/versions/"
+/>
+<BoxLink
+  title="Write native modules"
+  description="Use the Expo Modules API to write native modules using Swift and Kotlin."
+  Icon={Lightbulb01Icon}
+  href="/modules/overview/"
+/>
+<BoxLink
+  title="Use Expo CLI"
+  Icon={BookOpen02Icon}
+  description="Learn about the many benefits Expo CLI provides over @react-native-community/cli."
+  href="/bare/using-expo-cli/"
+/>
+<BoxLink
+  title="Native project upgrade helper"
+  Icon={ChevronUpDoubleIcon}
+  description="View file-by-file diffs of all the changes you need to make to your native projects to upgrade them to the next Expo SDK and React Native version."
+  href="/bare/upgrade/"
 />
-<BoxLink title="Use Expo SDK" description="Start adding features to your app." href="/versions/" />
 <BoxLink
   title="Adopt Prebuild"
-  description={
-    <>
-      Automate your native directories using the <DEMI>app.json</DEMI>.
-    </>
-  }
+  Icon={RefreshCw02Icon}
+  description="Learn how to simplify maintaining your native projects by generating them on demand from configuration."
   href="/guides/adopting-prebuild"
 />
 <BoxLink
   title="App distribution"
+  Icon={BuildArtifactIcon}
   description="Build and submit your app to the app store with a single command."
   href="/distribution/introduction"
 />
diff --git a/docs/pages/brownfield/installing-expo-modules.mdx b/docs/pages/brownfield/installing-expo-modules.mdx
index 92ca9e62c9205..914fc07d9eaac 100644
--- a/docs/pages/brownfield/installing-expo-modules.mdx
+++ b/docs/pages/brownfield/installing-expo-modules.mdx
@@ -9,17 +9,19 @@ import { YesIcon, NoIcon } from '~/ui/components/DocIcons';
 import { Collapsible } from '~/ui/components/Collapsible';
 import { Step } from '~/ui/components/Step';
 
+> **warning** These instructions may not work for all projects. Support for integrating Expo modules into existing projects is still experimental. If you encounter issues, [create an issue on GitHub](https://github.com/expo/expo/issues)
+
 ## Prerequisites
 
-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.
+You should have a native project with React Native installed and configured to render a root view. If you don't have this yet, you can follow [the "Integration with Existing Apps" guide](https://reactnative.dev/docs/integration-with-existing-apps) on the React Native docs and then return here.
 
-## Install Expo modules
+## Install the `expo` package
 
 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).
 
 <Terminal cmd={['npm install expo']} />
 
-### iOS
+## Configure your iOS app
 
 <Step label="1">
   Add the following to your `Podfile` in the `ios` directory:
@@ -57,7 +59,7 @@ index 2d3a979..825a9d4 100644
 </Step>
 
 <Step label="4">
-  (Optional) Complete the following if you would like to use Expo modules lifecycle listeners.
+  **(Optional)** Complete the following if you would like to use [AppDelegate subscribers](/modules/appdelegate-subscribers/).
   <DiffBlock
     raw={`diff --git a/ios/<MyAppProject>/AppDelegate.swift b/ios/<MyAppProject>/AppDelegate.swift
 index ff83531..bd8651d 100644
@@ -80,7 +82,7 @@ index ff83531..bd8651d 100644
   />
 </Step>
 
-### Android
+## Configure your Android app
 
 <Step label="1">
   Add the following to the `gradle.properties` file in the `android` directory:
@@ -120,7 +122,7 @@ index a26c7c6..dd8802a 100644
 </Step>
 
 <Step label="4">
-  (Optional) Complete the following steps if you would like to use Expo modules lifecycle listeners
+  **(Optional)** Complete the following steps if you would like to use [lifecycle listener](/modules/android-lifecycle-listeners/)
   in your app:
 <Step label="1">
 If you already have a class that extends the `Application` class you can move to step 3.
@@ -188,8 +190,4 @@ class MainApplication() : Application() {
 Override `onConfigurationChanged` if you have not done so already.
 
 </Step>
-</Step>
-
-## Limitations
-
-Here we list limitations.
+</Step>
\ No newline at end of file
diff --git a/docs/pages/brownfield/overview.mdx b/docs/pages/brownfield/overview.mdx
index 8693bd324b4ec..2437f5e0a72c4 100644
--- a/docs/pages/brownfield/overview.mdx
+++ b/docs/pages/brownfield/overview.mdx
@@ -9,33 +9,39 @@ import { BoxLink } from '~/ui/components/BoxLink';
 import { Terminal } from '~/ui/components/Snippet';
 import { DEMI, CODE } from '~/ui/components/Text';
 
-If you already have a native app for Android and/or iOS and want to learn how to use Expo and React Native in your project, perhaps on a single screen or feature to start, this guide is for you. This type of app is commonly referred to as a "brownfield" app in the React Native ecosystem (as opposed to "greenfield" apps, which are created from scratch using Expo and React Native).
+An existing native app that was built using another technology, whose main entry point is *not* a React Native view, is commonly referred to as a "brownfield" app. For example, if your app was built using UIKit and Swift, and you want to use React Native for a single screen then that is considered an "existing native app" / "brownfield".
 
-## Compatibility
+In contrast, "greenfield" apps are those which are created from using Expo / React Native from the start or where React Native is the entry point and where all other UI branches off from.
+
+By these definitions, if you have an "existing native app" for Android and/or iOS and you want to learn how to use Expo and React Native in your project (perhaps on a single screen or even a single feature), then this guide is for you.
+
+## Compatibility with existing native apps
+
+> **info** Support for integrating Expo modules into existing native projects is still experimental. If you encounter issues, [create an issue on GitHub](https://github.com/expo/expo/issues). Not all features of the above tools/services will when used in the context of an existing native app.
 
 Expo is primarily built with greenfield apps in mind — not all Expo tools and services are compatible with existing native projects.
 
-| Tool/Service                                        | Supports brownfield? |
-| --------------------------------------------------- | -------------------- |
-| [Expo SDK](/versions/latest/)                       | Yes                  |
-| [Expo Modules API](/modules/overview/)              | Yes                  |
-| [Expo Router](/router/introduction/)                | No                   |
-| [Expo CLI](/more/expo-cli/)                         | No                   |
-| [Expo Dev Client](/versions/latest/sdk/dev-client/) | No                   |
-| [EAS Build](/build/introduction/)                   | Yes                  |
-| [EAS Submit](/submit/introduction/)                 | Yes                  |
-| [EAS Update](/eas-update/introduction/)             | No                   |
+| Tool/Service                                                                                         | Supports brownfield? |
+| ---------------------------------------------------------------------------------------------------- | -------------------- |
+| [Expo SDK](/versions/latest/) - an extended standard library for React Native                        | Yes                  |
+| [Expo Modules API](/modules/overview/) - build native extensions using an idiomatic Swift/Kotlin API | Yes                  |
+| [Expo Router](/router/introduction/) - file-based routing and navigation                             | No                   |
+| [Expo CLI](/more/expo-cli/) - tools to run and develop your app from your terminal                   | No                   |
+| [Expo Dev Client](/versions/latest/sdk/dev-client/) - adds in-app developer tooling to Debug builds  | No                   |
+| [EAS Build](/build/introduction/) - a CI/CD service built specifically for Expo/React Native         | Yes                  |
+| [EAS Submit](/submit/introduction/) - a hosted service that uploads your app to stores               | Yes                  |
+| [EAS Update](/eas-update/introduction/) - instant updates of your app JavaScript and assets          | No                   |
 
 ## Next steps
 
 <BoxLink
   title="Integrating your first React Native view"
-  description="Learn how to add a React Native root view to your existing native app"
-  href="<TODO>"
+  description="Learn how to add a React Native root view to your existing native app in the React Native docs."
+  href="https://reactnative.dev/docs/integration-with-existing-apps"
 />
 
 <BoxLink
   title="Install Expo modules"
-  description="Install the Expo Modules API and use it to add existing Expo modules or write your own modules"
+  description="Install the Expo Modules API and use it to add existing Expo modules or write your own native extensions."
   href="/brownfield/installing-expo-modules"
 />
diff --git a/docs/pages/develop/development-builds/create-a-build.mdx b/docs/pages/develop/development-builds/create-a-build.mdx
index ccfbb128776da..e17fe75dbbc47 100644
--- a/docs/pages/develop/development-builds/create-a-build.mdx
+++ b/docs/pages/develop/development-builds/create-a-build.mdx
@@ -34,7 +34,7 @@ The following instructions cover both Android and iOS and physical devices and e
 
 <Collapsible summary="Are you using this library in a bare React Native app?">
 
-Apps that don't use [Continuous Native Generation](/workflow/continuous-native-generation/) will need to follow the ["Install development builds in bare React Native" guide](/bare/install-dev-builds-in-bare/).
+Apps that don't use [Continuous Native Generation](/workflow/continuous-native-generation/) will need to follow the ["Install expo-dev-client in bare React Native" guide](/bare/install-dev-builds-in-bare/).
 
 </Collapsible>
 

From 15e13c838f8907d4ae268fae2a3e547fca47dcb9 Mon Sep 17 00:00:00 2001
From: Brent Vatne <brentvatne@gmail.com>
Date: Tue, 2 Apr 2024 18:30:21 -0700
Subject: [PATCH 4/7] Update overview

---
 docs/pages/bare/overview.mdx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/docs/pages/bare/overview.mdx b/docs/pages/bare/overview.mdx
index 5045c8ba45fba..6114d4d29a0ef 100644
--- a/docs/pages/bare/overview.mdx
+++ b/docs/pages/bare/overview.mdx
@@ -17,11 +17,15 @@ import {
   ChevronUpDoubleIcon,
 } from '@expo/styleguide-icons';
 
-A bare React Native app is a project where developers make direct changes to their native **android** and **ios** project directories rather than continuously generating ([with CNG](/workflow/continuous-native-generation/)) them using [app config](/workflow/configuration/) and [prebuild](/workflow/prebuild).
+If you have a React Native app that doesn't use any Expo tools, you might be wondering what Expo can provide for you, why you might want to use Expo tools and services, and how to get started.
 
-All tools and services provided by Expo, including [EAS](/eas), [Expo CLI](/more/expo-cli/), and [Expo SDK libraries](/versions/latest/), work great whether you use CNG to generate your native directories or you modify them directly (bare workflow).
+**All tools and services provided by Expo work great in any React Native app**.
 
-{/* TODO: add information here about why you would want to use Expo tools and services in existing React Native apps */}
+You can use [EAS](/eas) to get quickly set up with a professional CI/CD workflow for building, reviewing, deploying, and updating your apps. [Expo CLI](/more/expo-cli/) provides the best command line experience for working with React Native. The [Expo SDK](/versions/latest/) is an extended standard library for React Native, it gives developers access to high quality, well maintained native libraries that use consistent API conventions to make them easier to learn and use.
+
+If you've ever written a native module for React Native, you'll be surprised how much easier it is to build and maintain modules with the idiomatic Swift and Kotlin DSL provided by the [Expo Modules API](/modules/overview/).
+
+There's so much more to explore, and the links below will help you to explore the options available to you.
 
 ## Next Steps
 

From 9f668c573cf44cd779a5f579e81a9719b74bb79e Mon Sep 17 00:00:00 2001
From: Brent Vatne <brentvatne@gmail.com>
Date: Tue, 2 Apr 2024 18:40:41 -0700
Subject: [PATCH 5/7] Add sidebar title for updates section

---
 docs/pages/bare/installing-updates.mdx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/docs/pages/bare/installing-updates.mdx b/docs/pages/bare/installing-updates.mdx
index a4c95d4dcabe8..47d03e562af8a 100644
--- a/docs/pages/bare/installing-updates.mdx
+++ b/docs/pages/bare/installing-updates.mdx
@@ -1,5 +1,6 @@
 ---
 title: Install expo-updates in a bare React Native project
+sidebar_title: Install expo-updates
 description: Learn how to install and configure expo-updates in bare React Native projects.
 ---
 

From 9553e7ffe9cc32c1c054de77a4ce5af0b407f3df Mon Sep 17 00:00:00 2001
From: Brent Vatne <brentvatne@gmail.com>
Date: Tue, 2 Apr 2024 21:47:43 -0700
Subject: [PATCH 6/7] Apply suggestions from code review

Co-authored-by: James Ide <ide@users.noreply.github.com>
---
 docs/pages/bare/install-dev-builds-in-bare.mdx    | 6 +++---
 docs/pages/bare/installing-updates.mdx            | 2 +-
 docs/pages/bare/overview.mdx                      | 2 +-
 docs/pages/brownfield/installing-expo-modules.mdx | 6 +++---
 docs/pages/brownfield/overview.mdx                | 6 +++---
 5 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/docs/pages/bare/install-dev-builds-in-bare.mdx b/docs/pages/bare/install-dev-builds-in-bare.mdx
index ae47c540888a2..4c5317a224a3f 100644
--- a/docs/pages/bare/install-dev-builds-in-bare.mdx
+++ b/docs/pages/bare/install-dev-builds-in-bare.mdx
@@ -9,11 +9,11 @@ import { Step } from '~/ui/components/Step';
 import ImageSpotlight from '~/components/plugins/ImageSpotlight';
 import { Collapsible } from '~/ui/components/Collapsible';
 
-The following guide explains how to install and configure `expo-dev-client` in an exisitng React Native project.
+The following guide explains how to install and configure `expo-dev-client` in an existing React Native project.
 
 <Collapsible summary="Do you need to create a new project?">
 
-If you're starting a project, you can create a new project with with `with-dev-client` template. Run the following command to initialize the project:
+If you're starting a project, you can create a new project with the `with-dev-client` template. Run this command to initialize the project:
 
 <Terminal cmd={['$ npx create-expo-app -e with-dev-client']} />
 
@@ -51,7 +51,7 @@ If your project doesn't have an **ios/** directory, you can skip this step.
 
 ## Configure deep links
 
-Expo CLI uses a deep link to launch your project, and it's also useful if you use plan to [use `expo-dev-client` for launching preview updates](/eas-update/getting-started/) If you have added a custom deep link scheme to your project. If you haven't configured a `scheme` for your app yet to support deep linking, then you can use `uri-scheme` package to do this for you.
+Expo CLI uses a deep link to launch your project, and it's also useful if you use plan to [use `expo-dev-client` for launching preview updates](/eas-update/getting-started/) if you have added a custom deep link scheme to your project. If you haven't configured a `scheme` for your app yet to support deep linking, then you can use `uri-scheme` package to do this for you.
 
 <Terminal
   cmd={[
diff --git a/docs/pages/bare/installing-updates.mdx b/docs/pages/bare/installing-updates.mdx
index 47d03e562af8a..e7546a390af6e 100644
--- a/docs/pages/bare/installing-updates.mdx
+++ b/docs/pages/bare/installing-updates.mdx
@@ -12,7 +12,7 @@ The `expo-updates` library fetches and manages updates to app JavaScript and ass
 
 <Collapsible summary="Do you need to create a new project?">
 
-If you are creating a new project, we recommend using `npx create-expo-app --template bare-minimum` (or `yarn create expo-app --template bare-minimum`) because it will handle the following configuration for you automatically. It includes the `expo-updates` [config plugin](/config-plugins/introduction/), which will handle the following steps for you.
+If you are creating a new project, we recommend using `npx create-expo-app --template bare-minimum` (or `yarn create expo-app --template bare-minimum`) because it will handle the following configuration for you automatically. It includes the `expo-updates` [config plugin](/config-plugins/introduction/), which will handle the installation steps for you.
 
 </Collapsible>
 
diff --git a/docs/pages/bare/overview.mdx b/docs/pages/bare/overview.mdx
index 6114d4d29a0ef..2a952ec38e3ba 100644
--- a/docs/pages/bare/overview.mdx
+++ b/docs/pages/bare/overview.mdx
@@ -21,7 +21,7 @@ If you have a React Native app that doesn't use any Expo tools, you might be won
 
 **All tools and services provided by Expo work great in any React Native app**.
 
-You can use [EAS](/eas) to get quickly set up with a professional CI/CD workflow for building, reviewing, deploying, and updating your apps. [Expo CLI](/more/expo-cli/) provides the best command line experience for working with React Native. The [Expo SDK](/versions/latest/) is an extended standard library for React Native, it gives developers access to high quality, well maintained native libraries that use consistent API conventions to make them easier to learn and use.
+You can use [EAS](/eas) to get quickly set up with a professional CI/CD workflow for building, reviewing, deploying, and updating your apps. [Expo CLI](/more/expo-cli/) provides the best command-line experience for working with React Native. The [Expo SDK](/versions/latest/) is an extended standard library for React Native. It gives developers high-quality, well maintained native libraries that use consistent API conventions to make them easier to learn and use.
 
 If you've ever written a native module for React Native, you'll be surprised how much easier it is to build and maintain modules with the idiomatic Swift and Kotlin DSL provided by the [Expo Modules API](/modules/overview/).
 
diff --git a/docs/pages/brownfield/installing-expo-modules.mdx b/docs/pages/brownfield/installing-expo-modules.mdx
index 914fc07d9eaac..3b6b00d6dcc99 100644
--- a/docs/pages/brownfield/installing-expo-modules.mdx
+++ b/docs/pages/brownfield/installing-expo-modules.mdx
@@ -9,7 +9,7 @@ import { YesIcon, NoIcon } from '~/ui/components/DocIcons';
 import { Collapsible } from '~/ui/components/Collapsible';
 import { Step } from '~/ui/components/Step';
 
-> **warning** These instructions may not work for all projects. Support for integrating Expo modules into existing projects is still experimental. If you encounter issues, [create an issue on GitHub](https://github.com/expo/expo/issues)
+> **warning** These instructions may not work for all projects. Support for integrating Expo modules into existing projects is still experimental. If you encounter issues, [create an issue on GitHub](https://github.com/expo/expo/issues).
 
 ## Prerequisites
 
@@ -47,7 +47,7 @@ index 2d3a979..825a9d4 100644
 </Step>
 
 <Step label="2">
-  Open your `ios` directory in XCode. From the project navigator, select your project and then
+  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`.
 </Step>
@@ -122,7 +122,7 @@ index a26c7c6..dd8802a 100644
 </Step>
 
 <Step label="4">
-  **(Optional)** Complete the following steps if you would like to use [lifecycle listener](/modules/android-lifecycle-listeners/)
+  **(Optional)** Complete the following steps if you would like to use [lifecycle listeners](/modules/android-lifecycle-listeners/)
   in your app:
 <Step label="1">
 If you already have a class that extends the `Application` class you can move to step 3.
diff --git a/docs/pages/brownfield/overview.mdx b/docs/pages/brownfield/overview.mdx
index 2437f5e0a72c4..1440c4586cbbc 100644
--- a/docs/pages/brownfield/overview.mdx
+++ b/docs/pages/brownfield/overview.mdx
@@ -9,11 +9,11 @@ import { BoxLink } from '~/ui/components/BoxLink';
 import { Terminal } from '~/ui/components/Snippet';
 import { DEMI, CODE } from '~/ui/components/Text';
 
-An existing native app that was built using another technology, whose main entry point is *not* a React Native view, is commonly referred to as a "brownfield" app. For example, if your app was built using UIKit and Swift, and you want to use React Native for a single screen then that is considered an "existing native app" / "brownfield".
+An existing native app that was built using another technology, whose main entry point is *not* a React Native view, is commonly referred to as a "brownfield" app. For example, if your app was built using UIKit and Swift, and you want to use React Native for a single screen then that is considered an "existing native app" and "brownfield".
 
-In contrast, "greenfield" apps are those which are created from using Expo / React Native from the start or where React Native is the entry point and where all other UI branches off from.
+In contrast, "greenfield" apps are those which are created using Expo or React Native from the start or where React Native is the entry point and where all other UI branches off from.
 
-By these definitions, if you have an "existing native app" for Android and/or iOS and you want to learn how to use Expo and React Native in your project (perhaps on a single screen or even a single feature), then this guide is for you.
+By these definitions, if you have an "existing native app" for Android or iOS and you want to learn how to use Expo and React Native in your project (perhaps on a single screen or even a single feature), then this guide is for you.
 
 ## Compatibility with existing native apps
 

From 4983dc208dd38d5dbe7bd3146fe89335a17be4fc Mon Sep 17 00:00:00 2001
From: Brent Vatne <brentvatne@gmail.com>
Date: Tue, 2 Apr 2024 21:51:00 -0700
Subject: [PATCH 7/7] Address code review feedback

---
 .../brownfield/installing-expo-modules.mdx    | 126 +++++++++---------
 1 file changed, 63 insertions(+), 63 deletions(-)

diff --git a/docs/pages/brownfield/installing-expo-modules.mdx b/docs/pages/brownfield/installing-expo-modules.mdx
index 3b6b00d6dcc99..3d1f2bfc6ab54 100644
--- a/docs/pages/brownfield/installing-expo-modules.mdx
+++ b/docs/pages/brownfield/installing-expo-modules.mdx
@@ -21,67 +21,6 @@ First, add the `expo` package to your project. Ensure you are using a version of
 
 <Terminal cmd={['npm install expo']} />
 
-## Configure your iOS app
-
-<Step label="1">
-  Add the following to your `Podfile` in the `ios` directory:
-  <DiffBlock
-    raw={`
-diff --git a/ios/Podfile b/ios/Podfile
-index 2d3a979..825a9d4 100644
---- a/ios/Podfile
-+++ b/ios/Podfile
-@@ -1,3 +1,4 @@
-+require File.join(File.dirname(\`node --print "require.resolve('expo/package.json')"\`), "scripts/autolinking")
- require Pod::Executable.execute_command('node', ['-p',
-   'require.resolve(
-   "react-native/scripts/react_native_pods.rb",
-@@ -14,6 +15,7 @@ if linkage != nil
- end
- 
- target '<YourAppTarget>' do
-+  use_expo_modules!
-   config = use_native_modules!
-  `}
-  />
-</Step>
-
-<Step label="2">
-  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`.
-</Step>
-
-<Step label="3">
-  Run `pod install` in the `ios` directory.
-  <Terminal cmd={['cd ios && pod install']} />
-  You will need to do this everytime you add a dependency that uses native code.
-</Step>
-
-<Step label="4">
-  **(Optional)** Complete the following if you would like to use [AppDelegate subscribers](/modules/appdelegate-subscribers/).
-  <DiffBlock
-    raw={`diff --git a/ios/<MyAppProject>/AppDelegate.swift b/ios/<MyAppProject>/AppDelegate.swift
-index ff83531..bd8651d 100644
---- a/ios/<MyAppProject>/AppDelegate.swift
-+++ b/ios/<MyAppProject>/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)
-   }
- `}
-  />
-</Step>
-
 ## Configure your Android app
 
 <Step label="1">
@@ -123,7 +62,7 @@ index a26c7c6..dd8802a 100644
 
 <Step label="4">
   **(Optional)** Complete the following steps if you would like to use [lifecycle listeners](/modules/android-lifecycle-listeners/)
-  in your app:
+  in your app. If you do not set up lifecycle listeners, then additional setup will be required for each module that uses them.
 <Step label="1">
 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/<your-app-package>` directory with the following content:
@@ -190,4 +129,65 @@ class MainApplication() : Application() {
 Override `onConfigurationChanged` if you have not done so already.
 
 </Step>
-</Step>
\ No newline at end of file
+</Step>
+
+## Configure your iOS app
+
+<Step label="1">
+  Add the following to your `Podfile` in the `ios` directory:
+  <DiffBlock
+    raw={`
+diff --git a/ios/Podfile b/ios/Podfile
+index 2d3a979..825a9d4 100644
+--- a/ios/Podfile
++++ b/ios/Podfile
+@@ -1,3 +1,4 @@
++require File.join(File.dirname(\`node --print "require.resolve('expo/package.json')"\`), "scripts/autolinking")
+ require Pod::Executable.execute_command('node', ['-p',
+   'require.resolve(
+   "react-native/scripts/react_native_pods.rb",
+@@ -14,6 +15,7 @@ if linkage != nil
+ end
+ 
+ target '<YourAppTarget>' do
++  use_expo_modules!
+   config = use_native_modules!
+  `}
+  />
+</Step>
+
+<Step label="2">
+  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`.
+</Step>
+
+<Step label="3">
+  Run `pod install` in the `ios` directory.
+  <Terminal cmd={['cd ios && pod install']} />
+  You will need to do this everytime you add a dependency that uses native code.
+</Step>
+
+<Step label="4">
+  **(Optional)** Complete the following if you would like to use [AppDelegate subscribers](/modules/appdelegate-subscribers/). If you do not set up AppDelegate subscribers, then additional setup will be required for each module that uses them.
+  <DiffBlock
+    raw={`diff --git a/ios/<MyAppProject>/AppDelegate.swift b/ios/<MyAppProject>/AppDelegate.swift
+index ff83531..bd8651d 100644
+--- a/ios/<MyAppProject>/AppDelegate.swift
++++ b/ios/<MyAppProject>/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)
+   }
+ `}
+  />
+</Step>