Deploy website

Deploy website version based on 57aa17f4e297372722122608ba4e9f1d1d7e347d
2025-11-01 09:14:26 +00:00 · 2019-03-20 14:11:36 +00:00
parent 5dd1a14094
commit 95d860a6a4
772 changed files with 3962 additions and 1102 deletions
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.10/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.10/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.10/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.10/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.11/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.11/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.11/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.11/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.12/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.12/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.12/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.12/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.13/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.13/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.13/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.13/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.14/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.14/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.14/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.14/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.15/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.15/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.15/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.15/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.16/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.16/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.16/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.16/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -151,7 +151,7 @@
  <span class="hljs-attr">"version"</span>: <span class="hljs-string">"0.0.1"</span>,
  <span class="hljs-attr">"private"</span>: <span class="hljs-literal">true</span>,
  <span class="hljs-attr">"scripts"</span>: {
-    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node node_modules/react-native/local-cli/cli.js start"</span>
+    <span class="hljs-attr">"start"</span>: <span class="hljs-string">"yarn react-native start"</span>
  }
 }
 </code></pre>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -50,33 +50,37 @@
 </ul>
 <p>ES6</p>
 <ul>
-<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})}</code></li>
+<li><a href="http://babeljs.io/docs/learn-es2015/#arrows">Arrow functions</a>: <code>&lt;C onPress={() =&gt; this.setState({pressed: true})} /&gt;</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Block scoping</a>: <code>let greeting = 'hi';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#default-rest-spread">Call spread</a>: <code>Math.max(...array);</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#classes">Classes</a>: <code>class C extends React.Component { render() { return &lt;View /&gt;; } }</code></li>
 <li><a href="https://babeljs.io/docs/learn-es2015/#let-const">Constants</a>: <code>const answer = 42;</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#destructuring">Destructuring</a>: <code>var {isActive, style} = this.props;</code></li>
-<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {}</code></li>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a>: <code>for (var num of [1, 2, 3]) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#modules">Modules</a>: <code>import React, { Component } from 'react';</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Computed Properties</a>: <code>var key = 'abc'; var obj = {[key]: 10};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Concise Method</a>: <code>var obj = { method() { return 10; } };</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#enhanced-object-literals">Object Short Notation</a>: <code>var name = 'vjeux'; var obj = { name };</code></li>
-<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) { }</code></li>
+<li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Rest Params</a>: <code>function(type, ...args) {};</code></li>
 <li><a href="http://babeljs.io/docs/learn-es2015/#template-strings">Template Literals</a>: <code>var who = 'world'; var str = `Hello ${who}`;</code></li>
 </ul>
 <p>ES8</p>
 <ul>
-<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) { }</code></li>
-<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); }</code>;</li>
+<li><a href="https://github.com/jeffmo/es-trailing-function-commas">Function Trailing Comma</a>: <code>function f(a, b, c,) {};</code></li>
+<li><a href="https://github.com/tc39/ecmascript-asyncawait">Async Functions</a>: <code>async function doStuffAsync() { const foo = await doOtherStuffAsync(); };</code></li>
 </ul>
 <p>Stage 3</p>
 <ul>
 <li><a href="https://github.com/sebmarkbage/ecmascript-rest-spread">Object Spread</a>: <code>var extended = { ...obj, a: 10 };</code></li>
 </ul>
+<p>Stage 1</p>
+<ul>
+<li><a href="https://github.com/tc39/proposal-optional-chaining">Optional Chaining</a>: <code>var name = obj.user?.name;</code></li>
+</ul>
 <p>Specific</p>
 <ul>
 <li><a href="https://reactjs.org/docs/jsx-in-depth.html">JSX</a>: <code>&lt;View style={{color: 'red'}} /&gt;</code></li>
-<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {}</code></li>
+<li><a href="http://flowtype.org/">Flow</a>: <code>function foo(x: ?number): string {};</code></li>
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="polyfills"></a><a href="#polyfills" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Polyfills</h2>
 <p>Many standards functions are also available on all the supported JavaScript runtimes.</p>
