update website

This commit is contained in:
Travis CI committed 2015-03-26 07:01:41 +00:00
1 parent acfe904604
commit 0adb8aa7c8
8 files changed
+98 -18

No files matched your search

+24 -7
View File
@@ -1,5 +1,5 @@
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>React Native | Build Native Apps Using React</title><meta name="viewport" content="width=device-width"><meta property="og:title" content="React Native | Build Native Apps Using React"><meta property="og:type" content="website"><meta property="og:url" content="http://facebook.github.io/react-native/index.html"><meta property="og:image" content="http://facebook.github.io/react-native/img/opengraph.png?2"><meta property="og:description" content="Build Native Apps Using React"><link rel="shortcut icon" href="/react-native/img/favicon.png?2"><link rel="stylesheet" href="/react-native/css/react-native.css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href="/react-native/"><img src="/react-native/img/header_logo.png">React Native</a><ul class="nav-site"><li><a href="/react-native/docs/getting-started.html#content" class="active">docs</a></li><li><a href="/react-native/support.html" class="">support</a></li><li><a href="http://facebook.github.io/react" class="">react</a></li><li><a href="http://github.com/facebook/react-native" class="">github</a></li></ul></div></div><section class="content wrap documentationContent"><div class="nav-docs"><div class="nav-docs-section"><h3>Quick Start</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/getting-started.html#content">Getting Started</a></li><li><a style="margin-left:0;" class="active" href="/react-native/docs/tutorial.html#content">Tutorial</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/videos.html#content">Videos</a></li></ul></div><div class="nav-docs-section"><h3>Guides</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/style.html#content">Style</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/gesture-responder-system.html#content">Gesture Responder System</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/nativemodulesios.html#content">Native Modules (iOS)</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/testing.html#content">Testing</a></li></ul></div><div class="nav-docs-section"><h3>components</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/activityindicatorios.html#content">ActivityIndicatorIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/datepickerios.html#content">DatePickerIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/image.html#content">Image</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/listview.html#content">ListView</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/mapview.html#content">MapView</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/navigatorios.html#content">NavigatorIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/pickerios.html#content">PickerIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/scrollview.html#content">ScrollView</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/reactnavigator.html#content">ReactNavigator</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/sliderios.html#content">SliderIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/switchios.html#content">SwitchIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/tabbarios.html#content">TabBarIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/text.html#content">Text</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/textinput.html#content">TextInput</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/touchablehighlight.html#content">TouchableHighlight</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/touchableopacity.html#content">TouchableOpacity</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/touchablewithoutfeedback.html#content">TouchableWithoutFeedback</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/view.html#content">View</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/webview.html#content">WebView</a></li></ul></div><div class="nav-docs-section"><h3>apis</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/alertios.html#content">AlertIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/animation.html#content">Animation</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/appregistry.html#content">AppRegistry</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/appstateios.html#content">AppStateIOS</a>Line truncated
<span class="token punctuation">{</span>title<span class="token punctuation">:</span> <span class="token string">&#x27;Title&#x27;</span><span class="token punctuation">,</span> year<span class="token punctuation">:</span> <span class="token string">&#x27;2015&#x27;</span><span class="token punctuation">,</span> posters<span class="token punctuation">:</span> <span class="token punctuation">{</span>thumbnail<span class="token punctuation">:</span> <span class="token string">&#x27;http://resizing.flixster.com/yDGJbDZ4tOk8Wsfl2Ljt1JYgHpk=/53x81/dkpu1ddg7pbsk.cloudfront.net/movie/11/18/90/11189059_ori.jpg&#x27;</span><span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token punctuation">,</span>
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>React Native | Build Native Apps Using React</title><meta name="viewport" content="width=device-width"><meta property="og:title" content="React Native | Build Native Apps Using React"><meta property="og:type" content="website"><meta property="og:url" content="http://facebook.github.io/react-native/index.html"><meta property="og:image" content="http://facebook.github.io/react-native/img/opengraph.png?2"><meta property="og:description" content="Build Native Apps Using React"><link rel="shortcut icon" href="/react-native/img/favicon.png?2"><link rel="stylesheet" href="/react-native/css/react-native.css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href="/react-native/"><img src="/react-native/img/header_logo.png">React Native</a><ul class="nav-site"><li><a href="/react-native/docs/getting-started.html#content" class="active">docs</a></li><li><a href="/react-native/support.html" class="">support</a></li><li><a href="http://facebook.github.io/react" class="">react</a></li><li><a href="http://github.com/facebook/react-native" class="">github</a></li></ul></div></div><section class="content wrap documentationContent"><div class="nav-docs"><div class="nav-docs-section"><h3>Quick Start</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/getting-started.html#content">Getting Started</a></li><li><a style="margin-left:0;" class="active" href="/react-native/docs/tutorial.html#content">Tutorial</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/videos.html#content">Videos</a></li></ul></div><div class="nav-docs-section"><h3>Guides</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/style.html#content">Style</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/gesture-responder-system.html#content">Gesture Responder System</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/nativemodulesios.html#content">Native Modules (iOS)</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/testing.html#content">Testing</a></li></ul></div><div class="nav-docs-section"><h3>components</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/activityindicatorios.html#content">ActivityIndicatorIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/datepickerios.html#content">DatePickerIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/image.html#content">Image</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/listview.html#content">ListView</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/mapview.html#content">MapView</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/navigatorios.html#content">NavigatorIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/pickerios.html#content">PickerIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/scrollview.html#content">ScrollView</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/reactnavigator.html#content">ReactNavigator</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/sliderios.html#content">SliderIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/switchios.html#content">SwitchIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/tabbarios.html#content">TabBarIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/text.html#content">Text</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/textinput.html#content">TextInput</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/touchablehighlight.html#content">TouchableHighlight</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/touchableopacity.html#content">TouchableOpacity</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/touchablewithoutfeedback.html#content">TouchableWithoutFeedback</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/view.html#content">View</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/webview.html#content">WebView</a></li></ul></div><div class="nav-docs-section"><h3>apis</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/alertios.html#content">AlertIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/animation.html#content">Animation</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/appregistry.html#content">AppRegistry</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/appstateios.html#content">AppStateIOS</a>Line truncated
<span class="token punctuation">{</span>title<span class="token punctuation">:</span> <span class="token string">&#x27;Title&#x27;</span><span class="token punctuation">,</span> year<span class="token punctuation">:</span> <span class="token string">&#x27;2015&#x27;</span><span class="token punctuation">,</span> posters<span class="token punctuation">:</span> <span class="token punctuation">{</span>thumbnail<span class="token punctuation">:</span> <span class="token string">&#x27;http://i.imgur.com/UePbdph.jpg&#x27;</span><span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">]</span><span class="token punctuation">;</span></div><h3><a class="anchor" name="render-a-movie"></a>Render a movie <a class="hash-link" href="#render-a-movie">#</a></h3><p>We&#x27;re going to render the title, year, and thumbnail for the movie. Since we want to render an image, which is an Image component in React Native, add Image to the list of React requires above.</p><div class="prism language-javascript"><span class="token keyword">var</span> <span class="token punctuation">{</span>
AppRegistry<span class="token punctuation">,</span>
Image<span class="token punctuation">,</span>
@@ -29,7 +29,12 @@
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div><p>And lastly we need to apply this still to the Image component:</p><div class="prism language-javascript"> &lt;Image
source<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>uri<span class="token punctuation">:</span> movie<span class="token punctuation">.</span>posters<span class="token punctuation">.</span>thumbnail<span class="token punctuation">}</span><span class="token punctuation">}</span>
style<span class="token operator">=</span><span class="token punctuation">{</span>styles<span class="token punctuation">.</span>thumbnail<span class="token punctuation">}</span>
<span class="token operator">/</span><span class="token operator">&gt;</span></div><p>Press cmd+R and the image should now render.</p><p>Screenshot:</p><p>&lt;img src=&quot;https://github.com/facebook/react-native/raw/master/docs/images/TutorialMock.png&quot; alt=&quot;screenshot&quot; width=&quot;320px&quot; /&gt;</p><h3><a class="anchor" name="add-some-styling"></a>Add some styling <a class="hash-link" href="#add-some-styling">#</a></h3><p>Great, we&#x27;ve rendered our data, now let&#x27;s make it look better. I&#x27;d like to put the text to the right of the image and make the title larger and centered within that area:</p><div class="prism language-javascript"><span class="token operator">+-</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">+</span>
<span class="token operator">/</span><span class="token operator">&gt;</span></div><p>Press cmd+R and the image should now render.</p><span><div class="tutorial-mock">
<img src="/react-native/img/TutorialMock.png" />
</div>
</span><h3><a class="anchor" name="add-some-styling"></a>Add some styling <a class="hash-link" href="#add-some-styling">#</a></h3><p>Great, we&#x27;ve rendered our data, now let&#x27;s make it look better. I&#x27;d like to put the text to the right of the image and make the title larger and centered within that area:</p><div class="prism language-javascript"><span class="token operator">+-</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">+</span>
<span class="token operator">|</span><span class="token operator">+-</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">++</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">+</span><span class="token operator">|</span>
<span class="token operator">||</span> <span class="token operator">||</span> Title <span class="token operator">||</span>
<span class="token operator">||</span> Image <span class="token operator">||</span> <span class="token operator">||</span>
@@ -61,7 +66,11 @@
<span class="token punctuation">}</span><span class="token punctuation">,</span>
year<span class="token punctuation">:</span> <span class="token punctuation">{</span>
textAlign<span class="token punctuation">:</span> <span class="token string">&#x27;center&#x27;</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span></div><p>This is pretty straightforward if you&#x27;ve ever seen CSS before. Make the title larger, add some space below it, and center all of the text within their parent container (rightContainer).</p><p>Go ahead and press cmd+R and you&#x27;ll see the updated view.</p><p>Screenshot:</p><p>&lt;img src=&quot;https://github.com/facebook/react-native/raw/master/docs/images/TutorialStyledMock.png&quot; alt=&quot;screenshot&quot; width=&quot;320px&quot; /&gt;</p><h3><a class="anchor" name="fetching-real-data"></a>Fetching real data <a class="hash-link" href="#fetching-real-data">#</a></h3><p>Fetching data from Rotten Tomatoes&#x27;s API isn&#x27;t really relevant to learning React Native so feel free to breeze through this section.</p><p>Add the following constants to the top of the file (typically below the requires) to create the REQUEST_URL used to request data with.</p><div class="prism language-javascript"><span class="token keyword">var</span> API_KEY <span class="token operator">=</span> <span class="token string">&#x27;7waqfqbprs7pajbz28mqf6vz&#x27;</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span></div><p>This is pretty straightforward if you&#x27;ve ever seen CSS before. Make the title larger, add some space below it, and center all of the text within their parent container (rightContainer).</p><p>Go ahead and press cmd+R and you&#x27;ll see the updated view.</p><span><div class="tutorial-mock">
<img src="/react-native/img/TutorialStyledMock.png" />
</div>
</span><h3><a class="anchor" name="fetching-real-data"></a>Fetching real data <a class="hash-link" href="#fetching-real-data">#</a></h3><p>Fetching data from Rotten Tomatoes&#x27;s API isn&#x27;t really relevant to learning React Native so feel free to breeze through this section.</p><p>Add the following constants to the top of the file (typically below the requires) to create the REQUEST_URL used to request data with.</p><div class="prism language-javascript"><span class="token keyword">var</span> API_KEY <span class="token operator">=</span> <span class="token string">&#x27;7waqfqbprs7pajbz28mqf6vz&#x27;</span><span class="token punctuation">;</span>
<span class="token keyword">var</span> API_URL <span class="token operator">=</span> <span class="token string">&#x27;http://api.rottentomatoes.com/api/public/v1.0/lists/movies/in_theaters.json&#x27;</span><span class="token punctuation">;</span>
<span class="token keyword">var</span> PAGE_SIZE <span class="token operator">=</span> <span class="token number">25</span><span class="token punctuation">;</span>
<span class="token keyword">var</span> PARAMS <span class="token operator">=</span> <span class="token string">&#x27;?apikey=&#x27;</span> <span class="token operator">+</span> API_KEY <span class="token operator">+</span> <span class="token string">&#x27;&amp;page_limit=&#x27;</span> <span class="token operator">+</span> PAGE_SIZE<span class="token punctuation">;</span>
@@ -113,7 +122,11 @@ this.state.movies is no longer null.</p><div class="prism language-javascript">
&lt;<span class="token operator">/</span>View<span class="token operator">&gt;</span>
&lt;<span class="token operator">/</span>View<span class="token operator">&gt;</span>
<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span></div><p>Now press cmd+R and you should see &quot;Loading movies...&quot; until the response comes back, then it will render the first movie it fetched from Rotten Tomatoes.</p><p>Screenshot:</p><p>&lt;img src=&quot;https://github.com/facebook/react-native/raw/master/docs/images/TutorialSingleFetched.png&quot; alt=&quot;screenshot&quot; width=&quot;320px&quot; /&gt;</p><h2><a class="anchor" name="listview"></a>ListView <a class="hash-link" href="#listview">#</a></h2><p>Let’s now modify this application to render all of this data in a ListView, rather than just the first movie.</p><p>First thing&#x27;s first, add the ListView require to the top of the file.</p><div class="prism language-javascript"><span class="token keyword">var</span> <span class="token punctuation">{</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span></div><p>Now press cmd+R and you should see &quot;Loading movies...&quot; until the response comes back, then it will render the first movie it fetched from Rotten Tomatoes.</p><span><div class="tutorial-mock">
<img src="/react-native/img/TutorialSingleFetched.png" />
</div>
</span><h2><a class="anchor" name="listview"></a>ListView <a class="hash-link" href="#listview">#</a></h2><p>Let’s now modify this application to render all of this data in a ListView, rather than just the first movie.</p><p>Why is a ListView better than just rendering all of these elements or putting them in a ScrollView? Despite React being fast, rendering a possibly infinite list of elements could be slow. ListView schedules rendering of views so that you only display the ones on screen and those already rendered but off screen are removed from the hierarchy.</p><p>First thing&#x27;s first, add the ListView require to the top of the file.</p><div class="prism language-javascript"><span class="token keyword">var</span> <span class="token punctuation">{</span>
AppRegistry<span class="token punctuation">,</span>
Image<span class="token punctuation">,</span>
ListView<span class="token punctuation">,</span>
@@ -131,7 +144,7 @@ this.state.movies is no longer null.</p><div class="prism language-javascript">
renderRow<span class="token operator">=</span><span class="token punctuation">{</span><span class="token keyword">this</span><span class="token punctuation">.</span>renderMovie<span class="token punctuation">}</span>
<span class="token operator">/</span><span class="token operator">&gt;</span>
<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span></div><p>You&#x27;ll notice we added a dataSource that comes from this.state. We&#x27;ll now store the data there and then change this.state.movies === null to this.state.loaded === true to check if data has been loaded. Here&#x27;s what getInitialState looks like:</p><div class="prism language-javascript"> getInitialState<span class="token punctuation">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span></div><p>What is this dataSource thing and why do we use it? This way we can very cheaply know which rows have changed between updates.</p><p>You&#x27;ll notice we added dataSource from this.state. The next step is to add an empty dataSource to getInitialState. Also, now that we&#x27;re storing the data in dataSource, we should change this.state.movies to be this.state.loaded (boolean) so we aren&#x27;t storing the data twice.</p><div class="prism language-javascript"> getInitialState<span class="token punctuation">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token keyword">return</span> <span class="token punctuation">{</span>
dataSource<span class="token punctuation">:</span> <span class="token keyword">new</span> <span class="token class-name">ListView<span class="token punctuation">.</span>DataSource</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
rowHasChanged<span class="token punctuation">:</span> <span class="token punctuation">(</span>row1<span class="token punctuation">,</span> row2<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">&gt;</span> row1 <span class="token operator">!</span><span class="token operator">==</span> row2<span class="token punctuation">,</span>
@@ -148,7 +161,11 @@ this.state.movies is no longer null.</p><div class="prism language-javascript">
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">done<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span></div><p>Screenshot:</p><p>&lt;img src=&quot;https://github.com/facebook/react-native/raw/master/docs/images/TutorialFinal.png&quot; alt=&quot;screenshot&quot; width=&quot;320px&quot; /&gt;</p><h3><a class="anchor" name="final-source-code"></a>Final source code <a class="hash-link" href="#final-source-code">#</a></h3><div class="prism language-javascript"><span class="token comment" spellcheck="true">/**
<span class="token punctuation">}</span><span class="token punctuation">,</span></div><p>And here&#x27;s the final result:</p><span><div class="tutorial-mock">
<img src="/react-native/img/TutorialFinal.png" />
</div>
</span><p>There&#x27;s still some work to be done to make it a fully functional app such as adding navigation, search, infinite scroll loading, etc. Check the <a href="https://github.com/facebook/react-native/tree/master/Examples/Movies" target="_blank">Movies Example</a> to see it all working.</p><h3><a class="anchor" name="final-source-code"></a>Final source code <a class="hash-link" href="#final-source-code">#</a></h3><div class="prism language-javascript"><span class="token comment" spellcheck="true">/**
* Sample React Native App
* https://github.com/facebook/react-native
*/</span>