- 
      
 - 
        
Save tendant/6a1ea9e363f5ca4d73a1 to your computer and use it in GitHub Desktop.  
Revisions
- 
        
tendant revised this gist
Jan 1, 2016 . 1 changed file with 2 additions and 2 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -7,8 +7,8 @@ 3. Under project **General** settings, add *ReactKit* to **Linked Framework and Libraries** + *+* > *Add Other...* and choose */node_modules/react-native/React/React.xcodeproj* 4. Now *React* would have been imported. Link it by choosing it from the list. + *+* > **libReact.a** 5. Add and link other libraries from */node_modules/react-native/Libraries* as needed. 4. Under project **Build Settings**, + **Linking** > **Other Linker Flags** : Add `-all_load` + **Search Paths** > **Header Search Paths**:  - 
        
tendant revised this gist
Jan 1, 2016 . 1 changed file with 5 additions and 3 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -3,10 +3,12 @@ 1. Create a project in XCode with the default settings + *iOS* > *Application* > **Single View Application** + Language: *Swift* 2. Create package.json file in project directory, add dependecy "react-native": "^0.17.0", run "npm install" 3. Under project **General** settings, add *ReactKit* to **Linked Framework and Libraries** + *+* > *Add Other...* and choose */node_modules/react-native/React/React.xcodeproj* 4. Now *React* would have been imported. Link it by choosing it from the list. + *+* > **lib.ReactKit.a** 5. Add other libraries from */node_modules/react-native/Libraries* as needed. 4. Under project **Build Settings**, + **Linking** > **Other Linker Flags** : Add `-all_load` + **Search Paths** > **Header Search Paths**:  - 
        
boopathi revised this gist
Mar 1, 2015 . 1 changed file with 1 addition and 1 deletion.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -1,6 +1,6 @@ ## Settings 1. Create a project in XCode with the default settings + *iOS* > *Application* > **Single View Application** + Language: *Swift* 2. Under project **General** settings, add *ReactKit* to **Linked Framework and Libraries**  - 
        
