Include Create React Native App in Getting Started

docs/GettingStarted.md

@@ -12,8 +12,40 @@ your system, so that you can build apps with it right away. If you already
 have React Native installed, you can skip ahead to the
 [Tutorial](docs/tutorial.html).
 
-The instructions are a bit different depending on your development operating system, and whether you want to start developing for iOS or Android. If you
-want to develop for both iOS and Android, that's fine - you just have to pick
+## Quick Start
+
+[Create React Native App](https://github.com/react-community/create-react-native-app) is the easiest way to start building a new React Native application. It allows you to start a project without installing or configuring any native build tools.
+
+Assuming that you have Node installed, no Xcode or Android Studio installation is required:
+
+```
+npm install -g create-react-native-app
+create-react-native-app hello-world
+cd hello-world
+npm start
+```
+
+This will start a development server for you, and print a QR code in your terminal.
+
+Install the [Expo](https://expo.io) client app on your iOS or Android phone, make sure your phone is on the same network as your computer, and scan the QR code in your terminal to open your project. The QR scanner is available under the "Projects" tab of the app. Create React Native App also has a [user guide](https://github.com/react-community/create-react-native-app/blob/master/react-native-scripts/template/README.md) you can reference if you have questions specific to the tool.
+
+Once you've created your project and opened it in the Expo client app, you can proceed to the [Tutorial](docs/tutorial.html).
+
+### Caveats
+
+Because you don't build any native code with Create React Native App, it's not possible to include custom native modules beyond the React Native APIs and components that are available in the Expo client app.
+
+If you know that you'll eventually need to include your own native code, Create React Native App is still a good way to get started. In that case you'll just need to "[eject](https://github.com/react-community/create-react-native-app/blob/master/react-native-scripts/template/README.md#ejecting-from-create-react-native-app)" eventually to create your own native builds. If you do eject, the native build instructions below will be required to continue working on your project.
+
+If you're integrating React Native into an existing project, you'll want to skip Create React Native App and go directly to setting up the native build environment. See below for instructions on configuring a native build environment for React Native.
+
+<hr style="margin-top:25px"/>
+
+## Native Builds
+
+Follow these instructions if you need your own native build configuration. For example, if you "ejected" from Create React Native app, or if you are integrating React Native into an existing application, you'll need this section.
+
+The instructions are a bit different depending on your development operating system, and whether you want to start developing for iOS or Android. If you want to develop for both iOS and Android, that's fine - you just have to pick
 one to start with, since the setup is a bit different.
 
 <div class="toggler">

website/core/EjectBanner.js

@@ -0,0 +1,30 @@
+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @providesModule EjectBanner
+ */
+'use strict';
+
+var React = require('React');
+
+var EjectBanner = React.createClass({
+  render: function() {
+    return (
+      <div className="banner-crna-ejected">
+        <h3>Native Build Required</h3>
+        <p>
+          This page only applies to apps made with <code>react-native init</code> or to those made
+          with Create React Native App which have since ejected. For more information about ejecting,
+          please see the <a href="https://github.com/react-community/create-react-native-app/blob/master/EJECTING.md" target="_blank">guide</a> on the Create React Native App repository.
+        </p>
+      </div>
+    );
+  }
+});
+
+module.exports = EjectBanner;

website/layout/DocsLayout.js

@@ -11,6 +11,7 @@
 'use strict';
 
 var DocsSidebar = require('DocsSidebar');
+var EjectBanner = require('EjectBanner');
 var Footer = require('Footer');
 var Header = require('Header');
 var Marked = require('Marked');
@@ -43,6 +44,7 @@ var DocsLayout = React.createClass({
           <div className="inner-content">
             <a id="content" />
             <Header level={1}>{metadata.title}</Header>
+            {(metadata.banner === 'ejected') ? <EjectBanner/> : null}
             <Marked>{content}</Marked>
             <div className="docs-prevnext">
               {metadata.previous && <a className="docs-prev" href={'docs/' + metadata.previous + '.html#content'}>&larr; Prev</a>}