@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -73,7 +73,7 @@ RCT_EXPORT_MODULE(RNTMap)
 <span class="token keyword">import</span> <span class="token punctuation">{</span> requireNativeComponent <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-native'</span><span class="token punctuation">;</span>

 <span class="token comment">// requireNativeComponent automatically resolves 'RNTMap' to 'RNTMapManager'</span>
-module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token function">requireNativeComponent</span><span class="token punctuation">(</span><span class="token string">'RNTMap'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

 <span class="token comment">// MyApp.js</span>

@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -42,7 +42,7 @@
 <h2><a class="anchor" aria-hidden="true" id="the-toast-module"></a><a href="#the-toast-module" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>The Toast Module</h2>
 <p>This guide will use the <a href="http://developer.android.com/reference/android/widget/Toast.html">Toast</a> example. Let's say we would like to be able to create a toast message from JavaScript.</p>
 <p>We start by creating a native module. A native module is a Java class that usually extends the <code>ReactContextBaseJavaModule</code> class and implements the functionality required by the JavaScript. Our goal here is to be able to write <code>ToastExample.show('Awesome', ToastExample.SHORT);</code> from JavaScript to display a short toast on the screen.</p>
-<p>create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
+<p>Create a new Java Class named <code>ToastModule.java</code> inside <code>android/app/src/main/java/com/your-app-name/</code> folder with the content below:</p>
 <pre><code class="hljs css language-java"><span class="token comment">// ToastModule.java</span>

 <span class="token keyword">package</span> com<span class="token punctuation">.</span>your<span class="token operator">-</span>app<span class="token operator">-</span>name<span class="token punctuation">;</span>
@@ -150,6 +150,7 @@ R<span class="hljs-function"><span class="hljs-title">eadableArray</span> -&gt;<
 <span class="token punctuation">}</span>
 </code></pre>
 <p>To make it simpler to access your new functionality from JavaScript, it is common to wrap the native module in a JavaScript module. This is not necessary but saves the consumers of your library the need to pull it off of <code>NativeModules</code> each time. This JavaScript file also becomes a good location for you to add any JavaScript side functionality.</p>
