Skip to content

Commit 7a6ace8

Browse files
authored
[iOS] Rewrite the guide to integrate with Brownfield apps (#4239)
* [iOS] Rewrite the guide to integrate with Brownfield apps * Apply review feedback * Apply review feedback
1 parent 61313ad commit 7a6ace8

8 files changed

+622
-798
lines changed

docs/_integration-with-existing-apps-ios.md

Lines changed: 605 additions & 0 deletions
Large diffs are not rendered by default.

docs/_integration-with-existing-apps-kotlin.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ To ensure a smooth experience, create a new folder for your integrated React Nat
2929
Go to the root directory and run the following command:
3030

3131
```
32-
wget https://raw.githubusercontent.com/react-native-community/template/refs/heads/0.75-stable/template/package.json
32+
curl -O https://raw.githubusercontent.com/react-native-community/template/refs/heads/0.75-stable/template/package.json
3333
```
3434

3535
This will copy the `package.json` [file from the Community template](https://github.com/react-native-community/template/blob/0.75-stable/template/package.json) to your project.
@@ -53,7 +53,7 @@ yarn install
5353
</TabItem>
5454
</Tabs>
5555

56-
Installation process has created a new `/node_modules` folder. This folder stores all the JavaScript dependencies required to build your project.
56+
Installation process has created a new `node_modules` folder. This folder stores all the JavaScript dependencies required to build your project.
5757

5858
Add `node_modules/` to your `.gitignore` file (here the [Community default one](https://github.com/react-native-community/template/blob/0.75-stable/template/_gitignore)).
5959

@@ -184,7 +184,7 @@ AppRegistry.registerComponent('HelloWorld', () => App);
184184

185185
### Create a `App.tsx` file
186186

187-
Then, let's create a `App.tsx` file. This is a TypeScript file that will contain the React Native component that we will integrate into our Android application.
187+
Let's create an `App.tsx` file. This is a [TypeScript](https://www.typescriptlang.org/) file that can have [JSX](<https://en.wikipedia.org/wiki/JSX_(JavaScript)>) expressions. It contains the root React Native component that we will integrate into our Android application ([link](https://github.com/react-native-community/template/blob/0.76-stable/template/App.tsx)):
188188

189189
```tsx
190190
import React from 'react';
@@ -447,7 +447,7 @@ Now your activity is ready to run some JavaScript code.
447447

448448
## 6. Test your integration
449449

450-
You have now done all the basic steps to integrate React Native with your current application. Now we will start the [Metro bundler](https://metrobundler.dev/) to build the TypeScript code of your application and have the server running on localhost to serve it.
450+
You have completed all the basic steps to integrate React Native with your application. Now we will start the [Metro bundler](https://metrobundler.dev/) to build your TypeScript application code into a bundle. Metro's HTTP server shares the bundle from `localhost` on your developer environment to a simulator or device. This allows for [hot reloading](https://reactnative.dev/blog/2016/03/24/introducing-hot-reloading).
451451

452452
First, you need to create a `metro.config.js` file in the root of your project as follows:
453453

@@ -481,7 +481,7 @@ Now build and run your Android app as normal.
481481

482482
Once you reach your React-powered Activity inside the app, it should load the JavaScript code from the development server and display:
483483

484-
![Screenshot](/docs/assets/EmbeddedAppAndroidVideo.gif)
484+
<center><img src="/docs/assets/EmbeddedAppAndroidVideo.gif" width="300" /></center>
485485

486486
### Creating a release build in Android Studio
487487

docs/_integration-with-existing-apps-objc.md

Lines changed: 0 additions & 403 deletions
This file was deleted.

0 commit comments

Comments
 (0)