Merge pull request #33 from numandev1/docs/migration-config

docs: add migration guide for react-native-config

Author: numandev1

README.md

@@ -5,6 +5,7 @@
 ### Why should we use react-native-keys over react-native-config?
 
 We should use **react-native-keys** instead of **react-native-config** because **react-native-keys** gives guarantee of undecryptable **envs** whereas **react-native-config** **envs** can be decompile and hack
+#### See the [ Migration from react-native-config](docs/react-native-config-migration-guide.md)
 
 <div align="center">
     <img align="right" width="250" style="margin-right: 55px;" src="./media/key.png">
@@ -36,7 +37,7 @@ We can Manage **secure**(undecryptable) and **public** enviroment through **reac
 <a href="https://www.buymeacoffee.com/numan.dev" target="_blank"><img src="https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png" alt="Buy Me A Coffee" style="height: auto !important;width: auto !important;" ></a>
 </div>
 
-## See the [How we are protecting ENVs on the app side?](docs/workflow.md)
+#### See the [How we are protecting ENVs on the app side?](docs/workflow.md)
 
 ## Installation
 
@@ -58,7 +59,7 @@ Create a new file `keys.development.json` in the root of your React Native app a
     "APP_NAME": "Keys Example",
     "BUNDLE_ID": "com.example.rnkeys.dev",
     "ANDROID_CODE": "50",
-    "PACKGE_ID": "com.example.rnkeys.dev"
+    "PACKAGE_ID": "com.example.rnkeys.dev"
   }
 }
 ```

docs/react-native-config-migration-guide.md

@@ -0,0 +1,12 @@
+# Migration from react-native-config
+
+| react-native-config | react-native-keys |
+| ---- | ----- |
+| <code>.env.development</code><br/><br/> <pre>BASE_URL=https://www.example.com<br/>APP_NAME=Example<br/>GOOGLE_API=ABCDEF<br/>BRANCH_API=ABCDEF<br/>PACKAGE_ID=com.example.rnkeys.dev</pre> | <code>keys.development.json</code><br/><br/> <pre>{<br/>&nbsp;&nbsp;"secure": { <br/>&nbsp;&nbsp;&nbsp;&nbsp;"GOOGLE_API": "ABCD", <br/>&nbsp;&nbsp;&nbsp;&nbsp;"BRANCH_API": "ABCDEF" <br/>&nbsp;&nbsp;},<br/>&nbsp;&nbsp;"public": {<br/> &nbsp;&nbsp;&nbsp;"APP_NAME": "dev RNKEYS",<br/>&nbsp;&nbsp;&nbsp;&nbsp;"PACKAGE_ID": "com.example.rnkeys.dev"<br/>&nbsp;&nbsp;} <br/>}</pre>|
+| <b>Android:</b> apply a plugin to your app, from <code>android/app/build.gradle</code>:<br/><br/><code>apply from: project(':react-native-config').projectDir.getPath() + "/dotenv.gradle"</code> |   <b>Android:</b> apply a plugin to your app, from <code>android/app/build.gradle</code>:<br/></br><code>apply from: project(':react-native-keys').projectDir.getPath() + "/RNKeys.gradle"</code> |
+|<b>Android (build.gradle):</b></br><pre>project.ext.envConfigFiles = [</br> debug: ".env.development",</br> release: ".env.production",</br> anothercustombuild: ".env",</br>]</pre>|<b>Android (build.gradle):</b></br><pre>project.ext.keyFiles = [</br> debug: "keys.development.json",</br> release: "keys.staging.json", </br> release: "keys.json",</br>]</pre>|
+|<b>Android (.Java File):</b></br><pre>BuildConfig.GOOGLE_MAPS_API_KEY</br>BuildConfig.PACKAGE_ID</pre>|<b><b>Android (.Java File):</b></br><pre>import static com.reactnativekeysjsi.KeysModule.getSecureFor;</br></br>getSecureFor("GOOGLE_MAPS_API_KEY")</br></br>BuildConfig.PACKAGE_ID</pre>|
+| <b>Android:</b> You can also read them from your Gradle configuration:<br/><pre>defaultConfig {<br/>applicationId project.env.get("APP_ID")<br/>}</pre> |  <b>Android:</b> You can also read them from your Gradle configuration:<br/><pre>defaultConfig {<br/>applicationId project.keys.get("APP_ID")<br/>}</pre>    |
+| <pre>import Config from "react-native-config";</br></br>Config.GOOGLE_MAPS_API_KEY;</br>Config.PACKAGE_ID;</pre> |  <pre>import Keys from 'react-native-keys';</br></br>Keys.secureFor('GOOGLE_MAPS_API_KEY');</br>Keys.PACKAGE_ID;</pre>    |
+| <b>IOS</b></br><pre>#import "RNCConfig.h"</br></br>NSString *googleMapApiKey = [RNCConfig envFor:@"GOOGLE_MAPS_API_KEY"];</br>NSString *appName = [RNCConfig envFor:@"APP_NAME"];</pre> |  <b>IOS</b></br><pre>#import "Keys.h"</br></br>NSString *googleMapApiKey = [Keys secureFor:@"GOOGLE_MAPS_API_KEY"];</br>NSString *appName = [Keys publicFor:@"APP_NAME"];</pre>    |
+|<b>IOS</br></br><code>Go to Edit scheme... -> Build -> Pre-actions,</br> click + and select New Run Script Action</code></br><pre>"`$`{SRCROOT}/../node_modules/react-native-config/ios/ReactNativeConfig/BuildXCConfig.rb"</br>"`$`{SRCROOT}/.." "`$`{SRCROOT}/tmp.xcconfig"</pre>|<b>IOS</br></br><code>Go to Edit scheme... -> Build -> Pre-actions,</br> click + and select New Run Script Action</code></br><pre>export KEYSFILE=keys.development.json</br>"`$`{SRCROOT}/../node_modules/react-native-keys/keysIOS.js"</pre>|

example/keys.development.json

@@ -10,7 +10,7 @@
     "APP_NAME": "dev RNKEYS",
     "BUNDLE_ID": "com.example.rnkeys.dev",
     "ANDROID_CODE": "50",
-    "PACKGE_ID": "com.example.rnkeys.dev",
+    "PACKAGE_ID": "com.example.rnkeys.dev",
     "public1": "dev numan",
     "public2": "dev usman"
   }

example/keys.production.json

@@ -10,7 +10,7 @@
     "APP_NAME": "prod RNKEYS",
     "BUNDLE_ID": "com.example.rnkeys.prod",
     "ANDROID_CODE": "50",
-    "PACKGE_ID": "com.example.rnkeys.prod",
+    "PACKAGE_ID": "com.example.rnkeys.prod",
     "public1": "prod numan",
     "public2": "prod usman"
   }

example/keys.staging.json

@@ -10,7 +10,7 @@
     "APP_NAME": "staging RNKEYS",
     "BUNDLE_ID": "com.example.rnkeys.staging",
     "ANDROID_CODE": "50",
-    "PACKGE_ID": "com.example.rnkeys.staging",
+    "PACKAGE_ID": "com.example.rnkeys.staging",
     "public1": "staging numan",
     "public2": "staging usman"
   }