Skip to content

Commit 9b887a1

Browse files
authored
Fix typos/grammar in pure-cxx-modules.md (facebook#4310)
1 parent 5af9de3 commit 9b887a1

File tree

1 file changed

+13
-13
lines changed

1 file changed

+13
-13
lines changed

docs/the-new-architecture/pure-cxx-modules.md

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import constants from '@site/core/TabsConstants';
44

5-
Writing a module in C++ is the best way to share platform-agnostic code between Android and iOS. With pure C++ modules, you can write your logic only once and reuse it right away from all the platform, without the need of writing platform specific code.
5+
Writing a module in C++ is the best way to share platform-agnostic code between Android and iOS. With pure C++ modules, you can write your logic only once and reuse it right away from all the platforms, without the need of writing platform-specific code.
66

77
In this guide, we will go through the creation of a pure C++ Turbo Native Module:
88

@@ -20,9 +20,9 @@ npx @react-native-community/cli@latest init SampleApp --version 0.76.0
2020

2121
## 1. Create the JS specs
2222

23-
Pure C++ Turbo Native Modules are Turbo Native Modules. They needs a specification file (also called spec file) so that Codegen can create the scaffolding code for us. The specification file is also what we use to access the Turbo Native Module in JS.
23+
Pure C++ Turbo Native Modules are Turbo Native Modules. They need a specification file (also called spec file) so that Codegen can create the scaffolding code for us. The specification file is also what we use to access the Turbo Native Module in JS.
2424

25-
Specs files need to be written in a typed JS dialect. React Native currently supports Flow or TypeScript.
25+
Spec files need to be written in a typed JS dialect. React Native currently supports Flow or TypeScript.
2626

2727
1. Inside the root folder of your app, create a new folder called `specs`.
2828
2. Create a new file called `NativeSampleModule.ts` with the following code:
@@ -87,13 +87,13 @@ The next step is to configure [Codegen](what-is-codegen.md) in your `package.jso
8787
"dependencies": {
8888
```
8989

90-
This configuration tells Codegen to look for specs files in the `specs` folder. It also instruct Codegen to only generate code for `modules` and to namespace the generated code as `AppSpecs`.
90+
This configuration tells Codegen to look for spec files in the `specs` folder. It also instructs Codegen to only generate code for `modules` and to namespace the generated code as `AppSpecs`.
9191

9292
## 3. Write the Native Code
9393

94-
Writing a C++ Turbo Native Module allow you to share the code between Android an iOS. Therefore we will be writing the code once, and we will look into what changes we need to apply to the platforms so that the C++ code can be picked up.
94+
Writing a C++ Turbo Native Module allows you to share the code between Android an iOS. Therefore we will be writing the code once, and we will look into what changes we need to apply to the platforms so that the C++ code can be picked up.
9595

96-
1. Create a folder named `shared` at the same level of the `android` and `ios` folders.
96+
1. Create a folder named `shared` at the same level as the `android` and `ios` folders.
9797
2. Inside the `shared` folder, create a new file called `NativeSampleModule.h`.
9898

9999
```cpp title="shared/NativeSampleModule.h"
@@ -141,7 +141,7 @@ Let's have a look at the two files we created:
141141
- The class `NativeSampleModule` is the actual Turbo Native Module class and it extends the `NativeSampleModuleCxxSpec` class which contains some glue code and boilerplate code to let this class behave as a Turbo Native Module.
142142
- Finally, we have the constructor, that accepts a pointer to the `CallInvoker`, to communicate with JS if needed and the function's prototype we have to implement.
143143
144-
The `NativeSampleModule.cpp` files is the actual implementation of our Turbo Native Module and implements the constructor and the method that we declared in the specs.
144+
The `NativeSampleModule.cpp` file is the actual implementation of our Turbo Native Module and implements the constructor and the method that we declared in the specs.
145145
146146
## 4. Register the Module in the platform
147147
@@ -159,7 +159,7 @@ To make sure that the Android app can effectively build the C++ Turbo Native Mod
159159
160160
#### 1. Create the `CMakeLists.txt` file
161161
162-
Android uses CMake to build. CMake needs to access the files we defined in our shared folder, to be able to build them.
162+
Android uses CMake to build. CMake needs to access the files we defined in our shared folder to be able to build them.
163163
164164
1. Create a new folder `SampleApp/android/app/src/main/jni`. The `jni` folder is where the C++ side of Android lives.
165165
2. Create a `CMakeLists.txt` file and add this context:
@@ -228,7 +228,7 @@ The final step is to register the new C++ Turbo Native Module in the runtime, so
228228
curl -O https://raw.githubusercontent.com/facebook/react-native/v0.76.0/packages/react-native/ReactAndroid/cmake-utils/default-app-setup/OnLoad.cpp
229229
```
230230

231-
2. Then, modify this file as it follows:
231+
2. Then, modify this file as follows:
232232

233233
```diff title="android/app/src/main/jni/OnLoad.cpp"
234234
#include <DefaultComponentsRegistry.h>
@@ -295,7 +295,7 @@ bundle exec pod install
295295

296296
#### 2. Add the shared folder to the iOS project
297297

298-
This steps adds the `shared` folder to the project to make it visible to xcode.
298+
This step adds the `shared` folder to the project to make it visible to Xcode.
299299

300300
1. Open the CocoPods generated Xcode Workspace.
301301

@@ -347,7 +347,7 @@ In Xcode, open the `AppDelegate.mm` file and modify it as follows:
347347

348348
These changes are doing a few things:
349349

350-
1. Importing the `RCTAppDelegate+Protected` header to make visible to the AppDelegate that it is conforming to the `RCTTurboModuleManagerDelegate` protocol.
350+
1. Importing the `RCTAppDelegate+Protected` header to make it visible to the AppDelegate that it is conforming to the `RCTTurboModuleManagerDelegate` protocol.
351351
2. Importing the Pure C++ Native Turbo Module interface `NativeSampleModule.h`
352352
3. Overriding the `getTurboModule` method for C++ modules so that when the JS side asks for a module called `NativeSampleModule`, the app knows which module has to be returned.
353353

@@ -431,10 +431,10 @@ The interesting lines in this app are:
431431
:::warning
432432
For the sake of this example and to keep it as short as possible, we directly imported the spec file in our app.
433433
The best practice in this case is to create a separate file to wrap the specs and use that file into your application.
434-
This allow you to prepare the input for the specs and gives you more control over then in JS.
434+
This allows you to prepare the input for the specs and gives you more control over them in JS.
435435
:::
436436

437-
Congratulation, you wrote your first C++ Turbo Native Module!
437+
Congratulations, you wrote your first C++ Turbo Native Module!
438438

439439
| <center>Android</center> | <center>iOS</center> |
440440
| ---------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------- |

0 commit comments

Comments
 (0)