Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit baf8a73

Browse files
alyezzalyezz
authored
updates readme (Instabug#404)
1 parent 3ea1738 commit baf8a73

File tree

1 file changed

+119
-94
lines changed

1 file changed

+119
-94
lines changed

‎README.md

Lines changed: 119 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -20,130 +20,155 @@ Updating to a new version? Check the [Update Guide](#update-guide) before bumpin
2020

2121
1. In Terminal, navigate to your React Native directory and install the `instabug-reactnative` package:
2222

23-
```bash
24-
npm install instabug-reactnative
25-
```
26-
27-
Or if you prefer to use Yarn instead of npm:
23+
```bash
24+
npm install instabug-reactnative
25+
```
2826

29-
```bash
30-
yarn add instabug-reactnative
31-
```
27+
Or if you prefer to use Yarn instead of npm:
28+
29+
```bash
30+
yarn add instabug-reactnative
31+
```
3232

3333
2. For projects that build for iOS, install `xcodeproj` gem:
34+
35+
```bash
36+
gem install xcodeproj
37+
```
3438

35-
```bash
36-
gem install xcodeproj
37-
```
39+
3. If you are using React Native < 0.60 link the bridging files in the `instabug-reactnative` package:
3840

39-
3. Finally, link the bridging files in the `instabug-reactnative` package:
41+
```bash
42+
react-native link instabug-reactnative
43+
```
4044

45+
If you are on React Native > 0.60, then simply run the command:
4146

42-
```bash
43-
react-native link instabug-reactnative
44-
```
47+
```bash
48+
react-native add-instabug
49+
```
4550

4651
### Using CocoaPods (iOS only)
4752

4853
Alternatively, for iOS you can use [CocoaPods](https://cocoapods.org/) for managing dependencies.
4954

5055
1. In Terminal, navigate to your React Native directory and install the `instabug-reactnative` package:
5156

52-
```bash
53-
npm install instabug-reactnative
54-
```
57+
```bash
58+
npm install instabug-reactnative
59+
```
5560

5661
2. Add the following to your `Podfile`:
5762

58-
```ruby
59-
pod 'instabug-reactnative', :path => '../node_modules/instabug-reactnative'
60-
pod 'React', :path => '../node_modules/react-native', :subspecs => [
61-
'Core',
62-
'CxxBridge',
63-
'DevSupport'
64-
]
65-
66-
# Required React native dependencies
67-
pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga'
68-
pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
69-
pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/GLog.podspec'
70-
pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
71-
72-
# To make sure that archiving works correctly in Xcode, React has to be
73-
# removed from the Pods project as it's already included in the main project.
74-
post_install do |installer|
75-
installer.pods_project.targets.each do |target|
76-
if target.name == "React"
77-
target.remove_from_project
78-
end
79-
end
80-
end
81-
```
63+
```ruby
64+
pod 'instabug-reactnative', :path => '../node_modules/instabug-reactnative'
65+
pod 'React', :path => '../node_modules/react-native', :subspecs => [
66+
'Core',
67+
'CxxBridge',
68+
'DevSupport'
69+
]
70+
71+
# Required React native dependencies
72+
pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga'
73+
pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
74+
pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/GLog.podspec'
75+
pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
76+
77+
# To make sure that archiving works correctly in Xcode, React has to be
78+
# removed from the Pods project as it's already included in the main project.
79+
post_install do |installer|
80+
installer.pods_project.targets.each do |target|
81+
if target.name == "React"
82+
target.remove_from_project
83+
end
84+
end
85+
end
86+
```
8287
8388
3. Install `instabug-reactnative`:
8489
85-
```bash
86-
pod install
87-
```
90+
```bash
91+
pod install
92+
```
8893
8994
## Using Instabug
9095
1. To start using Instabug, import it into your `index.ios.js` and `index.android.js` file.
9196
92-
```javascript
93-
import Instabug from 'instabug-reactnative';
94-
```
97+
```javascript
98+
import Instabug from 'instabug-reactnative';
99+
```
95100
2. Then initialize it in the `constructor` or `componentWillMount`. This line will let the Instabug SDK work with the default behavior. The SDK will be invoked when the device is shaken. You can customize this behavior through the APIs (You can skip this step if you are building an Android app only).
96101
97-
```javascript
98-
Instabug.startWithToken('IOS_APP_TOKEN', [Instabug.invocationEvent.shake]);
99-
```
100-
3. Open `android/app/src/main/java/[...]/MainApplication.java`
101-
You should find the getPackages method looks like the following snippet. You just need to add your Android app token (You can skip this step if you are building an iOS app only). You can change the invocation event from here, simply by replacing the `"shake"` with any of the following `"button"`, `"none"`, `"screenshot"`, or `"swipe"`. You can change the primary color by replacing the `"#1D82DC"` with any colour of your choice.
102+
```javascript
103+
Instabug.startWithToken('IOS_APP_TOKEN', [Instabug.invocationEvent.shake]);
104+
```
105+
3. Open `android/app/src/main/java/[...]/MainApplication.java` (You can skip this step if you are building an iOS app only)
106+
* React Native < 0.60
107+
You should find the `getPackages()` method looks like the following snippet. You just need to add your Android app token. You can change the invocation event from here, simply by replacing the `"shake"` with any of the following `"button"`, `"none"`, `"screenshot"`, or `"swipe"`. You can change the primary color by replacing the `"#1D82DC"` with any colour of your choice.
102108
In the case that you are using the floating button as an invocation event, you can change the floating button edge and the floating button offset using the last two methods, by replacing `"left"` to `"right"`, and by changing the offset number.
103-
```javascript
104-
@Override
105-
protected List<ReactPackage> getPackages() {
106-
return Arrays.<ReactPackage>asList(
107-
new MainReactPackage(),
108-
new RNInstabugReactnativePackage.Builder("YOUR_APP_TOKEN", MainApplication.this)
109-
.setInvocationEvent("shake")
110-
.setPrimaryColor("#1D82DC")
111-
.setFloatingEdge("left")
112-
.setFloatingButtonOffsetFromTop(250)
113-
.build()
114-
}
115-
```
116-
You can find your app token by selecting the SDK tab from your [**Instabug dashboard**](https://dashboard.instabug.com/app/sdk/).
109+
110+
```javascript
111+
@Override
112+
protected List<ReactPackage> getPackages() {
113+
return Arrays.<ReactPackage>asList(
114+
new MainReactPackage(),
115+
new RNInstabugReactnativePackage.Builder("YOUR_APP_TOKEN", MainApplication.this)
116+
.setInvocationEvent("shake")
117+
.setPrimaryColor("#1D82DC")
118+
.setFloatingEdge("left")
119+
.setFloatingButtonOffsetFromTop(250)
120+
.build()
121+
}
122+
```
123+
* React Native > 0.60
124+
Add the above integration code to the `onCreate()` method instead:
125+
126+
```java
127+
@Override
128+
public void onCreate() {
129+
new RNInstabugReactnativePackage
130+
.Builder("APP_TOKEN", MainApplication.this)
131+
.setInvocationEvent("shake")
132+
.setPrimaryColor("#1D82DC")
133+
.setFloatingEdge("left")
134+
.setFloatingButtonOffsetFromTop(250)
135+
.build();
136+
super.onCreate();
137+
SoLoader.init(this, /* native exopackage */ false);
138+
}
139+
```
140+
141+
You can find your app token by selecting the SDK tab from your [**Instabug dashboard**](https://dashboard.instabug.com/app/sdk/).
117142
118143
4. Make sure the following snippet is added to your project level `build.gradle`. This should be added automatically upon linking. If not, you can add it manually.
119-
```dart
120-
allprojects {
121-
repositories {
122-
maven {
123-
url "https://sdks.instabug.com/nexus/repository/instabug-cp"
124-
}
125-
}
126-
}
127-
```
144+
```dart
145+
allprojects {
146+
repositories {
147+
maven {
148+
url "https://sdks.instabug.com/nexus/repository/instabug-cp"
149+
}
150+
}
151+
}
152+
```
128153
## Update Guide
129154
### Updating to versions 8.0-8.4.x
130155
131156
When updating to version 8.0 through 8.4.x, you'll need to perform the steps below.
132157
133158
1. Unlink Instabug
134-
```bash
135-
react-native unlink instabug-reactnative
136-
```
159+
```bash
160+
react-native unlink instabug-reactnative
161+
```
137162
138163
2. Install the new version of Instabug
139-
```bash
140-
npm install instabug-reactnative
141-
```
164+
```bash
165+
npm install instabug-reactnative
166+
```
142167
143168
3. Link Instabug
144-
```bash
145-
react-native link instabug-reactnative
146-
```
169+
```bash
170+
react-native link instabug-reactnative
171+
```
147172
148173
### Updating to version 8.5
149174
@@ -152,19 +177,19 @@ _Only for apps using React Native >= 0.60. If you're using a lower version, you
152177
Version 8.5 adds support for React Native 0.60. To use Instabug 8.5 with React Native 0.60, you'll need to perform the following steps.
153178
154179
1. Unlink Instabug
155-
```bash
156-
react-native unlink instabug-reactnative
157-
```
180+
```bash
181+
react-native unlink instabug-reactnative
182+
```
158183
159184
2. Install the new version of Instabug
160-
```bash
161-
npm install instabug-reactnative
162-
```
185+
```bash
186+
npm install instabug-reactnative
187+
```
163188
164189
3. Add Instabug to your project
165-
```bash
166-
react-native add-instabug
167-
```
190+
```bash
191+
react-native add-instabug
192+
```
168193
169194
## Microphone and Photo Library Usage Description (iOS Only)
170195

0 commit comments

Comments
 (0)