Skip to content

Instantly share code, notes, and snippets.

@tendant
Forked from boopathi/README.md
Last active January 1, 2016 02:35
Show Gist options
  • Save tendant/6a1ea9e363f5ca4d73a1 to your computer and use it in GitHub Desktop.
Save tendant/6a1ea9e363f5ca4d73a1 to your computer and use it in GitHub Desktop.

Revisions

  1. tendant revised this gist Jan 1, 2016. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions README.md
    Original 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.
    + *+* > **lib.ReactKit.a**
    5. Add other libraries from */node_modules/react-native/Libraries* as needed.
    + *+* > **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**:
  2. tendant revised this gist Jan 1, 2016. 1 changed file with 5 additions and 3 deletions.
    8 changes: 5 additions & 3 deletions README.md
    Original 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. 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.
    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**:
  3. @boopathi boopathi revised this gist Mar 1, 2015. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,6 @@
    ## Settings

    1. Create a project in XCode with the default settings (i.e don't fiddle with it, just type in the name).
    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**
  4. @boopathi boopathi revised this gist Mar 1, 2015. 1 changed file with 1 addition and 2 deletions.
    3 changes: 1 addition & 2 deletions README.md
    Original 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
    cd /path/to/react-native/ReactKit
    find ./ -name "*.h" | awk -F'/' '{print "#import \""$4"\""}'
    find /path/to/react-native/ReactKit -name "*.h" | awk -F'/' '{print "#import \""$NF"\""}'
    ```

    ### `<AppFileName>.js`
  5. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    Original file line number Diff line number Diff line change
    @@ -26,7 +26,7 @@

    Use this as the function body for `didFinishLaunchingWithOptions` replacing

    1. `<AppFileName>` - Your JS entry point where you'll register the Application.
    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
  6. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    Original 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` and paste the contents generated by the following script
    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
  7. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions README.md
    Original 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
    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/ReactKit`
    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.
  8. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    Original 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`
    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.
  9. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion README.md
    Original 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
    find /path/to/react-native -name "*.h" | awk -F'/' '{print "#import \""$4"\""}'
    cd /path/to/react-native
    find ./ -name "*.h" | awk -F'/' '{print "#import \""$4"\""}'
    ```

    ### `<AppFileName>.js`
  10. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 0 additions and 2 deletions.
    2 changes: 0 additions & 2 deletions README.md
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,3 @@
    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).
  11. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 11 additions and 0 deletions.
    11 changes: 11 additions & 0 deletions README.md
    Original 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
  12. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions README.md
    Original 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** settings,
    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` and replace,
    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.
  13. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 18 additions and 3 deletions.
    21 changes: 18 additions & 3 deletions README.md
    Original 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
    ### `AppDelegate.swift`

    Use this as the function body for `didFinishLaunchingWithOptions` and replace,

    @@ -46,7 +46,7 @@ self.window?.makeKeyAndVisible()
    return true
    ```

    ### ViewController.swift
    ### `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
    ### `<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.
  14. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 58 additions and 1 deletion.
    59 changes: 58 additions & 1 deletion README.md
    Original 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.
    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);
    ```
  15. @boopathi boopathi revised this gist Feb 28, 2015. 1 changed file with 6 additions and 6 deletions.
    12 changes: 6 additions & 6 deletions README.md
    Original 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`
    + *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.
  16. @boopathi boopathi created this gist Feb 28, 2015.
    10 changes: 10 additions & 0 deletions README.md
    Original 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.