Facebook/react-native
1
0
Fork 0
mirror of https://github.com/facebook/react-native.git synced 2025-11-01 09:14:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updated docs for next

Browse Source
This commit is contained in:
Website Deployment Script
2016-05-10 19:05:10 +00:00
parent ba0bbf0ac1
commit 4d80ea042f
3 changed files with 17 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
releases/next/docs/getting-started.html
+17 -14
View File
@@ -40,24 +40,26 @@ block { display: none; }
</span><h2><a class="anchor" name="unsupported"></a>Unsupported <a class="hash-link" href="docs/getting-started.html#unsupported">#</a></h2><span><div>Unfortunately, Apple only lets you develop for iOS on a Mac machine. Please check out the <a href="" onclick="display('platform', 'android')">Android</a> instructions instead.</div>
</span><span><center><img src="https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xaf1/t39.1997-6/851591_233289256829505_447005964_n.png" width="150"></img></center>
</span><span><center><img src="img/react-native-sorry-not-supported.png" width="150"></img></center>
</span><span><!-- ######### MAC for iOS ##################### -->
</span><span><block class="mac ios android" />
</span><h2><a class="anchor" name="installation"></a>Installation <a class="hash-link" href="docs/getting-started.html#installation">#</a></h2><h3><a class="anchor" name="required-prerequisites"></a>Required Prerequisites <a class="hash-link" href="docs/getting-started.html#required-prerequisites">#</a></h3><h4><a class="anchor" name="homebrew"></a>Homebrew <a class="hash-link" href="docs/getting-started.html#homebrew">#</a></h4><p><a href="http://brew.sh/" target="_blank">Homebrew</a>, in order to install the required NodeJS, in addition to some
recommended installs.</p><div class="prism language-javascript"><span class="token operator">/</span>usr<span class="token operator">/</span>bin<span class="token operator">/</span>ruby <span class="token operator">-</span>e <span class="token string">&quot;$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)&quot;</span></div><blockquote><p>We recommend periodically running <code>brew update &amp;&amp; brew upgrade</code> to keep your programs up-to-date.</p></blockquote><h4><a class="anchor" name="node"></a>Node <a class="hash-link" href="docs/getting-started.html#node">#</a></h4><p>Use Homebrew to install <a href="https://nodejs.org/" target="_blank">Node.js</a>.</p><blockquote><p>NodeJS 4.0 or greater is required for React Native. The default Homebrew package for Node is
recommended installs.</p><div class="prism language-javascript"><span class="token operator">/</span>usr<span class="token operator">/</span>bin<span class="token operator">/</span>ruby <span class="token operator">-</span>e <span class="token string">&quot;$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)&quot;</span></div><h4><a class="anchor" name="node"></a>Node <a class="hash-link" href="docs/getting-started.html#node">#</a></h4><p>Use Homebrew to install <a href="https://nodejs.org/" target="_blank">Node.js</a>.</p><blockquote><p>NodeJS 4.0 or greater is required for React Native. The default Homebrew package for Node is
currently 6.0, so that is not an issue. </p></blockquote><div class="prism language-javascript">brew install node</div><h4><a class="anchor" name="react-native-command-line-tools"></a>React Native Command Line Tools <a class="hash-link" href="docs/getting-started.html#react-native-command-line-tools">#</a></h4><p>The React Native command line tools allow you to easily create and initialize projects, etc.</p><div class="prism language-javascript">npm install <span class="token operator">-</span>g react<span class="token operator">-</span>native<span class="token operator">-</span>cli</div><blockquote><p>If you see the error, <code>EACCES: permission denied</code>, please run the command:
<code>sudo npm install -g react-native-cli</code>.</p></blockquote><span><block class="mac ios" />
</span><h4><a class="anchor" name="xcode"></a>Xcode <a class="hash-link" href="docs/getting-started.html#xcode">#</a></h4><p><a href="https://developer.apple.com/xcode/downloads/" target="_blank">Xcode</a> 7.0 or higher. Open the App Store or go to <a href="https://developer.apple.com/xcode/downloads/">https://developer.apple.com/xcode/downloads/</a>. This will also install <code>git</code> as well.</p><span><block class="mac android" />
</span><h4><a class="anchor" name="android-studio"></a>Android Studio <a class="hash-link" href="docs/getting-started.html#android-studio">#</a></h4><p><a href="http://developer.android.com/sdk/index.html" target="_blank">Android Studio</a> 2.0 or higher. This will provide you
the Android SDK and emulator required to run and test your React Native apps.</p><blockquote><p>Android Studio requires the Java Development Kit [JDK] 1.8 or higher. You can type
</span><h4><a class="anchor" name="android-studio"></a>Android Studio <a class="hash-link" href="docs/getting-started.html#android-studio">#</a></h4><p><a href="http://developer.android.com/sdk/index.html" target="_blank">Android Studio</a> 2.0 or higher.</p><blockquote><p>Android Studio requires the Java Development Kit [JDK] 1.8 or higher. You can type
<code>javac -version</code> to see what version you have, if any. If you do not meet the JDK requirement,
you can
<a href="http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html" target="_blank">download it</a>.</p></blockquote><p>You will need to customize your installation:</p><ul><li>Choose a <code>Custom</code> installation</li></ul><p><img src="img/react-native-android-studio-custom-install.png" alt="custom installation"></p><ul><li>Choose both <code>Performance</code> and <code>Android Virtual Device</code></li></ul><p><img src="img/react-native-android-studio-additional-installs.png" alt="additional installs"></p><ul><li>After installation, choose <code>Configure | SDK Manager</code> from the Android Studio welcome window.</li></ul><p><img src="img/react-native-android-studio-configure-sdk.png" alt="configure sdk"></p><ul><li>In the <code>SDK Platforms</code> window, choose <code>Show Package Details</code> and under <code>Android 6.0 (Marshmallow)</code>, make sure that <code>Google APIs</code>, <code>Intel x86 Atom System Image</code>, <code>Intel x86 Atom_64 System Image</code>, and <code>Google APIs Intel x86 Atom_64 System Image</code> are checked.</li></ul><p><img src="img/react-native-android-studio-android-sdk-platforms.png" alt="platforms"></p><ul><li>In the <code>SDK Tools</code> window, choose <code>Show Package Details</code> and under <code>Android SDK Build Tools</code>, make sure that <code>Android SDK Build-Tools 23.0.1</code> is selected.</li></ul><p><img src="img/react-native-android-studio-android-sdk-build-tools.png" alt="build tools"></p><h4><a class="anchor" name="android-home-environment-variable"></a>ANDROID_HOME Environment Variable <a class="hash-link" href="docs/getting-started.html#android-home-environment-variable">#</a></h4><p>Ensure the <code>ANDROID_HOME</code> environment variable points to your existing Android SDK. To do that, add
<a href="http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html" target="_blank">download it</a>.</p></blockquote><p>Android Studio will provide you the Android SDK and emulator required to run and test your React
Native apps.</p><blockquote><p>Unless otherwise mentioned, keep all the setup defaults intact. For example, the
<code>Android Support Repository</code> is installed automatically with Android Studio, and we need that
for React Native.</p></blockquote><p>You will need to customize your installation:</p><ul><li>Choose a <code>Custom</code> installation</li></ul><p><img src="img/react-native-android-studio-custom-install.png" alt="custom installation"></p><ul><li>Choose both <code>Performance</code> and <code>Android Virtual Device</code></li></ul><p><img src="img/react-native-android-studio-additional-installs.png" alt="additional installs"></p><ul><li>After installation, choose <code>Configure | SDK Manager</code> from the Android Studio welcome window.</li></ul><p><img src="img/react-native-android-studio-configure-sdk.png" alt="configure sdk"></p><ul><li>In the <code>SDK Platforms</code> window, choose <code>Show Package Details</code> and under <code>Android 6.0 (Marshmallow)</code>, make sure that <code>Google APIs</code>, <code>Intel x86 Atom System Image</code>, <code>Intel x86 Atom_64 System Image</code>, and <code>Google APIs Intel x86 Atom_64 System Image</code> are checked.</li></ul><p><img src="img/react-native-android-studio-android-sdk-platforms.png" alt="platforms"></p><ul><li>In the <code>SDK Tools</code> window, choose <code>Show Package Details</code> and under <code>Android SDK Build Tools</code>, make sure that <code>Android SDK Build-Tools 23.0.1</code> is selected.</li></ul><p><img src="img/react-native-android-studio-android-sdk-build-tools.png" alt="build tools"></p><h4><a class="anchor" name="android-home-environment-variable"></a>ANDROID_HOME Environment Variable <a class="hash-link" href="docs/getting-started.html#android-home-environment-variable">#</a></h4><p>Ensure the <code>ANDROID_HOME</code> environment variable points to your existing Android SDK. To do that, add
this to your <code>~/.bashrc</code>, <code>~/.bash_profile</code> (or whatever your shell uses) and re-open your terminal:</p><div class="prism language-javascript"># If you installed the SDK without Android Studio<span class="token punctuation">,</span> then it may be something like<span class="token punctuation">:</span>
# <span class="token operator">/</span>usr<span class="token operator">/</span>local<span class="token operator">/</span>opt<span class="token operator">/</span>android<span class="token operator">-</span>sdk
export ANDROID_HOME<span class="token operator">=</span><span class="token operator">~</span><span class="token operator">/</span>Library<span class="token operator">/</span>Android<span class="token operator">/</span>sdk</div><span><block class="mac ios android" />
@@ -72,8 +74,8 @@ PATH<span class="token operator">=</span><span class="token string">&quot;~/Libr
export PATH</div><h4><a class="anchor" name="gradle-daemon"></a>Gradle Daemon <a class="hash-link" href="docs/getting-started.html#gradle-daemon">#</a></h4><p>Enable <a href="https://docs.gradle.org/2.9/userguide/gradle_daemon.html" target="_blank">Gradle Daemon</a> which greatly improves incremental build times for changes in java code.</p><h3><a class="anchor" name="other-optional-installs"></a>Other Optional Installs <a class="hash-link" href="docs/getting-started.html#other-optional-installs">#</a></h3><h4><a class="anchor" name="git"></a>Git <a class="hash-link" href="docs/getting-started.html#git">#</a></h4><p>Git version control. If you have installed <a href="https://developer.apple.com/xcode/" target="_blank">Xcode</a>, Git is
already installed, otherwise run the following:</p><div class="prism language-javascript">brew install git</div><span><block class="mac ios android" />
</span><h4><a class="anchor" name="nuclide"></a>Nuclide <a class="hash-link" href="docs/getting-started.html#nuclide">#</a></h4><p>[Nuclide] is an IDE from Facebook providing a first-class development environment for writing,
<a href="http://nuclide.io/docs/platforms/react-native/#running-applications" target="_blank">running</a> and
</span><h4><a class="anchor" name="nuclide"></a>Nuclide <a class="hash-link" href="docs/getting-started.html#nuclide">#</a></h4><p><a href="http://nuclide.io" target="_blank">Nuclide</a> is an IDE from Facebook providing a first-class development environment
for writing, <a href="http://nuclide.io/docs/platforms/react-native/#running-applications" target="_blank">running</a> and
<a href="http://nuclide.io/docs/platforms/react-native/#debugging" target="_blank">debugging</a>
<a href="http://nuclide.io/docs/platforms/react-native/" target="_blank">React Native</a> applications.</p><p>Get started with Nuclide <a href="http://nuclide.io/docs/quick-start/getting-started/" target="_blank">here</a>.</p><span><block class="mac android" />
@@ -104,13 +106,15 @@ sudo ln <span class="token operator">-</span>s <span class="token operator">/</s
</span><p>Fire up the Termimal and use Chocolatey to install NodeJS.</p><div class="prism language-javascript">choco install nodejs<span class="token punctuation">.</span>install</div><span><block class="windows linux android" />
</span><h4><a class="anchor" name="react-native-command-line-tools"></a>React Native Command Line Tools <a class="hash-link" href="docs/getting-started.html#react-native-command-line-tools">#</a></h4><p>The React Native command line tools allow you to easily create and initialize projects, etc.</p><div class="prism language-javascript">npm install <span class="token operator">-</span>g react<span class="token operator">-</span>native<span class="token operator">-</span>cli</div><blockquote><p>If you see the error, <code>EACCES: permission denied</code>, please run the command:
<code>sudo npm install -g react-native-cli</code>.</p></blockquote><h4><a class="anchor" name="android-studio"></a>Android Studio <a class="hash-link" href="docs/getting-started.html#android-studio">#</a></h4><p><a href="http://developer.android.com/sdk/index.html" target="_blank">Android Studio</a> 2.0 or higher. This will provide you
the Android SDK and emulator required to run and test your React Native apps.</p><blockquote><p>Android Studio requires the Java Development Kit [JDK] 1.8 or higher. You can type
<code>sudo npm install -g react-native-cli</code>.</p></blockquote><h4><a class="anchor" name="android-studio"></a>Android Studio <a class="hash-link" href="docs/getting-started.html#android-studio">#</a></h4><p><a href="http://developer.android.com/sdk/index.html" target="_blank">Android Studio</a> 2.0 or higher.</p><blockquote><p>Android Studio requires the Java Development Kit [JDK] 1.8 or higher. You can type
<code>javac -version</code> to see what version you have, if any. If you do not meet the JDK requirement,
you can
<a href="http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html" target="_blank">download it</a>,
or use a pacakage manager to install it (e.g. <code>choco install jdk8</code>,
<code>apt-get install default-jdk</code>).</p></blockquote><span><block class="linux android" />
<code>apt-get install default-jdk</code>).</p></blockquote><p>Android Studio will provide you the Android SDK and emulator required to run and test your React
Native apps.</p><blockquote><p>Unless otherwise mentioned, keep all the setup defaults intact. For example, the
<code>Android Support Repository</code> is installed automatically with Android Studio, and we need that
for React Native.</p></blockquote><span><block class="linux android" />
</span><p>You will need to customize your installation:</p><ul><li>Choose a <code>Custom</code> installation</li></ul><p><img src="img/react-native-android-studio-custom-install-linux.png" alt="custom installation"></p><ul><li>Choose <code>Android Virtual Device</code></li></ul><p><img src="img/react-native-android-studio-additional-installs-linux.png" alt="additional installs"></p><span><block class="windows android" />
@@ -240,9 +244,9 @@ folder in <a href="http://nuclide.io" target="_blank">Nuclide</a> and
</span><ul><li>Open <code>index.ios.js</code> in your text editor of choice (e.g. <a href="http://nuclide.io/docs/platforms/react-native/" target="_blank">Nuclide</a>) and edit some lines.</li><li>Hit ⌘-R in your iOS simulator to reload the app and see your change!</li></ul><span><block class="mac android" />
</span><ul><li>Press the <code>R</code> key twice <strong>OR</strong> open the menu (F2 by default, or ⌘-M in Genymotion) and select Reload JS to see your change!</li><li>Run <code>adb logcat *:S ReactNative:V ReactNativeJS:V</code> in a terminal to see your app&#x27;s logs</li></ul><span><block class="mac ios android" />
</span><ul><li>Open <code>index.android.js</code> in your text editor of choice (e.g. <a href="http://nuclide.io/docs/platforms/react-native/" target="_blank">Nuclide</a>) and edit some lines.</li><li>Press the <code>R</code> key twice <strong>OR</strong> open the menu (F2 by default, or ⌘-M in Genymotion) and select Reload JS to see your change!</li><li>Run <code>adb logcat *:S ReactNative:V ReactNativeJS:V</code> in a terminal to see your app&#x27;s logs</li></ul><span><block class="mac ios android" />
</span><h3><a class="anchor" name="that-s-it"></a>That&#x27;s It <a class="hash-link" href="docs/getting-started.html#that-s-it">#</a></h3><p>Congratulations! You&#x27;ve successfully run and modified your first React Native app.</p><span><center><img src="https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xfa1/t39.1997-6/851555_209575209232981_1876032292_n.png" width="150"></img></center>
</span><h3><a class="anchor" name="that-s-it"></a>That&#x27;s It <a class="hash-link" href="docs/getting-started.html#that-s-it">#</a></h3><p>Congratulations! You&#x27;ve successfully run and modified your first React Native app.</p><span><center><img src="img/react-native-congratulations.png" width="150"></img></center>
</span><span><block class="windows linux android" />
@@ -256,8 +260,7 @@ react<span class="token operator">-</span>native start</div><span><block class="
</span><p>Or if you hit a <code>ERROR Watcher took too long to load</code> on Windows, try increasing the timeout in <a href="https://github.com/facebook/react-native/blob/5fa33f3d07f8595a188f6fe04d6168a6ede1e721/packager/react-packager/src/DependencyResolver/FileWatcher/index.js#L16" target="_blank">this file</a> (under your <code>node_modules/react-native/</code>).</p><span><block class="windows linux android" />
</span><h3><a class="anchor" name="modifying-project"></a>Modifying Project <a class="hash-link" href="docs/getting-started.html#modifying-project">#</a></h3><p>Now that you successfully started the project, let&#x27;s modify it:</p><ul><li>Open <code>index.android.js</code> in your text editor of choice (e.g. <a href="http://nuclide.io/docs/platforms/react-native/" target="_blank">Nuclide</a>) and edit some lines.</li><li>Press the <code>R</code> key twice <strong>OR</strong> open the menu (F2 by default, or ⌘-M in the emulator) and select Reload JS to see your change!</li><li>Run <code>adb logcat *:S ReactNative:V ReactNativeJS:V</code> in a terminal to see your app&#x27;s logs</li></ul><h3><a class="anchor" name="that-s-it"></a>That&#x27;s It <a class="hash-link" href="docs/getting-started.html#that-s-it">#</a></h3><p>Congratulations! You&#x27;ve successfully run and modified your first React Native app.</p><span><center><img src="https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xfa1/t39.1997-6/851555_209575209232981_1876032292_n.png" width="150"></img></center>
</span><h3><a class="anchor" name="modifying-project"></a>Modifying Project <a class="hash-link" href="docs/getting-started.html#modifying-project">#</a></h3><p>Now that you successfully started the project, let&#x27;s modify it:</p><ul><li>Open <code>index.android.js</code> in your text editor of choice (e.g. <a href="http://nuclide.io/docs/platforms/react-native/" target="_blank">Nuclide</a>) and edit some lines.</li><li>Press the <code>R</code> key twice <strong>OR</strong> open the menu (F2 by default, or ctrl-M in the emulator) and select Reload JS to see your change!</li><li>Run <code>adb logcat *:S ReactNative:V ReactNativeJS:V</code> in a terminal to see your app&#x27;s logs</li></ul><h3><a class="anchor" name="that-s-it"></a>That&#x27;s It <a class="hash-link" href="docs/getting-started.html#that-s-it">#</a></h3><p>Congratulations! You&#x27;ve successfully run and modified your first React Native app.</p><span><center><img src="img/react-native-congratulations.png" width="150"></img></center>
</span><span><block class="mac ios android" />
releases/next/img/react-native-congratulations.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 39 KiB

releases/next/img/react-native-sorry-not-supported.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 60 KiB