boopathi revised this gist
Mar 1, 2015 . 1 changed file with 1 addition and 2 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -62,8 +62,7 @@ override func prefersStatusBarHidden() -> Bool { This file imports react-native(Obj-C) classes to be used in your swift application. Create a header file named `ProjectName-Bridging-Header.h` (in the same directory as *AppDelegate.swift*) and paste the contents generated by the following script ```sh find /path/to/react-native/ReactKit -name "*.h" | awk -F'/' '{print "#import \""$NF"\""}' ``` ### `<AppFileName>.js`  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 1 addition and 1 deletion.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -26,7 +26,7 @@ Use this as the function body for `didFinishLaunchingWithOptions` replacing 1. `<AppFileName>.js` - Your JS entry point where you'll register the Application. 2. `<AppName>` - The name you use in `<AppFileName>` in `AppRegistry.registerComponent` to register the application. ```swift  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 1 addition and 1 deletion.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -59,7 +59,7 @@ override func prefersStatusBarHidden() -> Bool { ### `ProjectName-Briding-Header.h` This file imports react-native(Obj-C) classes to be used in your swift application. Create a header file named `ProjectName-Bridging-Header.h` (in the same directory as *AppDelegate.swift*) and paste the contents generated by the following script ```sh cd /path/to/react-native/ReactKit  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 2 additions and 2 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -62,7 +62,7 @@ override func prefersStatusBarHidden() -> Bool { This file imports react-native(Obj-C) classes to be used in your swift application. Create a header file named `ProjectName-Bridging-Header.h` and paste the contents generated by the following script ```sh cd /path/to/react-native/ReactKit find ./ -name "*.h" | awk -F'/' '{print "#import \""$4"\""}' ``` @@ -86,7 +86,7 @@ React.AppRegistry.registerComponent('<AppName>', () => App); ### Starting the App 1. `cd /path/to/react-native` 2. `./packager/packager.sh --root $APPDIR --root $NODE_MODULES_DIR` + Note: DONOT use `$NODE_MODULES_DIR` if you don't have any node_modules 3. Build the App from XCode and everything should work just fine.  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 1 addition and 1 deletion.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -86,7 +86,7 @@ React.AppRegistry.registerComponent('<AppName>', () => App); ### Starting the App 1. `cd /path/to/react-native/ReactKit` 2. `./packager/packager.sh --root $APPDIR --root $NODE_MODULES_DIR` + Note: DONOT use `$NODE_MODULES_DIR` if you don't have any node_modules 3. Build the App from XCode and everything should work just fine.  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 2 additions and 1 deletion.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -62,7 +62,8 @@ override func prefersStatusBarHidden() -> Bool { This file imports react-native(Obj-C) classes to be used in your swift application. Create a header file named `ProjectName-Bridging-Header.h` and paste the contents generated by the following script ```sh cd /path/to/react-native find ./ -name "*.h" | awk -F'/' '{print "#import \""$4"\""}' ``` ### `<AppFileName>.js`  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 0 additions and 2 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -1,5 +1,3 @@ ## Settings 1. Create a project in XCode with the default settings (i.e don't fiddle with it, just type in the name).  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 11 additions and 0 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -14,6 +14,9 @@ This is a personal guide that I use to create a React Native project. + **Search Paths** > **Header Search Paths**: + Add `/path/to/react-native` + Enable `recursive` + **Swift Compiler - Code Generation** > **Objective-C Bridging Header** + Set to `ProjectName/ProjectName-Bridging-Header.h` + We will create this file in later part 5. Under project **Info** settings, + Remove property **Main storyboard file base name** 6. Delete file **Main.storyboard** from XCode and Confirm *Remove Reference* @@ -56,6 +59,14 @@ override func prefersStatusBarHidden() -> Bool { } ``` ### `ProjectName-Briding-Header.h` This file imports react-native(Obj-C) classes to be used in your swift application. Create a header file named `ProjectName-Bridging-Header.h` and paste the contents generated by the following script ```sh find /path/to/react-native -name "*.h" | awk -F'/' '{print "#import \""$4"\""}' ``` ### `<AppFileName>.js` The bare minimum stuff  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 2 additions and 2 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -9,7 +9,7 @@ This is a personal guide that I use to create a React Native project. + *+* > *Add Other...* and choose */path/to/react-native/ReactKit/ReactKit.xcodeproj* 3. Now *ReactKit* would have been imported. Link it by choosing it from the list. + *+* > **lib.ReactKit.a** 4. Under project **Build Settings**, + **Linking** > **Other Linker Flags** : Add `-all_load` + **Search Paths** > **Header Search Paths**: + Add `/path/to/react-native` @@ -23,7 +23,7 @@ This is a personal guide that I use to create a React Native project. ### `AppDelegate.swift` Use this as the function body for `didFinishLaunchingWithOptions` replacing 1. `<AppFileName>` - Your JS entry point where you'll register the Application. 2. `<AppName>` - The name you use in `<AppFileName>` in `AppRegistry.registerComponent` to register the application.  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 18 additions and 3 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -21,7 +21,7 @@ This is a personal guide that I use to create a React Native project. ## Code ### `AppDelegate.swift` Use this as the function body for `didFinishLaunchingWithOptions` and replace, @@ -46,7 +46,7 @@ self.window?.makeKeyAndVisible() return true ``` ### `ViewController.swift` Add this override to ViewController if you don't want the top time-bar of ios to be visible in your Application. @@ -56,7 +56,7 @@ override func prefersStatusBarHidden() -> Bool { } ``` ### `<AppFileName>.js` The bare minimum stuff @@ -65,3 +65,18 @@ var React = require('react-native'); var App = module.exports = React.createClass({ render() { /* ... */ }); React.AppRegistry.registerComponent('<AppName>', () => App); ``` ## Getting started ### Settings + `APPDIR = Directory which contains '<AppFileName>.js'` + `NODE_MODULES_DIR = usually '$APPDIR/node_modules'` if you use other libraries in your app ### Starting the App 1. `cd /path/to/react-native` 2. `./packager/packager.sh --root $APPDIR --root $NODE_MODULES_DIR` + Note: DONOT use `$NODE_MODULES_DIR` if you don't have any node_modules 3. Build the App from XCode and everything should work just fine.  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 58 additions and 1 deletion.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -1,10 +1,67 @@ This is a personal guide that I use to create a React Native project. ## Settings 1. Create a project in XCode with the default settings (i.e don't fiddle with it, just type in the name). + *iOS* > *Application* > **Single View Application** + Language: *Swift* 2. Under project **General** settings, add *ReactKit* to **Linked Framework and Libraries** + *+* > *Add Other...* and choose */path/to/react-native/ReactKit/ReactKit.xcodeproj* 3. Now *ReactKit* would have been imported. Link it by choosing it from the list. + *+* > **lib.ReactKit.a** 4. Under project **Build Settings** settings, + **Linking** > **Other Linker Flags** : Add `-all_load` + **Search Paths** > **Header Search Paths**: + Add `/path/to/react-native` + Enable `recursive` 5. Under project **Info** settings, + Remove property **Main storyboard file base name** 6. Delete file **Main.storyboard** from XCode and Confirm *Remove Reference* ## Code ### AppDelegate.swift Use this as the function body for `didFinishLaunchingWithOptions` and replace, 1. `<AppFileName>` - Your JS entry point where you'll register the Application. 2. `<AppName>` - The name you use in `<AppFileName>` in `AppRegistry.registerComponent` to register the application. ```swift // initialize the rootView to fetch JS from the dev server let rootView = RCTRootView() rootView.scriptURL = NSURL(string: "http://localhost:8081/<AppFileName>.includeRequire.runModule.bundle") rootView.moduleName = "<AppName>" // Initialize a Controller to use view as React View let rootViewController = ViewController() rootViewController.view = rootView // Set window to use rootViewController self.window = UIWindow(frame: UIScreen.mainScreen().bounds) self.window?.rootViewController = rootViewController self.window?.makeKeyAndVisible() return true ``` ### ViewController.swift Add this override to ViewController if you don't want the top time-bar of ios to be visible in your Application. ```swift override func prefersStatusBarHidden() -> Bool { return true } ``` ### <AppFileName>.js The bare minimum stuff ```js var React = require('react-native'); var App = module.exports = React.createClass({ render() { /* ... */ }); React.AppRegistry.registerComponent('<AppName>', () => App); ```  - 
        
boopathi revised this gist
Feb 28, 2015 . 1 changed file with 6 additions and 6 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -1,10 +1,10 @@ This is a personal guide that I use to create a React Native project. 1. Create a project in XCode with the default settings (i.e don't fiddle with it, just type in the name). + *iOS* > *Application* > **Single View Application** + Language: *Swift* 2. Under project **General** settings, add *ReactKit* to **Linked Framework and Libraries** + *+* > *Add Other...* and choose */path/to/react-native/ReactKit/ReactKit.xcodeproj* 3. Now *ReactKit* would have been imported. Link it by choosing it from the list. + *+* > **lib.ReactKit.a** 4.  - 
        
boopathi created this gist
Feb 28, 2015 .There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -0,0 +1,10 @@ This is a personal guide that I use to create a React Native project. 1. Create a project in XCode with the default settings (i.e don't fiddle with it, just type in the name). + `iOS` > `Application` > `Single View Application` + Language: `Swift` 2. Under project `General` settings, add `ReactKit` to `Linked Framework and Libraries` + `+` > `Add Other...` and choose `/path/to/react-native/ReactKit/ReactKit.xcodeproj` 3. Now `ReactKit` would have been imported. Link it by choosing it from the list. + `+` > `lib.ReactKit.a` 4.