0805 sync 0.73 (#734)

* Update Debugging docs to no longer recommend Remote debugging (facebook#3702) Co-authored-by: Alex Hunt <[email protected]> * Bump fast-xml-parser from 4.2.4 to 4.2.5 (facebook#3777) Bumps [fast-xml-parser](https://github.com/NaturalIntelligence/fast-xml-parser) from 4.2.4 to 4.2.5. - [Release notes](https://github.com/NaturalIntelligence/fast-xml-parser/releases) - [Changelog](https://github.com/NaturalIntelligence/fast-xml-parser/blob/master/CHANGELOG.md) - [Commits](NaturalIntelligence/fast-xml-parser@v4.2.4...v4.2.5) --- updated-dependencies: - dependency-name: fast-xml-parser dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Upgrade got dependency (facebook#3776) * feature: Move to GA4 (UA being reprecated in June) Google Analytics is deprecating the older clients. This is the first step to enable to newer client. This should be followed with a step to remove the old client once we know data is flowing. * Upgrade got dependency Resolves dependabot alerts #26 * Use `https` links over `http` (facebook#3761) * [docs] Update/simplify info around Metro for env setup (facebook#3673) * [docs] Add Metro guide, update Metro config references (facebook#3772) * [docs] Remove static config note in Metro guide, adjust formatting (facebook#3782) * Improving Grammar and Clarity.md (facebook#3783) Improving Grammar and Clarity in React Native's Performance Description * Fix docs for onResponderGrant (facebook#3785) * react-native-gradle-plugin renamed to @react-native/gradle-plugin (facebook#3786) * Update _integration-with-existing-apps-kotlin.md * Update _integration-with-existing-apps-kotlin.md * Update _integration-with-existing-apps-java.md * Update _integration-with-existing-apps-java.md * Update _integration-with-existing-apps-kotlin.md * Update how-to-build-from-source for 0.72+ (facebook#3659) * Clarify documentation for turbomodules (facebook#3787) * Clarify documentation for turbomodules `codegenConfig` is stated in text that it's an array, but in code example it's an object. Either the text or the code example should change. * Fix linting issue * Update the PR to reflect knowledge that the code sample is correct but documentation wrong * Update FlatList Optimization Guide for FCs (facebook#3700) * Update FlatList Optimization Guide for FCs * fix lint * Update docs/optimizing-flatlist-configuration.md --------- Co-authored-by: Егорик <[email protected]> Co-authored-by: Nick Gerleman <[email protected]> * [docs] Add guidance on repo build scripts (facebook#3788) * [docs] add Chain React 2023 playlist link on staying-updated (facebook#3790) * Bump semver from 5.7.1 to 5.7.2 (facebook#3791) Bumps [semver](https://github.com/npm/node-semver) from 5.7.1 to 5.7.2. - [Release notes](https://github.com/npm/node-semver/releases) - [Changelog](https://github.com/npm/node-semver/blob/v5.7.2/CHANGELOG.md) - [Commits](npm/node-semver@v5.7.1...v5.7.2) --- updated-dependencies: - dependency-name: semver dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Docusaurus v2.4.1 (facebook#3778) * Bump word-wrap from 1.2.3 to 1.2.4 (facebook#3794) Bumps [word-wrap](https://github.com/jonschlinkert/word-wrap) from 1.2.3 to 1.2.4. - [Release notes](https://github.com/jonschlinkert/word-wrap/releases) - [Commits](jonschlinkert/word-wrap@1.2.3...1.2.4) --- updated-dependencies: - dependency-name: word-wrap dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * docs: iOS backwards compatibility update (facebook#3775) * Update backward-compatibility-fabric-components.md Ensure backwards-compat docs refer to all necessary code changes. reactwg/react-native-new-architecture#8 (comment) * Update docs/the-new-architecture/backward-compatibility-fabric-components.md Co-authored-by: Riccardo Cipolleschi <[email protected]> * trim whitespace and fix typo --------- Co-authored-by: Riccardo Cipolleschi <[email protected]> * [website] swizzle DocVersionBanner, tweak wording (facebook#3800) * tweak: improve wordiness on docs about bumping monorepo packages (facebook#3805) * Fix typo in architecture-glossary.md (facebook#3806) * docs: change js to tsx (facebook#3808) * Update website to use JDK 17 (facebook#3812) LGTM. --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: Gabriel Donadel Dall'Agnol <[email protected]> Co-authored-by: Alex Hunt <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Blake Friedman <[email protected]> Co-authored-by: Pranav Yadav <[email protected]> Co-authored-by: Waseem Kurne <[email protected]> Co-authored-by: Pieter De Baets <[email protected]> Co-authored-by: Nicola Corti <[email protected]> Co-authored-by: Stefan Wallin <[email protected]> Co-authored-by: Егорик <[email protected]> Co-authored-by: Егорик <[email protected]> Co-authored-by: Nick Gerleman <[email protected]> Co-authored-by: David Leuliette <[email protected]> Co-authored-by: Sébastien Lorber <[email protected]> Co-authored-by: Connor Mullins <[email protected]> Co-authored-by: Riccardo Cipolleschi <[email protected]> Co-authored-by: Bartosz Kaszubowski <[email protected]> Co-authored-by: Lorenzo Sciandra <[email protected]> Co-authored-by: Stanley Ugwu <[email protected]> Co-authored-by: kong <[email protected]>
reactnativecn · Aug 5, 2023 · fe6e34b · fe6e34b
1 parent 5d71dfc
commit fe6e34b
Show file tree

Hide file tree

Showing 87 changed files with 923 additions and 458 deletions.
diff --git a/docs/_getting-started-linux-android.md b/docs/_getting-started-linux-android.md
@@ -13,7 +13,7 @@ Follow the [installation instructions for your Linux distribution](https://nodej
 
 <h3>Java Development Kit</h3>
 
-React Native currently recommends version 11 of the Java SE Development Kit (JDK). You may encounter problems using higher JDK versions. You may download and install [OpenJDK](http://openjdk.java.net) from [AdoptOpenJDK](https://adoptopenjdk.net/) or your system packager.
+React Native currently recommends version 17 of the Java SE Development Kit (JDK). You may encounter problems using higher JDK versions. You may download and install [OpenJDK](https://openjdk.java.net) from [AdoptOpenJDK](https://adoptopenjdk.net/) or your system packager.
 
 <h3>Android development environment</h3>
 
@@ -126,9 +126,7 @@ Click "Next" then "Finish" to create your AVD. At this point you should be able
 
 <h3>Step 1: Start Metro</h3>
 
-First, you will need to start Metro, the JavaScript bundler that ships with React Native. Metro "takes in an entry file and various options, and returns a single JavaScript file that includes all your code and its dependencies."—[Metro Docs](https://facebook.github.io/metro/docs/concepts)
-
-To start Metro, run following command inside your React Native project folder:
+[**Metro**](https://facebook.github.io/metro/) is the JavaScript build tool for React Native. To start the Metro development server, run the following from your project folder:
 
 <Tabs groupId="package-manager" queryString defaultValue={constants.defaultPackageManager} values={constants.packageManagers}>
 <TabItem value="npm">
@@ -147,7 +145,9 @@ yarn start
 </TabItem>
 </Tabs>
 
-> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more widely supported JavaScript.
+:::note
+If you're familiar with web development, Metro is similar to bundlers such as Vite and Webpack, but is designed end-to-end for React Native. For instance, Metro uses [Babel](https://babel.dev/) to transform syntax such as JSX into executable JavaScript.
+:::
 
 <h3>Step 2: Start your application</h3>
 

diff --git a/docs/_getting-started-macos-android.md b/docs/_getting-started-macos-android.md
@@ -9,7 +9,7 @@ While you can use any editor of your choice to develop your app, you will need t
 
 <h3>Node &amp; Watchman</h3>
 
-We recommend installing Node and Watchman using [Homebrew](http://brew.sh/). Run the following commands in a Terminal after installing Homebrew:
+We recommend installing Node and Watchman using [Homebrew](https://brew.sh/). Run the following commands in a Terminal after installing Homebrew:
 
 ```shell
 brew install node
@@ -22,21 +22,21 @@ If you have already installed Node on your system, make sure it is Node 16 or ne
 
 <h3>Java Development Kit</h3>
 
-We recommend installing the OpenJDK distribution called Azul **Zulu** using [Homebrew](http://brew.sh/). Run the following commands in a Terminal after installing Homebrew:
+We recommend installing the OpenJDK distribution called Azul **Zulu** using [Homebrew](https://brew.sh/). Run the following commands in a Terminal after installing Homebrew:
 
 ```shell
 brew tap homebrew/cask-versions
-brew install --cask zulu11
+brew install --cask zulu17
 
 # Get path to where cask was installed to double-click installer
-brew info --cask zulu11
+brew info --cask zulu17
 ```
 
-After you install the JDK, update your `JAVA_HOME` environment variable. If you used above steps, JDK will likely be at `/Library/Java/JavaVirtualMachines/zulu-11.jdk/Contents/Home`
+After you install the JDK, update your `JAVA_HOME` environment variable. If you used above steps, JDK will likely be at `/Library/Java/JavaVirtualMachines/zulu-17.jdk/Contents/Home`
 
 The Zulu OpenJDK distribution offers JDKs for **both Intel and M1 Macs**. This will make sure your builds are faster on M1 Macs compared to using an Intel-based JDK.
 
-If you have already installed JDK on your system, we recommend JDK 11. You may encounter problems using higher JDK versions.
+If you have already installed JDK on your system, we recommend JDK 17. You may encounter problems using higher JDK versions.
 
 <h3>Android development environment</h3>
 
@@ -141,9 +141,7 @@ Click "Next" then "Finish" to create your AVD. At this point you should be able
 
 <h3>Step 1: Start Metro</h3>
 
-First, you will need to start Metro, the JavaScript bundler that ships with React Native. Metro "takes in an entry file and various options, and returns a single JavaScript file that includes all your code and its dependencies."—[Metro Docs](https://facebook.github.io/metro/docs/concepts)
-
-To start Metro, run following command inside your React Native project folder:
+[**Metro**](https://facebook.github.io/metro/) is the JavaScript build tool for React Native. To start the Metro development server, run the following from your project folder:
 
 <Tabs groupId="package-manager" queryString defaultValue={constants.defaultPackageManager} values={constants.packageManagers}>
 <TabItem value="npm">
@@ -162,7 +160,9 @@ yarn start
 </TabItem>
 </Tabs>
 
-> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more widely supported JavaScript.
+:::note
+If you're familiar with web development, Metro is similar to bundlers such as Vite and Webpack, but is designed end-to-end for React Native. For instance, Metro uses [Babel](https://babel.dev/) to transform syntax such as JSX into executable JavaScript.
+:::
 
 <h3>Step 2: Start your application</h3>
 

diff --git a/docs/_getting-started-macos-ios.md b/docs/_getting-started-macos-ios.md
@@ -1,3 +1,4 @@
+import Anchor from './Anchor.jsx';
 import RemoveGlobalCLI from './\_remove-global-cli.md';
 import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import constants from '@site/core/TabsConstants';
 
@@ -9,7 +10,7 @@ While you can use any editor of your choice to develop your app, you will need t
 
 ### Node & Watchman
 
-We recommend installing Node and Watchman using [Homebrew](http://brew.sh/). Run the following commands in a Terminal after installing Homebrew:
+We recommend installing Node and Watchman using [Homebrew](https://brew.sh/). Run the following commands in a Terminal after installing Homebrew:
 
 ```shell
 brew install node
@@ -90,7 +91,7 @@ This is the **suggested approach** to decouple the build infrastructure from the
 On top of this, it's possible to add any other environment variable and to source the `.xcode.env` file in your build script phases. If you need to run script that requires some specific environment, this is the **suggested approach**: it allows to decouple the build phases from a specific environment.
 
 :::info
-If you are already using [NVM](http://nvm.sh/) (a command which helps you install and switch between versions of Node.js) and [zsh](https://ohmyz.sh/), you might want to move the code that initialize NVM from your `~/.zshrc` into a `~/.zshenv` file to help Xcode find your Node executable:
+If you are already using [NVM](https://nvm.sh/) (a command which helps you install and switch between versions of Node.js) and [zsh](https://ohmyz.sh/), you might want to move the code that initialize NVM from your `~/.zshrc` into a `~/.zshenv` file to help Xcode find your Node executable:
 
 ```zsh
 export NVM_DIR="$HOME/.nvm"
@@ -104,9 +105,7 @@ You might also want to ensure that all "shell script build phase" of your Xcode
 
 ### Step 1: Start Metro
 
-First, you will need to start Metro, the JavaScript bundler that ships with React Native. Metro "takes in an entry file and various options, and returns a single JavaScript file that includes all your code and its dependencies."—[Metro Docs](https://facebook.github.io/metro/docs/concepts)
-
-To start Metro, run following command inside your React Native project folder:
+[**Metro**](https://facebook.github.io/metro/) is the JavaScript build tool for React Native. To start the Metro development server, run the following from your project folder:
 
 <Tabs groupId="package-manager" queryString defaultValue={constants.defaultPackageManager} values={constants.packageManagers}>
 <TabItem value="npm">
@@ -125,7 +124,9 @@ yarn start
 </TabItem>
 </Tabs>
 
-> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Swift or Objective-C, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more widely supported JavaScript.
+:::note
+If you're familiar with web development, Metro is similar to bundlers such as Vite and Webpack, but is designed end-to-end for React Native. For instance, Metro uses [Babel](https://babel.dev/) to transform syntax such as JSX into executable JavaScript.
+:::
 
 ### Step 2: Start your application
 

diff --git a/docs/_getting-started-windows-android.md b/docs/_getting-started-windows-android.md
@@ -13,15 +13,15 @@ We recommend installing Node via [Chocolatey](https://chocolatey.org), a popular
 
 It is recommended to use an LTS version of Node. If you want to be able to switch between different versions, you might want to install Node via [nvm-windows](https://github.com/coreybutler/nvm-windows), a Node version manager for Windows.
 
-React Native also requires [Java SE Development Kit (JDK)](https://openjdk.java.net/projects/jdk/11/), which can be installed using Chocolatey as well.
+React Native also requires [Java SE Development Kit (JDK)](https://openjdk.java.net/projects/jdk/17/), which can be installed using Chocolatey as well.
 
 Open an Administrator Command Prompt (right click Command Prompt and select "Run as Administrator"), then run the following command:
 
 ```powershell
-choco install -y nodejs-lts microsoft-openjdk11
+choco install -y nodejs-lts microsoft-openjdk17
 ```
 
-If you have already installed Node on your system, make sure it is Node 16 or newer. If you already have a JDK on your system, we recommend JDK11. You may encounter problems using higher JDK versions.
+If you have already installed Node on your system, make sure it is Node 16 or newer. If you already have a JDK on your system, we recommend JDK17. You may encounter problems using higher JDK versions.
 
 > You can find additional installation options on [Node's Downloads page](https://nodejs.org/en/download/).
 
@@ -157,9 +157,7 @@ Click "Next" then "Finish" to create your AVD. At this point you should be able
 
 <h3>Step 1: Start Metro</h3>
 
-First, you will need to start Metro, the JavaScript bundler that ships with React Native. Metro "takes in an entry file and various options, and returns a single JavaScript file that includes all your code and its dependencies."—[Metro Docs](https://facebook.github.io/metro/docs/concepts)
-
-To start Metro, run following command inside your React Native project folder:
+[**Metro**](https://facebook.github.io/metro/) is the JavaScript build tool for React Native. To start the Metro development server, run the following from your project folder:
 
 <Tabs groupId="package-manager" queryString defaultValue={constants.defaultPackageManager} values={constants.packageManagers}>
 <TabItem value="npm">
@@ -178,7 +176,9 @@ yarn start
 </TabItem>
 </Tabs>
 
-> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more widely supported JavaScript.
+:::note
+If you're familiar with web development, Metro is similar to bundlers such as Vite and Webpack, but is designed end-to-end for React Native. For instance, Metro uses [Babel](https://babel.dev/) to transform syntax such as JSX into executable JavaScript.
+:::
 
 <h3>Step 2: Start your application</h3>
 

diff --git a/docs/_integration-with-existing-apps-java.md b/docs/_integration-with-existing-apps-java.md
@@ -88,7 +88,7 @@ React Native uses the React Native Gradle Plugin to configure your dependencies
 First, let's edit your `settings.gradle` file by adding this line:
 
 ```groovy
-includeBuild('../node_modules/react-native-gradle-plugin')
+includeBuild('../node_modules/@react-native/gradle-plugin')
 ```
 
 Then you need to open your top level `build.gradle` and include this line:

diff --git a/docs/_integration-with-existing-apps-kotlin.md b/docs/_integration-with-existing-apps-kotlin.md
@@ -88,7 +88,7 @@ React Native uses the React Native Gradle Plugin to configure your dependencies
 First, let's edit your `settings.gradle` file by adding this line:
 
 ```groovy
-includeBuild('../node_modules/react-native-gradle-plugin')
+includeBuild('../node_modules/@react-native/gradle-plugin')
 ```
 
 Then you need to open your top level `build.gradle` and include this line:

diff --git a/docs/_integration-with-existing-apps-objc.md b/docs/_integration-with-existing-apps-objc.md
@@ -85,9 +85,9 @@ Add `node_modules/` to your `.gitignore` file.
 
 ### 3. Install CocoaPods
 
-[CocoaPods](http://cocoapods.org) is a package management tool for iOS and macOS development. We use it to add the actual React Native framework code locally into your current project.
+[CocoaPods](https://cocoapods.org) is a package management tool for iOS and macOS development. We use it to add the actual React Native framework code locally into your current project.
 
-We recommend installing CocoaPods using [Homebrew](http://brew.sh/).
+We recommend installing CocoaPods using [Homebrew](https://brew.sh/).
 
 ```shell
 brew install cocoapods

diff --git a/docs/_integration-with-existing-apps-swift.md b/docs/_integration-with-existing-apps-swift.md
@@ -83,9 +83,9 @@ Add `node_modules/` to your `.gitignore` file.
 
 ### 3. Install CocoaPods
 
-[CocoaPods](http://cocoapods.org) is a package management tool for iOS and macOS development. We use it to add the actual React Native framework code locally into your current project.
+[CocoaPods](https://cocoapods.org) is a package management tool for iOS and macOS development. We use it to add the actual React Native framework code locally into your current project.
 
-We recommend installing CocoaPods using [Homebrew](http://brew.sh/).
+We recommend installing CocoaPods using [Homebrew](https://brew.sh/).
 
 ```shell
 $ brew install cocoapods

diff --git a/docs/animated.md b/docs/animated.md
@@ -247,7 +247,7 @@ Config is an object that may have the following options.
 
 Note that you can only define one of bounciness/speed, tension/friction, or stiffness/damping/mass, but not more than one:
 
-The friction/tension or bounciness/speed options match the spring model in [`Facebook Pop`](https://github.com/facebook/pop), [Rebound](https://github.com/facebookarchive/rebound), and [Origami](http://origami.design/).
+The friction/tension or bounciness/speed options match the spring model in [`Facebook Pop`](https://github.com/facebook/pop), [Rebound](https://github.com/facebookarchive/rebound), and [Origami](https://origami.design/).
 
 - `friction`: Controls "bounciness"/overshoot. Default 7.
 - `tension`: Controls speed. Default 40.

diff --git a/docs/asyncstorage.md b/docs/asyncstorage.md
@@ -9,7 +9,7 @@ title: '🚧 AsyncStorage'
 
 It is recommended that you use an abstraction on top of `AsyncStorage` instead of `AsyncStorage` directly for anything more than light usage since it operates globally.
 
-On iOS, `AsyncStorage` is backed by native code that stores small values in a serialized dictionary and larger values in separate files. On Android, `AsyncStorage` will use either [RocksDB](http://rocksdb.org/) or SQLite based on what is available.
+On iOS, `AsyncStorage` is backed by native code that stores small values in a serialized dictionary and larger values in separate files. On Android, `AsyncStorage` will use either [RocksDB](https://rocksdb.org/) or SQLite based on what is available.
 
 The `AsyncStorage` JavaScript code is a facade that provides a clear JavaScript API, real `Error` objects, and non-multi functions. Each method in the API returns a `Promise` object.
 

diff --git a/docs/communication-android.md b/docs/communication-android.md
@@ -34,8 +34,8 @@ public class MainActivity extends ReactActivity {
       protected Bundle getLaunchOptions() {
         Bundle initialProperties = new Bundle();
         ArrayList<String> imageList = new ArrayList<String>(Arrays.asList(
-                "http://foo.com/bar1.png",
-                "http://foo.com/bar2.png"
+                "https://dummyimage.com/600x400/ffffff/000000.png",
+                "https://dummyimage.com/600x400/000000/ffffff.png"
         ));
         initialProperties.putStringArrayList("images", imageList);
         return initialProperties;
@@ -54,7 +54,7 @@ class MainActivity : ReactActivity() {
     override fun createReactActivityDelegate(): ReactActivityDelegate {
         return object : ReactActivityDelegate(this, mainComponentName) {
             override fun getLaunchOptions(): Bundle {
-                val imageList = arrayListOf("http://foo.com/bar1.png", "http://foo.com/bar2.png")
+                val imageList = arrayListOf("https://dummyimage.com/600x400/ffffff/000000.png", "https://dummyimage.com/600x400/000000/ffffff.png")
                 val initialProperties = Bundle().apply { putStringArrayList("images", imageList) }
                 return initialProperties
             }
@@ -89,8 +89,8 @@ export default class ImageBrowserApp extends React.Component {
 ```java
 Bundle updatedProps = mReactRootView.getAppProperties();
 ArrayList<String> imageList = new ArrayList<String>(Arrays.asList(
-        "http://foo.com/bar3.png",
-        "http://foo.com/bar4.png"
+        "https://dummyimage.com/600x400/ff0000/000000.png",
+        "https://dummyimage.com/600x400/ffffff/ff0000.png"
 ));
 updatedProps.putStringArrayList("images", imageList);
 
@@ -103,7 +103,7 @@ mReactRootView.setAppProperties(updatedProps);
 
 ```kotlin
 var updatedProps: Bundle = reactRootView.getAppProperties()
-var imageList = arrayListOf("http://foo.com/bar3.png", "http://foo.com/bar4.png")
+var imageList = arrayListOf("https://dummyimage.com/600x400/ff0000/000000.png", "https://dummyimage.com/600x400/ffffff/ff0000.png")
 ```
 
 </TabItem>

diff --git a/docs/communication-ios.md b/docs/communication-ios.md
@@ -22,8 +22,8 @@ In order to embed a React Native view in a native component, we use `RCTRootView
 `RCTRootView` has an initializer that allows you to pass arbitrary properties down to the React Native app. The `initialProperties` parameter has to be an instance of `NSDictionary`. The dictionary is internally converted into a JSON object that the top-level JS component can reference.
 
 ```objectivec
-NSArray *imageList = @[@"http://foo.com/bar1.png",
-                       @"http://foo.com/bar2.png"];
+NSArray *imageList = @[@"https://dummyimage.com/600x400/ffffff/000000.png",
+                       @"https://dummyimage.com/600x400/000000/ffffff.png"];
 
 NSDictionary *props = @{@"images" : imageList};
 
@@ -49,8 +49,8 @@ export default class ImageBrowserApp extends React.Component {
 `RCTRootView` also provides a read-write property `appProperties`. After `appProperties` is set, the React Native app is re-rendered with new properties. The update is only performed when the new updated properties differ from the previous ones.
 
 ```objectivec
-NSArray *imageList = @[@"http://foo.com/bar3.png",
-                       @"http://foo.com/bar4.png"];
+NSArray *imageList = @[@"https://dummyimage.com/600x400/ff0000/000000.png",
+                       @"https://dummyimage.com/600x400/ffffff/ff0000.png"];
 
 rootView.appProperties = @{@"images" : imageList};
 ```