Skip to content

Commit 0db472f

Browse files
author
Christopher J. Brody
committed
Add example app instructions & other doc fixes
1 parent 0e763fe commit 0db472f

1 file changed

Lines changed: 116 additions & 11 deletions

File tree

README.md

Lines changed: 116 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,14 @@
11
# create-react-native-module
22

3-
Tool to create a React Native library module, optionally as an extremely simple view component, with a single command (based on [`react-native-create-library`](https://www.npmjs.com/package/react-native-create-library))
3+
Tool to create a React Native library module or native view component, with a single command.
44

5-
<!-- GONE:
6-
![](https://github.com/frostney/react-native-create-library/blob/master/docs/usage.gif)
7-
-->
5+
See below for command-line usage, example with no view, and example with an extremely simple native view.
86

9-
TODO: QUICK USAGE SECTION HERE
7+
This tool based on [`react-native-create-library`](https://www.npmjs.com/package/react-native-create-library), with working example callbacks, optional native view, and some other updates added by [@brodybits (Christoper J. Brody aka Chris Brody)](https://github.com/brodybits).
8+
9+
<!-- FUTURE TODO: QUICK USAGE SECTION HERE -->
10+
11+
**LICENSE:** MIT
1012

1113
### Why might you need this?
1214

@@ -23,6 +25,18 @@ Why not use `react-native new-library`? Unfortunately that command doesn't creat
2325
## Installation
2426

2527
Requirements: Node 6.0+
28+
29+
Packages required to be installed globally if the recommended example app is generated:
30+
31+
- [`react-native-cli`](https://www.npmjs.com/package/react-native-cli)
32+
- [`yarn`](https://www.npmjs.com/package/yarn)
33+
34+
```
35+
$ npm install -g react-native-cli yarn
36+
```
37+
38+
To install this package:
39+
2640
```
2741
$ npm install -g create-react-native-module
2842
```
@@ -92,20 +106,111 @@ createLibrary({
92106

93107
## SOME KNOWN ISSUES
94108

95-
- CLI does not output the correct path of the generated library module
109+
- CLI does not show the correct path of the generated library module
96110
- outdated dependencies
97111
- not all documented options work as documented
98112
- not all options are documented
113+
- this project has some lint errors
99114

100-
## Behavior not tested
115+
## Behavior not tested or supported
101116

102117
- Windows platform support
103118

119+
## Examples
120+
121+
### Example module with no view
122+
123+
__Create the module with no view:__
124+
125+
```
126+
create-react-native-module --prefix CB --package-identifier io.mylibrary --generate-example AliceHelper
127+
```
128+
129+
The module would be generated in the `react-native-alice-helper` subdirectory, and the example test app would be in `react-native-alice-helper/example`. (Note that this tool will show an incorrect project name when it is finished.)
130+
131+
Then go into the example app subdirectory:
132+
133+
```
134+
cd react-native-alice-helper/example
135+
```
136+
137+
#### Running the example app
138+
139+
__Within the example test app subdirectory:__
140+
141+
It is *recommended* to start the Metro Bundler manually (within `react-native-alice-helper/example`), which would run in the foreground:
142+
143+
```
144+
npm start
145+
```
146+
147+
Otherwise, React Native will open its own window to run the Metro Bundler.
148+
149+
To run on Android, do the following command (within `react-native-alice-helper/example`):
150+
151+
```
152+
react-native run-android
153+
```
154+
155+
This assumes that the `ANDROID_HOME` environmental variable is set properly. Here is a sample command that does not make such an assumption on a mac:
156+
157+
```
158+
ANDROID_HOME=~/Library/Android/sdk react-native run-android
159+
```
160+
161+
To run on iOS:
162+
163+
```
164+
react-native run-ios
165+
```
166+
167+
or do the following command to open the iOS project in Xcode:
168+
169+
```
170+
open ios/example.xcodeproj
171+
```
172+
173+
__Expected result:__
174+
175+
The example app shows the following indications:
176+
177+
- STATUS: native callback received
178+
- NATIVE CALLBACK MESSAGE with the number argument and string argument values that are received by the native module
179+
180+
### Example view module
181+
182+
__Create the module with an extremely simple view:__
183+
184+
```
185+
create-react-native-module --prefix CB --package-identifier io.mylibrary --view --generate-example CarolWidget
186+
```
187+
188+
The module would be generated in the `react-native-alice-helper` subdirectory, and the example test app would be in `react-native-alice-helper/example`. (Note that this tool will show an incorrect project name when it is finished.)
189+
190+
Then go into the example app subdirectory:
191+
192+
```
193+
cd react-native-carol-widget/example
194+
```
195+
196+
__Within the example test app subdirectory:__
197+
198+
It is *recommended* to start the Metro Bundler manually as described above (within `react-native-carol-widget/example`):
199+
200+
```
201+
npm start
202+
```
203+
204+
To run on Android, do `react-native run-android` as described for the other example above.
205+
206+
To run on iOS, do `react-native run-ios` or `open ios/example.xcodeproj` as described for the other example above.
207+
208+
__Expected result:__
209+
210+
- on Android: a check box that is checked (and cannot be changed)
211+
- on iOS: a label with 5 red asterisks
212+
104213
## Acknowledgements
105214

106215
- [`react-native-create-library`](https://www.npmjs.com/package/react-native-create-library) - original basis of this project
107216
- [`react-native-share`](https://www.npmjs.com/package/react-native-share) - was acknowledged as "a great source of inspiration" for [`react-native-create-library`](https://www.npmjs.com/package/react-native-create-library)
108-
109-
## License
110-
111-
MIT

0 commit comments

Comments
 (0)