{"_id":"56327cdb38f8aa0d00d30f6e","githubsync":"","hidden":false,"category":"561ae15563ef571900ca68d7","excerpt":"Adding AppHub to your React Native iOS app.","link_external":false,"link_url":"","order":0,"slug":"quickstart-guide","sync_unique":"","__v":33,"createdAt":"2015-10-29T20:08:59.444Z","user":"561b45c2ab412a0d004d85d6","title":"Quickstart Guide (iOS)","type":"basic","isReference":false,"project":"561ae15363ef571900ca68d3","updates":[],"version":"561ae15463ef571900ca68d6","api":{"settings":"","url":"","auth":"required","params":[],"results":{"codes":[]}},"body":"# Step 1: Install the SDK.\nNavigate to the root of your React Native project and run:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"npm install --save apphub\",\n      \"language\": \"shell\"\n    }\n  ]\n}\n[/block]\n# Step 2: Add the SDK to your React Native app.\n\nNavigate to `node_modules/apphub/AppHub` and drag AppHub.xcodeproj into your Xcode project.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/83dkwW8hRAtEYSTA5nw6_Screenshot%202015-12-11%2014.58.01.png\",\n        \"Screenshot 2015-12-11 14.58.01.png\",\n        \"1159\",\n        \"454\",\n        \"#395e8d\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n# Step 3: Edit the Build Settings.\n\nUnder the \"Build Settings\" tab of your project configuration, find the \"Header Search Paths\" section and edit the value. Add a new value, `$(SRCROOT)/../node_modules/apphub/AppHub` and select \"recursive\" in the dropdown.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/B9sE5JfoQ32nDE33r4LF_Screenshot%202015-12-11%2015.03.17.png\",\n        \"Screenshot 2015-12-11 15.03.17.png\",\n        \"933\",\n        \"327\",\n        \"#2a4c83\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n# Step 4: Add Dependencies.\n\nClick on Targets → <Your app name> → and then the \"Build Phases\" tab. Expand \"Link Binary With Libraries\" as shown.\n\nAdd `libAppHub.a`, `SystemConfiguration.framework` and `libz.tbd` in the \"Link Binary With Libraries\" build phase by clicking the + button.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/FTwUOL5zQQW9OzFeX5lO_Screenshot%202015-12-11%2015.06.19.png\",\n        \"Screenshot 2015-12-11 15.06.19.png\",\n        \"879\",\n        \"506\",\n        \"#914223\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n# Step 5: Connect Your App to AppHub. \n\nImport AppHub at the beginning of AppDelegate.m (in Swift, add this line to your bridging header)\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"#import \\\"AppHub.h\\\"\",\n      \"language\": \"objectivec\"\n    }\n  ]\n}\n[/block]\nThen, add this line to the beginning of your ```application:didFinishLaunchingWithOptions:``` method in the ```AppDelegate.m``` file:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"[AppHub setApplicationID::::at:::\\\"YOUR_APPLICATION_ID\\\"];\",\n      \"language\": \"objectivec\"\n    },\n    {\n      \"code\": \"AppHub.setApplicationID(\\\"YOUR_APPLICATION_ID\\\")\",\n      \"language\": \"swift\"\n    }\n  ]\n}\n[/block]\nAdd the following before creating an ```RCTRootView``` (most likely in ```AppDelegate.m```). Leave this code commented while you are developing your app. Uncomment it when you are ready to distribute to test users and deploy to the App Store.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"/**\\n * OPTION 3 - AppHub\\n *\\n * Load cached code and images from AppHub.\\n *\\n */\\n\\nAHBuild *build = [[AppHub buildManager] currentBuild];\\njsCodeLocation = [build.bundle URLForResource:@\\\"main\\\"\\n                                withExtension:@\\\"jsbundle\\\"];\",\n      \"language\": \"objectivec\"\n    },\n    {\n      \"code\": \"/**\\n * OPTION 3 - AppHub\\n *\\n * Load cached code and images from AppHub.\\n *\\n */\\n\\nlet build = AppHub.buildManager().currentBuild\\njsCodeLocation = build.bundle.URLForResource(\\\"main\\\", withExtension: \\\"jsbundle\\\")\\n\",\n      \"language\": \"swift\"\n    }\n  ]\n}\n[/block]\n# Step 6: Compile and Run Your App. \n\nYou are now ready to start pushing builds with AppHub!\n\n# Want to learn more?\n\nCheck out the [iOS docs](https://apphub.io/api/ios/), or explore the other docs in the sidebar to learn more.","childrenPages":[]}

Quickstart Guide (iOS)

Adding AppHub to your React Native iOS app.

# Step 1: Install the SDK. Navigate to the root of your React Native project and run: [block:code] { "codes": [ { "code": "npm install --save apphub", "language": "shell" } ] } [/block] # Step 2: Add the SDK to your React Native app. Navigate to `node_modules/apphub/AppHub` and drag AppHub.xcodeproj into your Xcode project. [block:image] { "images": [ { "image": [ "https://files.readme.io/83dkwW8hRAtEYSTA5nw6_Screenshot%202015-12-11%2014.58.01.png", "Screenshot 2015-12-11 14.58.01.png", "1159", "454", "#395e8d", "" ] } ] } [/block] # Step 3: Edit the Build Settings. Under the "Build Settings" tab of your project configuration, find the "Header Search Paths" section and edit the value. Add a new value, `$(SRCROOT)/../node_modules/apphub/AppHub` and select "recursive" in the dropdown. [block:image] { "images": [ { "image": [ "https://files.readme.io/B9sE5JfoQ32nDE33r4LF_Screenshot%202015-12-11%2015.03.17.png", "Screenshot 2015-12-11 15.03.17.png", "933", "327", "#2a4c83", "" ] } ] } [/block] # Step 4: Add Dependencies. Click on Targets → <Your app name> → and then the "Build Phases" tab. Expand "Link Binary With Libraries" as shown. Add `libAppHub.a`, `SystemConfiguration.framework` and `libz.tbd` in the "Link Binary With Libraries" build phase by clicking the + button. [block:image] { "images": [ { "image": [ "https://files.readme.io/FTwUOL5zQQW9OzFeX5lO_Screenshot%202015-12-11%2015.06.19.png", "Screenshot 2015-12-11 15.06.19.png", "879", "506", "#914223", "" ] } ] } [/block] # Step 5: Connect Your App to AppHub. Import AppHub at the beginning of AppDelegate.m (in Swift, add this line to your bridging header) [block:code] { "codes": [ { "code": "#import \"AppHub.h\"", "language": "objectivec" } ] } [/block] Then, add this line to the beginning of your ```application:didFinishLaunchingWithOptions:``` method in the ```AppDelegate.m``` file: [block:code] { "codes": [ { "code": "[AppHub setApplicationID:@\"YOUR_APPLICATION_ID\"];", "language": "objectivec" }, { "code": "AppHub.setApplicationID(\"YOUR_APPLICATION_ID\")", "language": "swift" } ] } [/block] Add the following before creating an ```RCTRootView``` (most likely in ```AppDelegate.m```). Leave this code commented while you are developing your app. Uncomment it when you are ready to distribute to test users and deploy to the App Store. [block:code] { "codes": [ { "code": "/**\n * OPTION 3 - AppHub\n *\n * Load cached code and images from AppHub.\n *\n */\n\nAHBuild *build = [[AppHub buildManager] currentBuild];\njsCodeLocation = [build.bundle URLForResource:@\"main\"\n withExtension:@\"jsbundle\"];", "language": "objectivec" }, { "code": "/**\n * OPTION 3 - AppHub\n *\n * Load cached code and images from AppHub.\n *\n */\n\nlet build = AppHub.buildManager().currentBuild\njsCodeLocation = build.bundle.URLForResource(\"main\", withExtension: \"jsbundle\")\n", "language": "swift" } ] } [/block] # Step 6: Compile and Run Your App. You are now ready to start pushing builds with AppHub! # Want to learn more? Check out the [iOS docs](https://apphub.io/api/ios/), or explore the other docs in the sidebar to learn more.