The New Architecture section editorial review (facebook#3288)

* [Do Not Merge] Refactoring The New Architecture (facebook#3029) * [Guide - The New Architecture] What Backward Compatibility Is (facebook#3038) * Guide to creating a New Architecture app from template (facebook#3056) * Start new template guide This is a first iteration. I want to get feedback on a few aspects, so starting from here as a baseline. * Update title * Use tabs for target OS Set up matching the style of "Getting Started", except I kept the headers inside the tabs for now as it makes for a useful right-hand TOC. * Capitalize New Architecture, simplify * Preliminary section for Hermes Add section for recommending enabling Hermes. Not sure of contents yet, and still have to test. * Reword to emphasize importance of Hermes usage * Show new arch in use * Add build speed article link * Add pro tip for pod install alias * Restructure, repeat less Favor linking to original setup guide instead of repeating content. * Note about Expo * Include command on uninstalling global CLI * How to learn more * Remove headers in tabs They don't work correctly with the righthand TOC. * Make header more clear * Use quote block less often There was way too much yellow. * Opt for instructions using XCode Because `xcodebuild clean` already failed me once when XCode GUI clean worked. * Fix lint issue * Improve wording * Use product name * Fix line wraps * Reword based on feedback * Note use of bundle install * Pod removal instructions Also standardize on using yarn scripts from template for commands, it's a little confusing to see the mix of `npx` and `yarn` once we start referring to `yarn pod-install` * Convert quotes to admonitions * Convert Note: to admonitions * Feedback: Change admonitions to caution * PR feedback * New Architecture landing page (facebook#3072) * First draft of landing page * Add migration and backwards compatibility links * lint fix * Restructure slightly, leaning more on context from Why a New Architecture * Don't need md in links * Suggested rewording * Rephrase pillar summaries * [Guide - The New Architecture] Why A New Architecture (facebook#3043) * [Guide - The New Architecture] Pillars (facebook#3046) * [Guide - The New Architecture] TurboModules as Native Modules (facebook#3039) * [Guide - The New Architecture] Fabric Components as Native Components (facebook#3040) * [FEAT][TNA] Fabric Component Guide (facebook#3132) * [Feat] Add intro for Fabric Components * feat: add guide to create a Fabric Component * Add page on codegen (facebook#3155) * [FEAT] TurboModules guide (facebook#3168) * [Feat] Add intro for Fabric Components * feat: add guide to create a Fabric Component * Beginning of guide/folder structure * WIP JS Spec * specification section * Configuration * native code intro * Must be named Spec * Best stab at iOS native code, but I don't know how to describe what's going on in the code very well. Extrapolated what I could. * Android instructions iOS isn't working for me. Builds, but can't load module. Writing up Android auto-linking next because the steps I tested did work. * Include linking instructions from RNNArch repo * Add example JavaScript * native modules link * Address quick feedback items * Remove, fix for rebased branch * fix TM parameter on Android * Revert to 'Codegen' casing * Revert folly version change 2021.07.22 is for current version on main * fix typo * getTurboModule explainer * Sentence edits - Fix acronym bolding - Change wording to "recommended" because "standard" has other connotations of possibly being required - Parentheses unnecessary, distracting * Remove TODO for now Getting inconsistent results here, not sure if this is wrong or not; removing TODO for now so it doesn't block anything * ABI rephrase, more in line with new Fabric guide wording * Explain shared C++ code more * feat: add guide to create a Fabric Component * feat: add guide to create a Fabric Component * package.json description * Lint fixes * fix: Move JS constants to reduce changes * fix: Remove newline * feat: add required step for Android Codegen * fix: use the proper links Co-authored-by: Riccardo Cipolleschi <cipolleschi@fb.com> * wip: migration guide review (facebook#3200) * Fix for some typos and other editorial related changes * Update docs/the-new-architecture/pillars-fabric-components.md correcting the article Co-authored-by: Riccardo <riccardo.cipolleschi@gmail.com> * Update pillars-fabric-components.md Co-authored-by: Riccardo <cipolleschi@fb.com> Co-authored-by: Lizzi Lindboe <lindboe@users.noreply.github.com> Co-authored-by: Riccardo <riccardo.cipolleschi@gmail.com>
reactnativecn · Sep 8, 2022 · 7c1091c · 7c1091c
1 parent 9e6e311
commit 7c1091c
Show file tree

Hide file tree

Showing 13 changed files with 158 additions and 158 deletions.
diff --git a/docs/new-architecture-app-intro.md b/docs/new-architecture-app-intro.md
@@ -9,11 +9,11 @@ import NewArchitectureWarning from './\_markdown-new-architecture-warning.mdx';
 
 There are a few prerequisites that should be addressed before the New Architecture is enabled in your application.
 
-## Use a React Native >= 0.68 release
+## Use a React Native >= 0.68 Release
 
 React Native released the support for the New Architecture with the release `0.68.0`.
 
-This guide is written with the expectation that you’re using the latest React Native release. At the moment of writing, this is `0.70.0`. Other than this guide, you can leverage the [upgrade helper](https://react-native-community.github.io/upgrade-helper/) to determine what other changes may be required for your project.
+This guide is written with the expectation that you’re using the latest React Native release. At the moment of writing, this is `0.70.0`. Besides this guide, you can leverage the [upgrade helper](https://react-native-community.github.io/upgrade-helper/) to determine what other changes may be required for your project.
 
 To update to the most recent version of React Native, you can run this command:
 
@@ -27,7 +27,7 @@ Starting from React Native `0.69.0`, you may also need to update the version of
 yarn add react@18.0.0
 ```
 
-### Android specifics
+### Android Specifics
 
 Using the New Architecture on Android has some prerequisites that you need to meet:
 
@@ -139,9 +139,9 @@ task copyDownloadableDepsToLibs(type: Copy) {
 + }
 ```
 
-Finally, it’s time to update your project to use the `react-native` dependency from source, rather than using a precompiled artifact from the NPM package. This is needed as the later setup will rely on building the native code from source.
+Finally, it’s time to update your project to use the `react-native` dependency from the source rather than using a precompiled artifact from the NPM package. This is needed as the later setup will rely on building the native code from the source.
 
-Let’s edit your **module-level** `build.gradle` (the one inside `app/` folder) and change the following line:
+Let’s edit your **module-level** `build.gradle` (the one inside the `app/` folder) and change the following line:
 
 ```diff
 dependencies {
@@ -151,15 +151,15 @@ dependencies {
 
 ## Use Hermes
 
-Hermes is an open-source JavaScript engine optimized for React Native. Hermes is enabled by default and you have to explicitly disable it if you want to use JSC.
+Hermes is an open-source JavaScript engine optimized for React Native. Hermes is enabled by default, and you have to explicitly disable it if you want to use JSC.
 
 We highly recommend using Hermes in your application. With Hermes enabled, you will be able to use the JavaScript debugger in Flipper to directly debug your JavaScript code.
 
 Please [follow the instructions on the React Native website](hermes) to learn how to enable/disable Hermes.
 
 :::caution
 
-**iOS:** If you opt out of using Hermes, you will need to replace `HermesExecutorFactory` with `JSCExecutorFactory` in any examples used throughout the rest of this guide.
+**iOS:** If you opt-out of using Hermes, you will need to replace `HermesExecutorFactory` with `JSCExecutorFactory` in any examples used throughout the rest of this guide.
 
 :::
 
@@ -201,7 +201,7 @@ cd android
 ./gradlew clean
 ```
 
-## iOS: Make the project build
+## iOS: Build the Project
 
 After upgrading the project, there are a few changes you need to apply:
 
@@ -228,7 +228,7 @@ echo 'export NODE_BINARY=$(command -v node)' > .xcode.env
 ```
 
 If you need it, you can also open the file and replace the `$(command -v node)` with the path to the node executable.
-React Native supports also a local version of this file `.xcode.env.local`. This file is not synced with the repository to let you customize your local setup, if it differs from the Continuous Integration or the team one.
+React Native also supports a local version of this file `.xcode.env.local`. This file is not synced with the repository to let you customize your local setup, if it differs from the Continuous Integration or the team one.
 
 ## iOS: Use Objective-C++ (`.mm` extension)
 
@@ -261,7 +261,7 @@ Then, declare your app delegate as a `RCTCxxBridgeDelegate` provider:
 @end
 ```
 
-To conform to the `RCTCxxBridgeDelegate` protocol, you will need to implement the `jsExecutorFactoryForBridge:` method. Typically, this is where you would return a `JSCExecutorFactory` or `HermesExecutorFactory`, and we will use it to install our TurboModules bindings later on.
+To conform to the `RCTCxxBridgeDelegate` protocol, you must implement the `jsExecutorFactoryForBridge:` method. Typically, this is where you would return a `JSCExecutorFactory` or `HermesExecutorFactory`, and we will use it to install our TurboModules bindings later on.
 
 You can implement the `jsExecutorFactoryForBridge:` method like this:
 

diff --git a/docs/new-architecture-library-android.md b/docs/new-architecture-library-android.md
@@ -7,11 +7,11 @@ import NewArchitectureWarning from './\_markdown-new-architecture-warning.mdx';
 
 <NewArchitectureWarning/>
 
-Once you have defined the JavaScript specs for your native modules as part of the [prerequisites](new-architecture-library-intro), setup the configuration of the Codegen, and followed the Android/Gradle setup, you are now ready to migrate your library to the new architecture. Here are the steps you can follow to accomplish this.
+Once you have defined the JavaScript specs for your native modules as part of the [prerequisites](new-architecture-library-intro), set up the configuration of the Codegen, and follow the Android/Gradle setup, you are now ready to migrate your library to the new architecture. Here are the steps you can follow to accomplish this.
 
-## 1. Extend or implement the code-generated native interfaces
+## 1. Extend or Implement the Code-generated Native Interfaces
 
-The JavaScript spec for your native module or component will be used to generate native interface code for each supported platform (i.e. Android and iOS). These native interface files will be generated **when a React Native application that depends on your library is built**.
+The JavaScript spec for your native module or component will be used to generate native interface code for each supported platform (i.e., Android and iOS). These native interface files will be generated **when a React Native application that depends on your library is built**.
 
 While this generated native interface code **will not ship as part of your library**, you do need to make sure your Java/Kotlin code conforms to the protocols provided by these native interface files.
 
@@ -23,7 +23,7 @@ You can invoke the `generateCodegenArtifactsFromSchema` Gradle task to generate
 
 The files that are output can be found inside `build/generated/source/codegen` and **should not be committed**, but you’ll need to refer to them to determine what changes you need to make to your native modules in order for them to provide an implementation for each generated interface.
 
-The output of the codegen for a module called `NativeAwesomeManager` will look like this:
+The output of the Codegen for a module called `NativeAwesomeManager` will look like this:
 
 ```
 app/build/generated/source/codegen
@@ -51,9 +51,9 @@ app/build/generated/source/codegen
 └── schema.json
 ```
 
-### Extends the abstract class provided by the codegen
+### Extends the Abstract Class Provided by the Codegen
 
-Update your native module or component to ensure it **extends the abstract class** that has been code-generated from your JavaScript specs (i.e. the `NativeAwesomeManagerSpec.java` file from the previous example).
+Update your native module or component to ensure it **extends the abstract class** that has been code-generated from your JavaScript specs (i.e., the `NativeAwesomeManagerSpec.java` file from the previous example).
 
 Following the example set forth in the previous section, your library might import `NativeAwesomeManagerSpec`, implement the relevant native interface and the necessary methods for it:
 
@@ -115,4 +115,4 @@ class NativeAwesomeManager(reactContext: ReactApplicationContext) :
 </TabItem>
 </Tabs>
 
-Please note that the **generated abstract class** that you’re now extending (`MyAwesomeSpec` in this example), is itself extending `ReactContextBaseJavaModule`. Therefore you should not use access to any of the method/fields you were previously using (e.g. the `ReactApplicationContext` and so on). Moreover the generated class will now also implement the `TurboModule` interface for you.
+Please note that the **generated abstract class** that you’re now extending (`MyAwesomeSpec` in this example) is itself extending `ReactContextBaseJavaModule`. Therefore you should not use access to any of the method/fields you were previously using (e.g., the `ReactApplicationContext` and so on). Moreover, the generated class will now also implement the `TurboModule` interface for you.