+<p>Create a new JavaScript file named <code>ToastExample.js</code> with the content below:</p>
 <pre><code class="hljs css language-javascript"><span class="token comment">/**
 * This exposes the native ToastExample module as a JS module. This has a
 * function 'show' which takes the following parameters:
@@ -166,6 +167,7 @@ module<span class="token punctuation">.</span>exports <span class="token operato

 ToastExample<span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token string">'Awesome'</span><span class="token punctuation">,</span> ToastExample<span class="token punctuation">.</span><span class="token constant">SHORT</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
+<p>Please make sure this JavasScript file to be the same hierarchy as <code>ToastExample.js</code>.</p>
 <h2><a class="anchor" aria-hidden="true" id="beyond-toasts"></a><a href="#beyond-toasts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Beyond Toasts</h2>
 <h3><a class="anchor" aria-hidden="true" id="callbacks"></a><a href="#callbacks" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callbacks</h3>
 <p>Native modules also support a special kind of argument - a callback. In most cases it is used to provide the function call result to JavaScript.</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -254,6 +254,14 @@ RCTRootView *rootView = [[RCTRootView alloc]
 <pre><code class="hljs css language-javascript">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>CalendarManager<span class="token punctuation">.</span>firstDayOfTheWeek<span class="token punctuation">)</span><span class="token punctuation">;</span>
 </code></pre>
 <p>Note that the constants are exported only at initialization time, so if you change <code>constantsToExport</code> values at runtime it won't affect the JavaScript environment.</p>
+<h3><a class="anchor" aria-hidden="true" id="implementing-requiresmainqueuesetup"></a><a href="#implementing-requiresmainqueuesetup" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Implementing <code>+ requiresMainQueueSetup</code></h3>
+<p>If you override <code>- constantsToExport</code> then you should also implement <code>+ requiresMainQueueSetup</code> to let React Native know if your module needs to be initialized on the main thread. Otherwise you will see a warning that in the future your module may be initialized on a background thread unless you explicitly opt out with <code>+ requiresMainQueueSetup</code>:</p>
+<pre><code class="hljs css language-objectivec">+ (<span class="hljs-built_in">BOOL</span>)requiresMainQueueSetup
+{
+  <span class="hljs-keyword">return</span> <span class="hljs-literal">YES</span>;  <span class="hljs-comment">// only do this if your module initialization relies on calling UIKit!</span>
+}
+</code></pre>
+<p>If your module does not require access to UIKit, then you should respond to <code>+ requiresMainQueueSetup</code> with <code>NO</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="enum-constants"></a><a href="#enum-constants" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Enum Constants</h3>
 <p>Enums that are defined via <code>NS_ENUM</code> cannot be used as method arguments without first extending RCTConvert.</p>
 <p>In order to export the following <code>NS_ENUM</code> definition:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -285,7 +285,7 @@ module.exports =<span class="hljs-built_in"> config;
 ]
 </code></pre>
 <p>Finally, you can update &quot;start&quot; under &quot;scripts&quot; on your package.json to use the config:</p>
-<p><code>&quot;start&quot;: &quot;node node_modules/react-native/local-cli/cli.js start --config ../../../../packager/config.js&quot;,</code></p>
+<p><code>&quot;start&quot;: &quot;yarn react-native start --config packager/config.js&quot;,</code></p>
 <p>Start your package server with <code>npm start</code>. Note that when the dev packager is automatically launched via xcode and <code>react-native run-android</code>, etc, it does not use <code>npm start</code>, so it won't use the config.</p>
 <h3><a class="anchor" aria-hidden="true" id="investigating-the-loaded-modules"></a><a href="#investigating-the-loaded-modules" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Investigating the Loaded Modules</h3>
 <p>In your root file (index.(ios|android).js) you can add the following after the initial imports:</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.17/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.17/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
@@ -333,12 +333,24 @@ npm start <span class="hljs-comment"># you can also use: expo start</span>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Expo (or Create React Native App), or if you're adding iOS support to an existing React Native project (see <a href="/react-native/docs/0.17/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version"></a><a href="#optional-using-a-specific-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="creating-a-new-application-1"></a><a href="#creating-a-new-application-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Creating a new application</h2>
 <p>Use the React Native command line interface to generate a new React Native project called &quot;AwesomeProject&quot;:</p>
 <pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject
 </code></pre>
 <p>This is not necessary if you are integrating React Native into an existing application, if you &quot;ejected&quot; from Create React Native App, or if you're adding Android support to an existing React Native project (see <a href="/react-native/docs/0.17/platform-specific-code">Platform Specific Code</a>). You can also use a third-party CLI to init your React Native app, such as <a href="https://github.com/infinitered/ignite">Ignite CLI</a>.</p>
+<h3><a class="anchor" aria-hidden="true" id="optional-using-a-specific-version-1"></a><a href="#optional-using-a-specific-version-1" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>[Optional] Using a specific version</h3>
+<p>If you want to start a new project with a specifc React Native version, you can use the <code>--version</code> argument:</p>
+<pre><code class="hljs">react-native init AwesomeProject --version X<span class="hljs-selector-class">.XX</span><span class="hljs-selector-class">.X</span>
+</code></pre>
+<pre><code class="hljs">react-<span class="hljs-keyword">native</span> init AwesomeProject --version react-<span class="hljs-keyword">native</span><span class="hljs-meta">@next</span>
+</code></pre>
 <p><block class="native mac windows linux android" /></p>
 <h2><a class="anchor" aria-hidden="true" id="preparing-the-android-device"></a><a href="#preparing-the-android-device" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Preparing the Android device</h2>
 <p>You will need an Android device to run your React Native Android app. This can be either a physical Android device, or more commonly, you can use an Android Virtual Device which allows you to emulate an Android device on your computer.</p>
--- a/Show More
+++ b/Show More