Updated docs for next

This commit is contained in:
Website Deployment Script
2017-08-10 10:54:21 +00:00
parent accb8cd814
commit 154492db05
3 changed files with 4 additions and 3 deletions
@@ -410,7 +410,7 @@ AppRegistry<span class="token punctuation">.</span><span class="token function">
<span class="token keyword">return</span> <span class="token keyword">super</span><span class="token punctuation">.</span><span class="token function">onKeyUp<span class="token punctuation">(</span></span>keyCode<span class="token punctuation">,</span> event<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span></div><p>Now your activity is ready to run some JavaScript code.</p><h3><a class="anchor" name="test-your-integration"></a>Test your integration <a class="hash-link" href="docs/integration-with-existing-apps.html#test-your-integration">#</a></h3><p>You have now done all the basic steps to integrate React Native with your current application. Now we will start the React Native packager to build the <code>index.bundle</code> package and the server running on localhost to serve it.</p><h5><a class="anchor" name="1-run-the-packager"></a>1. Run the packager <a class="hash-link" href="docs/integration-with-existing-apps.html#1-run-the-packager">#</a></h5><p>To run your app, you need to first start the development server. To do this, simply run the following command in the root directory of your React Native project:</p><div class="prism language-javascript">$ npm start</div><h5><a class="anchor" name="2-run-the-app"></a>2. Run the app <a class="hash-link" href="docs/integration-with-existing-apps.html#2-run-the-app">#</a></h5><p>Now build and run your Android app as normal.</p><p>Once you reach your React-powered activity inside the app, it should load the JavaScript code from the development server and display:</p><p><img src="img/EmbeddedAppAndroid.png" alt="Screenshot"></p><h3><a class="anchor" name="creating-a-release-build-in-android-studio"></a>Creating a release build in Android Studio <a class="hash-link" href="docs/integration-with-existing-apps.html#creating-a-release-build-in-android-studio">#</a></h3><p>You can use Android Studio to create your release builds too! Its as easy as creating release builds of your previously-existing native Android app. Theres just one additional step, which youll have to do before every release build. You need to execute the following to create a React Native bundle, which will be included with your native Android app:</p><div class="prism language-javascript">$ react<span class="token operator">-</span>native bundle <span class="token operator">--</span>platform android <span class="token operator">--</span>dev <span class="token boolean">false</span> <span class="token operator">--</span>entry<span class="token operator">-</span>file index<span class="token punctuation">.</span>js <span class="token operator">--</span>bundle<span class="token operator">-</span>output android<span class="token operator">/</span>com<span class="token operator">/</span>your<span class="token operator">-</span>company<span class="token operator">-</span>name<span class="token operator">/</span>app<span class="token operator">-</span><span class="token keyword">package</span><span class="token operator">-</span>name<span class="token operator">/</span>src<span class="token operator">/</span>main<span class="token operator">/</span>assets<span class="token operator">/</span>index<span class="token punctuation">.</span>android<span class="token punctuation">.</span>bundle <span class="token operator">--</span>assets<span class="token operator">-</span>dest android<span class="token operator">/</span>com<span class="token operator">/</span>your<span class="token operator">-</span>company<span class="token operator">-</span>name<span class="token operator">/</span>app<span class="token operator">-</span><span class="token keyword">package</span><span class="token operator">-</span>name<span class="token operator">/</span>src<span class="token operator">/</span>main<span class="token regex">/res/</span></div><blockquote><p>Dont forget to replace the paths with correct ones and create the assets folder if it doesnt exist.</p></blockquote><p>Now just create a release build of your native app from within Android Studio as usual and you should be good to go!</p><span><block class="objc swift android" />
</span><h3><a class="anchor" name="now-what"></a>Now what? <a class="hash-link" href="docs/integration-with-existing-apps.html#now-what">#</a></h3><p>At this point you can continue developing your app as usual. Refer to our <a href="/docs/debugging.html" target="">debugging</a> and <a href="docs/running-on-device.html" target="_blank">deployment</a> docs to learn more about working with React Native.</p><span><script>
</span><h3><a class="anchor" name="now-what"></a>Now what? <a class="hash-link" href="docs/integration-with-existing-apps.html#now-what">#</a></h3><p>At this point you can continue developing your app as usual. Refer to our <a href="docs/debugging.html" target="_blank">debugging</a> and <a href="docs/running-on-device.html" target="_blank">deployment</a> docs to learn more about working with React Native.</p><span><script>
function displayTab(type, value) {
var container = document.getElementsByTagName('block')[0].parentNode;
container.className = 'display-' + type + '-' + value + ' ' +
@@ -5,7 +5,7 @@ step will be necessary, but no more than that.</p><p><em>All the libraries we sh
the root of the repository. Some of them are pure JavaScript, and you only need
to <code>require</code> it. Other libraries also rely on some native code, in that case
you&#x27;ll have to add these files to your app, otherwise the app will throw an
error as soon as you try to use the library.</em></p><h2><a class="anchor" name="here-the-few-steps-to-link-your-libraries-that-contain-native-code"></a>Here the few steps to link your libraries that contain native code <a class="hash-link" href="docs/linking-libraries-ios.html#here-the-few-steps-to-link-your-libraries-that-contain-native-code">#</a></h2><h3><a class="anchor" name="automatic-linking"></a>Automatic linking <a class="hash-link" href="docs/linking-libraries-ios.html#automatic-linking">#</a></h3><h4><a class="anchor" name="step-1"></a>Step 1 <a class="hash-link" href="docs/linking-libraries-ios.html#step-1">#</a></h4><p>Install a library with native dependencies:</p><div class="prism language-bash">$ npm install <span class="token operator">&lt;</span>library<span class="token operator">-</span><span class="token keyword">with</span><span class="token operator">-</span>native<span class="token operator">-</span>dependencies<span class="token operator">&gt;</span> <span class="token operator">--</span>save</div><p><strong>Note:</strong> <em><code>--save</code> or <code>--save-dev</code> flag is very important for this step. React Native will link
error as soon as you try to use the library.</em></p><h2><a class="anchor" name="here-are-the-few-steps-to-link-your-libraries-that-contain-native-code"></a>Here are the few steps to link your libraries that contain native code <a class="hash-link" href="docs/linking-libraries-ios.html#here-are-the-few-steps-to-link-your-libraries-that-contain-native-code">#</a></h2><h3><a class="anchor" name="automatic-linking"></a>Automatic linking <a class="hash-link" href="docs/linking-libraries-ios.html#automatic-linking">#</a></h3><h4><a class="anchor" name="step-1"></a>Step 1 <a class="hash-link" href="docs/linking-libraries-ios.html#step-1">#</a></h4><p>Install a library with native dependencies:</p><div class="prism language-bash">$ npm install <span class="token operator">&lt;</span>library<span class="token operator">-</span><span class="token keyword">with</span><span class="token operator">-</span>native<span class="token operator">-</span>dependencies<span class="token operator">&gt;</span> <span class="token operator">--</span>save</div><p><strong>Note:</strong> <em><code>--save</code> or <code>--save-dev</code> flag is very important for this step. React Native will link
your libs based on <code>dependencies</code> and <code>devDependencies</code> in your <code>package.json</code> file.</em></p><h4><a class="anchor" name="step-2"></a>Step 2 <a class="hash-link" href="docs/linking-libraries-ios.html#step-2">#</a></h4><p>Link your native dependencies:</p><div class="prism language-bash">$ react<span class="token operator">-</span>native link</div><p>Done! All libraries with native dependencies should be successfully linked to your iOS/Android project.</p><h3><a class="anchor" name="manual-linking"></a>Manual linking <a class="hash-link" href="docs/linking-libraries-ios.html#manual-linking">#</a></h3><h4><a class="anchor" name="step-1"></a>Step 1 <a class="hash-link" href="docs/linking-libraries-ios.html#step-1">#</a></h4><p>If the library has native code, there must be a <code>.xcodeproj</code> file inside it&#x27;s
folder.
Drag this file to your project on Xcode (usually under the <code>Libraries</code> group
+2 -1
View File
@@ -8,7 +8,8 @@ solution in JavaScript, or check out either of these components for native
solutions: <a href="http://airbnb.io/native-navigation/" target="_blank">native-navigation</a>,
<a href="https://github.com/wix/react-native-navigation" target="_blank">react-native-navigation</a>.</p><p>To set up the navigator, provide the <code>initialRoute</code> prop with a route
object. A route object is used to describe each scene that your app
navigates to. <code>initialRoute</code> represents the first route in your navigator.</p><div class="prism language-javascript"><span class="token keyword">import</span> React<span class="token punctuation">,</span> <span class="token punctuation">{</span> Component<span class="token punctuation">,</span> PropTypes <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#x27;react&#x27;</span><span class="token punctuation">;</span>
navigates to. <code>initialRoute</code> represents the first route in your navigator.</p><div class="prism language-javascript"><span class="token keyword">import</span> PropTypes <span class="token keyword">from</span> <span class="token string">&#x27;prop-types&#x27;</span><span class="token punctuation">;</span>
<span class="token keyword">import</span> React<span class="token punctuation">,</span> <span class="token punctuation">{</span> Component <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#x27;react&#x27;</span><span class="token punctuation">;</span>
<span class="token keyword">import</span> <span class="token punctuation">{</span> NavigatorIOS<span class="token punctuation">,</span> Text <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#x27;react-native&#x27;</span><span class="token punctuation">;</span>
<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token keyword">class</span> <span class="token class-name">NavigatorIOSApp</span> <span class="token keyword">extends</span> <span class="token class-name">Component</span> <span class="token punctuation">{</span>