Deploy website

Deploy website version based on 7d1274aefa5444e36376f0a05787f6aba6ab2e5b

blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile">React Native: Bringing modern web techniques to mobile</a></h1><p class="post-meta">March 26, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener">Tom Occhino</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13947?v=3&amp;s=460"/></a></div></div></header><div><span><p>We introduced <a href="https://code.facebook.com/projects/176988925806765/react/">React</a> to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web projects at Facebook are commonly built using React in one form or another, and it's being broadly adopted across the industry. Engineers are choosing to use React every day because it enables them to spend more time focusing on their products and less time fighting with their framework. It wasn't until we'd been building with React for a while, though, that we started to understand what makes it so powerful.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile">React Native: Bringing modern web techniques to mobile</a></h1><p class="post-meta">March 26, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener">Tom Occhino</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13947?v=3&amp;s=460" alt="Tom Occhino"/></a></div></div></header><div><span><p>We introduced <a href="https://code.facebook.com/projects/176988925806765/react/">React</a> to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web projects at Facebook are commonly built using React in one form or another, and it's being broadly adopted across the industry. Engineers are choosing to use React every day because it enables them to spend more time focusing on their products and less time fighting with their framework. It wasn't until we'd been building with React for a while, though, that we started to understand what makes it so powerful.</p>
 <p>React forces us to break our applications down into discrete components, each representing a single view. These components make it easier to iterate on our products, since we don't need to keep the entire system in our head in order to make changes to one part of it. More important, though, React wraps the DOM's mutative, imperative API with a declarative one, which raises the level of abstraction and simplifies the programming model. What we've found is that when we build with React, our code is a lot more predictable. This predictability makes it so we can iterate more quickly with confidence, and our applications are a lot more reliable as a result. Additionally, it's not only easier to scale our applications when they're built with React, but we've found it's also easier to scale the size of our teams themselves.</p>
 <p>Together with the rapid iteration cycle of the web, we've been able to build some awesome products with React, including many components of Facebook.com. Additionally, we've built amazing frameworks in JavaScript on top of React, like <a href="https://facebook.github.io/react/blog/2015/02/20/introducing-relay-and-graphql.html">Relay</a>, which allows us to greatly simplify our data fetching at scale. Of course, web is only part of the story. Facebook also has widely used Android and iOS apps, which are built on top of disjointed, proprietary technology stacks. Having to build our apps on top of multiple platforms has bifurcated our engineering organization, but that's only one of the things that makes native mobile application development hard.</p>
 <footer>
@@ -38,7 +42,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/1014532261909640/react-native-bringing-modern-web-techniques-to-mobile/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native: Bringing modern web techniques to mobile" data-url="https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile" data-related="reactnative" data-via="tomocchino" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native: Bringing modern web techniques to mobile" data-url="https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile" data-related="reactnative" data-via="tomocchino" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile">React Native: Bringing modern web techniques to mobile</a></h1><p class="post-meta">March 26, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener">Tom Occhino</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13947?v=3&amp;s=460"/></a></div></div></header><div><span><p>We introduced <a href="https://code.facebook.com/projects/176988925806765/react/">React</a> to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web projects at Facebook are commonly built using React in one form or another, and it's being broadly adopted across the industry. Engineers are choosing to use React every day because it enables them to spend more time focusing on their products and less time fighting with their framework. It wasn't until we'd been building with React for a while, though, that we started to understand what makes it so powerful.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile">React Native: Bringing modern web techniques to mobile</a></h1><p class="post-meta">March 26, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener">Tom Occhino</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13947?v=3&amp;s=460" alt="Tom Occhino"/></a></div></div></header><div><span><p>We introduced <a href="https://code.facebook.com/projects/176988925806765/react/">React</a> to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web projects at Facebook are commonly built using React in one form or another, and it's being broadly adopted across the industry. Engineers are choosing to use React every day because it enables them to spend more time focusing on their products and less time fighting with their framework. It wasn't until we'd been building with React for a while, though, that we started to understand what makes it so powerful.</p>
 <p>React forces us to break our applications down into discrete components, each representing a single view. These components make it easier to iterate on our products, since we don't need to keep the entire system in our head in order to make changes to one part of it. More important, though, React wraps the DOM's mutative, imperative API with a declarative one, which raises the level of abstraction and simplifies the programming model. What we've found is that when we build with React, our code is a lot more predictable. This predictability makes it so we can iterate more quickly with confidence, and our applications are a lot more reliable as a result. Additionally, it's not only easier to scale our applications when they're built with React, but we've found it's also easier to scale the size of our teams themselves.</p>
 <p>Together with the rapid iteration cycle of the web, we've been able to build some awesome products with React, including many components of Facebook.com. Additionally, we've built amazing frameworks in JavaScript on top of React, like <a href="https://facebook.github.io/react/blog/2015/02/20/introducing-relay-and-graphql.html">Relay</a>, which allows us to greatly simplify our data fetching at scale. Of course, web is only part of the story. Facebook also has widely used Android and iOS apps, which are built on top of disjointed, proprietary technology stacks. Having to build our apps on top of multiple platforms has bifurcated our engineering organization, but that's only one of the things that makes native mobile application development hard.</p>
 <footer>
@@ -38,7 +42,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/1014532261909640/react-native-bringing-modern-web-techniques-to-mobile/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native: Bringing modern web techniques to mobile" data-url="https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile" data-related="reactnative" data-via="tomocchino" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native: Bringing modern web techniques to mobile" data-url="https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile" data-related="reactnative" data-via="tomocchino" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2015/09/14/react-native-for-android.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -37,7 +41,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/1189117404435352/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native for Android: How we built the first cross-platform React Native app" data-url="https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android" data-related="reactnative" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native for Android: How we built the first cross-platform React Native app" data-url="https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android" data-related="reactnative" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2015/09/14/react-native-for-android/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -37,7 +41,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/1189117404435352/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native for Android: How we built the first cross-platform React Native app" data-url="https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android" data-related="reactnative" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native for Android: How we built the first cross-platform React Native app" data-url="https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android" data-related="reactnative" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2015/11/23/making-react-native-apps-accessible.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/11/23/making-react-native-apps-accessible">Making React Native apps accessible</a></h1><p class="post-meta">November 23, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener">Georgiy Kassabli</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener"><img src="https://scontent-sea1-1.xx.fbcdn.net/v/t1.0-1/c0.0.160.160/p160x160/1978838_795592927136196_1205041943_n.jpg?_nc_log=1&amp;oh=d7a500fdece1250955a4d27b0a80fee2&amp;oe=59E8165A"/></a></div></div></header><div><span><p>With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vision loss or other disabilities. The Accessibility API for React and React Native enables you to make any React-powered experience usable by someone who may use assistive technology, like a screen reader for the blind and visually impaired.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/11/23/making-react-native-apps-accessible">Making React Native apps accessible</a></h1><p class="post-meta">November 23, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener">Georgiy Kassabli</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener"><img src="https://scontent-sea1-1.xx.fbcdn.net/v/t1.0-1/c0.0.160.160/p160x160/1978838_795592927136196_1205041943_n.jpg?_nc_log=1&amp;oh=d7a500fdece1250955a4d27b0a80fee2&amp;oe=59E8165A" alt="Georgiy Kassabli"/></a></div></div></header><div><span><p>With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vision loss or other disabilities. The Accessibility API for React and React Native enables you to make any React-powered experience usable by someone who may use assistive technology, like a screen reader for the blind and visually impaired.</p>
 <p>For this post, we're going to focus on React Native apps. We've designed the React Accessibility API to look and feel similar to the iOS and Android APIs. If you've developed accessible applications for the web, iOS, or Android before, you should feel comfortable with the framework and nomenclature of the React AX API. For instance, you can make a UI element <em>accessible</em> (therefore exposed to assistive technology) and use <em>accessibilityLabel</em> to provide a string description for the element:</p>
 <pre><code class="hljs">&lt;View accessible={<span class="hljs-literal">true</span>} <span class="hljs-attribute">accessibilityLabel</span>=”This is<span class="hljs-built_in"> simple </span>view”&gt;
 </code></pre>
@@ -40,7 +44,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/435862739941212/making-react-native-apps-accessible/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Making React Native apps accessible" data-url="https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible" data-related="reactnative" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Making React Native apps accessible" data-url="https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible" data-related="reactnative" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2015/11/23/making-react-native-apps-accessible/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/11/23/making-react-native-apps-accessible">Making React Native apps accessible</a></h1><p class="post-meta">November 23, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener">Georgiy Kassabli</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener"><img src="https://scontent-sea1-1.xx.fbcdn.net/v/t1.0-1/c0.0.160.160/p160x160/1978838_795592927136196_1205041943_n.jpg?_nc_log=1&amp;oh=d7a500fdece1250955a4d27b0a80fee2&amp;oe=59E8165A"/></a></div></div></header><div><span><p>With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vision loss or other disabilities. The Accessibility API for React and React Native enables you to make any React-powered experience usable by someone who may use assistive technology, like a screen reader for the blind and visually impaired.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/11/23/making-react-native-apps-accessible">Making React Native apps accessible</a></h1><p class="post-meta">November 23, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener">Georgiy Kassabli</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener"><img src="https://scontent-sea1-1.xx.fbcdn.net/v/t1.0-1/c0.0.160.160/p160x160/1978838_795592927136196_1205041943_n.jpg?_nc_log=1&amp;oh=d7a500fdece1250955a4d27b0a80fee2&amp;oe=59E8165A" alt="Georgiy Kassabli"/></a></div></div></header><div><span><p>With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vision loss or other disabilities. The Accessibility API for React and React Native enables you to make any React-powered experience usable by someone who may use assistive technology, like a screen reader for the blind and visually impaired.</p>
 <p>For this post, we're going to focus on React Native apps. We've designed the React Accessibility API to look and feel similar to the iOS and Android APIs. If you've developed accessible applications for the web, iOS, or Android before, you should feel comfortable with the framework and nomenclature of the React AX API. For instance, you can make a UI element <em>accessible</em> (therefore exposed to assistive technology) and use <em>accessibilityLabel</em> to provide a string description for the element:</p>
 <pre><code class="hljs">&lt;View accessible={<span class="hljs-literal">true</span>} <span class="hljs-attribute">accessibilityLabel</span>=”This is<span class="hljs-built_in"> simple </span>view”&gt;
 </code></pre>
@@ -40,7 +44,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/435862739941212/making-react-native-apps-accessible/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Making React Native apps accessible" data-url="https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible" data-related="reactnative" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Making React Native apps accessible" data-url="https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible" data-related="reactnative" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/03/24/introducing-hot-reloading.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/24/introducing-hot-reloading">Introducing Hot Reloading</a></h1><p class="post-meta">March 24, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener">Martín Bigio</a>Software Engineer at Instagram</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/535661?v=3&amp;s=128"/></a></div></div></header><div><span><p>React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grows.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/24/introducing-hot-reloading">Introducing Hot Reloading</a></h1><p class="post-meta">March 24, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener">Martín Bigio</a>Software Engineer at Instagram</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/535661?v=3&amp;s=128" alt="Martín Bigio"/></a></div></div></header><div><span><p>React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grows.</p>
 <p>We got close to this ideal via three main features:</p>
 <ul>
 <li>Use JavaScript as the language doesn't have a long compilation cycle time.</li>
@@ -168,7 +172,7 @@
 <h2><a class="anchor" aria-hidden="true" id="conclusion"></a><a href="#conclusion" 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>Conclusion</h2>
 <p>If you are interested in helping making hot reloading better, I encourage you to read <a href="https://medium.com/@dan_abramov/hot-reloading-in-react-1140438583bf#.jmivpvmz4">Dan Abramov's post around the future of hot reloading</a> and to contribute. For example, Johny Days is going to <a href="https://github.com/facebook/react-native/pull/6179">make it work with multiple connected clients</a>. We're relying on you all to maintain and improve this feature.</p>
 <p>With React Native, we have the opportunity to rethink the way we build apps in order to make it a great developer experience. Hot reloading is only one piece of the puzzle, what other crazy hacks can we do to make it better?</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Hot Reloading" data-url="https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading" data-related="reactnative" data-via="martinbigio" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Hot Reloading" data-url="https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading" data-related="reactnative" data-via="martinbigio" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/03/24/introducing-hot-reloading/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/24/introducing-hot-reloading">Introducing Hot Reloading</a></h1><p class="post-meta">March 24, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener">Martín Bigio</a>Software Engineer at Instagram</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/535661?v=3&amp;s=128"/></a></div></div></header><div><span><p>React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grows.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/24/introducing-hot-reloading">Introducing Hot Reloading</a></h1><p class="post-meta">March 24, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener">Martín Bigio</a>Software Engineer at Instagram</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/535661?v=3&amp;s=128" alt="Martín Bigio"/></a></div></div></header><div><span><p>React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grows.</p>
 <p>We got close to this ideal via three main features:</p>
 <ul>
 <li>Use JavaScript as the language doesn't have a long compilation cycle time.</li>
@@ -168,7 +172,7 @@
 <h2><a class="anchor" aria-hidden="true" id="conclusion"></a><a href="#conclusion" 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>Conclusion</h2>
 <p>If you are interested in helping making hot reloading better, I encourage you to read <a href="https://medium.com/@dan_abramov/hot-reloading-in-react-1140438583bf#.jmivpvmz4">Dan Abramov's post around the future of hot reloading</a> and to contribute. For example, Johny Days is going to <a href="https://github.com/facebook/react-native/pull/6179">make it work with multiple connected clients</a>. We're relying on you all to maintain and improve this feature.</p>
 <p>With React Native, we have the opportunity to rethink the way we build apps in order to make it a great developer experience. Hot reloading is only one piece of the puzzle, what other crazy hacks can we do to make it better?</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Hot Reloading" data-url="https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading" data-related="reactnative" data-via="martinbigio" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Hot Reloading" data-url="https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading" data-related="reactnative" data-via="martinbigio" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/03/28/dive-into-react-native-performance.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/28/dive-into-react-native-performance">Dive into React Native Performance</a></h1><p class="post-meta">March 28, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener">Pieter De Baets</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/5676?v=3&amp;s=460"/></a></div></div></header><div><span><p>React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across multiple platforms. You can ship faster and focus on details that really matter, making your app look and feel fantastic. Optimizing performance is a big part of this. Here is the story of how we made React Native app startup twice as fast.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/28/dive-into-react-native-performance">Dive into React Native Performance</a></h1><p class="post-meta">March 28, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener">Pieter De Baets</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/5676?v=3&amp;s=460" alt="Pieter De Baets"/></a></div></div></header><div><span><p>React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across multiple platforms. You can ship faster and focus on details that really matter, making your app look and feel fantastic. Optimizing performance is a big part of this. Here is the story of how we made React Native app startup twice as fast.</p>
 <h2><a class="anchor" aria-hidden="true" id="why-the-hurry"></a><a href="#why-the-hurry" 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>Why the hurry?</h2>
 <p>With an app that runs faster, content loads quickly, which means people get more time to interact with it, and smooth animations make the app enjoyable to use. In emerging markets, where <a href="https://code.facebook.com/posts/952628711437136/classes-performance-and-network-segmentation-on-android/">2011 class phones</a> on <a href="https://newsroom.fb.com/news/2015/10/news-feed-fyi-building-for-all-connectivity/">2G networks</a> are the majority, a focus on performance can make the difference between an app that is usable and one that isn't.</p>
 <p>Since releasing React Native on <a href="https://facebook.github.io/react/blog/2015/03/26/introducing-react-native.html">iOS</a> and on <a href="https://code.facebook.com/posts/1189117404435352/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/">Android</a>, we have been improving list view scrolling performance, memory efficiency, UI responsiveness, and app startup time. Startup sets the first impression of an app and stresses all parts of the framework, so it is the most rewarding and challenging problem to tackle.</p>
@@ -39,7 +43,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/895897210527114/dive-into-react-native-performance/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Dive into React Native Performance" data-url="https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance" data-related="reactnative" data-via="javache" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Dive into React Native Performance" data-url="https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance" data-related="reactnative" data-via="javache" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/03/28/dive-into-react-native-performance/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/28/dive-into-react-native-performance">Dive into React Native Performance</a></h1><p class="post-meta">March 28, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener">Pieter De Baets</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/5676?v=3&amp;s=460"/></a></div></div></header><div><span><p>React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across multiple platforms. You can ship faster and focus on details that really matter, making your app look and feel fantastic. Optimizing performance is a big part of this. Here is the story of how we made React Native app startup twice as fast.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/28/dive-into-react-native-performance">Dive into React Native Performance</a></h1><p class="post-meta">March 28, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener">Pieter De Baets</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/5676?v=3&amp;s=460" alt="Pieter De Baets"/></a></div></div></header><div><span><p>React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across multiple platforms. You can ship faster and focus on details that really matter, making your app look and feel fantastic. Optimizing performance is a big part of this. Here is the story of how we made React Native app startup twice as fast.</p>
 <h2><a class="anchor" aria-hidden="true" id="why-the-hurry"></a><a href="#why-the-hurry" 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>Why the hurry?</h2>
 <p>With an app that runs faster, content loads quickly, which means people get more time to interact with it, and smooth animations make the app enjoyable to use. In emerging markets, where <a href="https://code.facebook.com/posts/952628711437136/classes-performance-and-network-segmentation-on-android/">2011 class phones</a> on <a href="https://newsroom.fb.com/news/2015/10/news-feed-fyi-building-for-all-connectivity/">2G networks</a> are the majority, a focus on performance can make the difference between an app that is usable and one that isn't.</p>
 <p>Since releasing React Native on <a href="https://facebook.github.io/react/blog/2015/03/26/introducing-react-native.html">iOS</a> and on <a href="https://code.facebook.com/posts/1189117404435352/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/">Android</a>, we have been improving list view scrolling performance, memory efficiency, UI responsiveness, and app startup time. Startup sets the first impression of an app and stresses all parts of the framework, so it is the most rewarding and challenging problem to tackle.</p>
@@ -39,7 +43,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/895897210527114/dive-into-react-native-performance/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Dive into React Native Performance" data-url="https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance" data-related="reactnative" data-via="javache" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Dive into React Native Performance" data-url="https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance" data-related="reactnative" data-via="javache" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/04/13/react-native-a-year-in-review.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/04/13/react-native-a-year-in-review">React Native: A year in review</a></h1><p class="post-meta">April 13, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener">Martin Konicek</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/346214?v=3&amp;s=460"/></a></div></div></header><div><span><p>It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing <a href="http://microsoft.github.io/code-push/articles/ReactNativeWindows.html">React Native to the Windows ecosystem</a>, giving developers the potential to build React Native on Windows PC, Phone, and Xbox. It will also provide open source tools and services such as a React Native extension for Visual Studio Code and CodePush to help developers create React Native apps on the Windows platform. In addition, <a href="https://www.tizen.org/blogs">Samsung</a> is building React Native for its hybrid platform, which will empower developers to build apps for millions of SmartTVs and mobile and wearable devices. We also released the <a href="https://github.com/facebook/react-native-fbsdk">Facebook SDK for React Native</a>, which makes it easier for developers to incorporate Facebook social features like Login, Sharing, App Analytics, and Graph APIs into their apps. In one year, React Native has changed the way developers build on every major platform.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/04/13/react-native-a-year-in-review">React Native: A year in review</a></h1><p class="post-meta">April 13, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener">Martin Konicek</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/346214?v=3&amp;s=460" alt="Martin Konicek"/></a></div></div></header><div><span><p>It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing <a href="http://microsoft.github.io/code-push/articles/ReactNativeWindows.html">React Native to the Windows ecosystem</a>, giving developers the potential to build React Native on Windows PC, Phone, and Xbox. It will also provide open source tools and services such as a React Native extension for Visual Studio Code and CodePush to help developers create React Native apps on the Windows platform. In addition, <a href="https://www.tizen.org/blogs">Samsung</a> is building React Native for its hybrid platform, which will empower developers to build apps for millions of SmartTVs and mobile and wearable devices. We also released the <a href="https://github.com/facebook/react-native-fbsdk">Facebook SDK for React Native</a>, which makes it easier for developers to incorporate Facebook social features like Login, Sharing, App Analytics, and Graph APIs into their apps. In one year, React Native has changed the way developers build on every major platform.</p>
 <p>It's been an epic ride — but we are only getting started. Here is a look back at how React Native has grown and evolved since we open-sourced it a year ago, some challenges we faced along the way, and what we expect as we look ahead to the future.</p>
 <footer>
   <a href="https://code.facebook.com/posts/597378980427792/react-native-a-year-in-review/" class="btn">Read more</a>
@@ -37,7 +41,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/597378980427792/react-native-a-year-in-review/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native: A year in review" data-url="https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review" data-related="reactnative" data-via="martinkonicek" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native: A year in review" data-url="https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review" data-related="reactnative" data-via="martinkonicek" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/04/13/react-native-a-year-in-review/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/04/13/react-native-a-year-in-review">React Native: A year in review</a></h1><p class="post-meta">April 13, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener">Martin Konicek</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/346214?v=3&amp;s=460"/></a></div></div></header><div><span><p>It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing <a href="http://microsoft.github.io/code-push/articles/ReactNativeWindows.html">React Native to the Windows ecosystem</a>, giving developers the potential to build React Native on Windows PC, Phone, and Xbox. It will also provide open source tools and services such as a React Native extension for Visual Studio Code and CodePush to help developers create React Native apps on the Windows platform. In addition, <a href="https://www.tizen.org/blogs">Samsung</a> is building React Native for its hybrid platform, which will empower developers to build apps for millions of SmartTVs and mobile and wearable devices. We also released the <a href="https://github.com/facebook/react-native-fbsdk">Facebook SDK for React Native</a>, which makes it easier for developers to incorporate Facebook social features like Login, Sharing, App Analytics, and Graph APIs into their apps. In one year, React Native has changed the way developers build on every major platform.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/04/13/react-native-a-year-in-review">React Native: A year in review</a></h1><p class="post-meta">April 13, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener">Martin Konicek</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/346214?v=3&amp;s=460" alt="Martin Konicek"/></a></div></div></header><div><span><p>It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing <a href="http://microsoft.github.io/code-push/articles/ReactNativeWindows.html">React Native to the Windows ecosystem</a>, giving developers the potential to build React Native on Windows PC, Phone, and Xbox. It will also provide open source tools and services such as a React Native extension for Visual Studio Code and CodePush to help developers create React Native apps on the Windows platform. In addition, <a href="https://www.tizen.org/blogs">Samsung</a> is building React Native for its hybrid platform, which will empower developers to build apps for millions of SmartTVs and mobile and wearable devices. We also released the <a href="https://github.com/facebook/react-native-fbsdk">Facebook SDK for React Native</a>, which makes it easier for developers to incorporate Facebook social features like Login, Sharing, App Analytics, and Graph APIs into their apps. In one year, React Native has changed the way developers build on every major platform.</p>
 <p>It's been an epic ride — but we are only getting started. Here is a look back at how React Native has grown and evolved since we open-sourced it a year ago, some challenges we faced along the way, and what we expect as we look ahead to the future.</p>
 <footer>
   <a href="https://code.facebook.com/posts/597378980427792/react-native-a-year-in-review/" class="btn">Read more</a>
@@ -37,7 +41,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/597378980427792/react-native-a-year-in-review/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native: A year in review" data-url="https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review" data-related="reactnative" data-via="martinkonicek" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native: A year in review" data-url="https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review" data-related="reactnative" data-via="martinkonicek" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/07/06/toward-better-documentation.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/07/06/toward-better-documentation">Toward Better Documentation</a></h1><p class="post-meta">July 6, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener">Kevin Lacker</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener"><img src="http://www.gravatar.com/avatar/9b790592be15d4f55a5ed7abb5103304?s=128"/></a></div></div></header><div><span><p>Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better based on your feedback, and we wanted to share some of the improvements we've made.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/07/06/toward-better-documentation">Toward Better Documentation</a></h1><p class="post-meta">July 6, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener">Kevin Lacker</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener"><img src="http://www.gravatar.com/avatar/9b790592be15d4f55a5ed7abb5103304?s=128" alt="Kevin Lacker"/></a></div></div></header><div><span><p>Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better based on your feedback, and we wanted to share some of the improvements we've made.</p>
 <h2><a class="anchor" aria-hidden="true" id="inline-examples"></a><a href="#inline-examples" 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>Inline Examples</h2>
 <p>When you learn a new library, a new programming language, or a new framework, there's a beautiful moment when you first write a bit of code, try it out, see if it works... and it <em>does</em> work. You created something real. We wanted to put that visceral experience right into our docs. Like this:</p>
 <div class="web-player"><pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { Component } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
@@ -69,7 +73,7 @@ AppRegistry.registerComponent(<span class="hljs-string">'ScratchPad'</span>, ()
 <p>If you find a mistake in the documentation, like inaccurate descriptions or code that doesn't actually work, <a href="https://github.com/facebook/react-native/issues">file an issue</a>. Tag it with &quot;Documentation&quot;, so that it's easier to route it to the right people.</p>
 <p>If there isn't a specific mistake, but something in the documentation is fundamentally confusing, it's not a great fit for a GitHub issue. Instead, post on <a href="https://react-native.canny.io/feature-requests">Canny</a> about the area of the docs that could use help. This helps us prioritize when we are doing more general work like guide-writing.</p>
 <p>Thanks for reading this far, and thanks for using React Native!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Toward Better Documentation" data-url="https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation" data-related="reactnative" data-via="lacker" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Toward Better Documentation" data-url="https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation" data-related="reactnative" data-via="lacker" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/07/06/toward-better-documentation/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/07/06/toward-better-documentation">Toward Better Documentation</a></h1><p class="post-meta">July 6, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener">Kevin Lacker</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener"><img src="http://www.gravatar.com/avatar/9b790592be15d4f55a5ed7abb5103304?s=128"/></a></div></div></header><div><span><p>Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better based on your feedback, and we wanted to share some of the improvements we've made.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/07/06/toward-better-documentation">Toward Better Documentation</a></h1><p class="post-meta">July 6, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener">Kevin Lacker</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener"><img src="http://www.gravatar.com/avatar/9b790592be15d4f55a5ed7abb5103304?s=128" alt="Kevin Lacker"/></a></div></div></header><div><span><p>Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better based on your feedback, and we wanted to share some of the improvements we've made.</p>
 <h2><a class="anchor" aria-hidden="true" id="inline-examples"></a><a href="#inline-examples" 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>Inline Examples</h2>
 <p>When you learn a new library, a new programming language, or a new framework, there's a beautiful moment when you first write a bit of code, try it out, see if it works... and it <em>does</em> work. You created something real. We wanted to put that visceral experience right into our docs. Like this:</p>
 <div class="web-player"><pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { Component } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
@@ -69,7 +73,7 @@ AppRegistry.registerComponent(<span class="hljs-string">'ScratchPad'</span>, ()
 <p>If you find a mistake in the documentation, like inaccurate descriptions or code that doesn't actually work, <a href="https://github.com/facebook/react-native/issues">file an issue</a>. Tag it with &quot;Documentation&quot;, so that it's easier to route it to the right people.</p>
 <p>If there isn't a specific mistake, but something in the documentation is fundamentally confusing, it's not a great fit for a GitHub issue. Instead, post on <a href="https://react-native.canny.io/feature-requests">Canny</a> about the area of the docs that could use help. This helps us prioritize when we are doing more general work like guide-writing.</p>
 <p>Thanks for reading this far, and thanks for using React Native!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Toward Better Documentation" data-url="https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation" data-related="reactnative" data-via="lacker" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Toward Better Documentation" data-url="https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation" data-related="reactnative" data-via="lacker" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/08/12/react-native-meetup-san-francisco.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/12/react-native-meetup-san-francisco">San Francisco Meetup Recap</a></h1><p class="post-meta">August 12, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><div><span><p>Last week I had the opportunity to attend the <a href="http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854">React Native Meetup</a> at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/12/react-native-meetup-san-francisco">San Francisco Meetup Recap</a></h1><p class="post-meta">August 12, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><div><span><p>Last week I had the opportunity to attend the <a href="http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854">React Native Meetup</a> at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native.</p>
 <p><img src="/react-native/blog/assets/rnmsf-august-2016-hero.jpg" alt=""></p>
 <p>I was particularly interested in learning more about how React and React Native are used at companies like Zynga, Netflix, and Airbnb. The agenda for the night would be as follows:</p>
 <ul>
@@ -99,7 +103,7 @@
 </ul>
 <p><img src="/react-native/blog/assets/rnmsf-august-2016-docs.jpg" alt=""></p>
 <p>Meetups provide a good opportunity to meet and learn from other developers in the community. I'm looking forward to attending more React Native meetups in the future. If you make it up to one of these, please look out for me and let me know how we can make React Native work better for you!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="San Francisco Meetup Recap" data-url="https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco" data-related="reactnative" data-via="hectorramos" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="San Francisco Meetup Recap" data-url="https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco" data-related="reactnative" data-via="hectorramos" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/08/12/react-native-meetup-san-francisco/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/12/react-native-meetup-san-francisco">San Francisco Meetup Recap</a></h1><p class="post-meta">August 12, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><div><span><p>Last week I had the opportunity to attend the <a href="http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854">React Native Meetup</a> at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/12/react-native-meetup-san-francisco">San Francisco Meetup Recap</a></h1><p class="post-meta">August 12, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><div><span><p>Last week I had the opportunity to attend the <a href="http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854">React Native Meetup</a> at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native.</p>
 <p><img src="/react-native/blog/assets/rnmsf-august-2016-hero.jpg" alt=""></p>
 <p>I was particularly interested in learning more about how React and React Native are used at companies like Zynga, Netflix, and Airbnb. The agenda for the night would be as follows:</p>
 <ul>
@@ -99,7 +103,7 @@
 </ul>
 <p><img src="/react-native/blog/assets/rnmsf-august-2016-docs.jpg" alt=""></p>
 <p>Meetups provide a good opportunity to meet and learn from other developers in the community. I'm looking forward to attending more React Native meetups in the future. If you make it up to one of these, please look out for me and let me know how we can make React Native work better for you!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="San Francisco Meetup Recap" data-url="https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco" data-related="reactnative" data-via="hectorramos" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="San Francisco Meetup Recap" data-url="https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco" data-related="reactnative" data-via="hectorramos" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/08/19/right-to-left-support-for-react-native-apps.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps">Right-to-Left Layout Support For React Native Apps</a></h1><p class="post-meta">August 19, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener">Mengjue (Mandy) Wang</a>Software Engineer Intern at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13987140?v=3&amp;s=128"/></a></div></div></header><div><span><p>After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is necessary.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps">Right-to-Left Layout Support For React Native Apps</a></h1><p class="post-meta">August 19, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener">Mengjue (Mandy) Wang</a>Software Engineer Intern at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13987140?v=3&amp;s=128" alt="Mengjue (Mandy) Wang"/></a></div></div></header><div><span><p>After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is necessary.</p>
 <p>We're glad to announce that React Native has been improved to support RTL layouts. This is now available in the <a href="https://github.com/facebook/react-native">react-native</a> master branch today, and will be available in the next RC: <a href="https://github.com/facebook/react-native/releases"><code>v0.33.0-rc</code></a>.</p>
 <p>This involved changing <a href="https://github.com/facebook/css-layout">css-layout</a>, the core layout engine used by RN, and RN core implementation, as well as specific OSS JS components to support RTL.</p>
 <p>To battle test the RTL support in production, the latest version of the <strong>Facebook Ads Manager</strong> app (the first cross-platform 100% RN app) is now available in Arabic and Hebrew with RTL layouts for both <a href="https://itunes.apple.com/app/id964397083">iOS</a> and <a href="https://play.google.com/store/apps/details?id=com.facebook.adsmanager">Android</a>. Here is how it looks like in those RTL languages:</p>
@@ -60,11 +64,11 @@
 </ul></li>
 <li><p>Allow RTL layout for your app by calling the <code>allowRTL()</code> function at the beginning of native code. We provided this utility to only apply to an RTL layout when your app is ready. Here is an example:</p>
 <p>iOS:</p>
-<pre><code class="hljs css languages- objc"><span class="hljs-comment">// in AppDelegate.m</span>
+<pre><code class="hljs css language-objc"><span class="hljs-comment">// in AppDelegate.m</span>
      [[RCTI18nUtil sharedInstance] allowRTL:<span class="hljs-literal">YES</span>];
 </code></pre>
 <p>Android:</p>
-<pre><code class="hljs css languages- java"><span class="hljs-comment">// in MainActivity.java</span>
+<pre><code class="hljs css language-java"><span class="hljs-comment">// in MainActivity.java</span>
      I18nUtil sharedI18nUtilInstance = I18nUtil.getInstance();
      sharedI18nUtilInstance.allowRTL(context, <span class="hljs-keyword">true</span>);
 </code></pre></li>
@@ -95,13 +99,13 @@
 <p>Here are two ways to flip the icon according to the direction:</p>
 <ul>
 <li><p>Adding a <code>transform</code> style to the image component:</p>
-<pre><code class="hljs css languages- javascript">&lt;Image
+<pre><code class="hljs css language-javascript">&lt;Image
   source={...}
   style={{<span class="hljs-attr">transform</span>: [{<span class="hljs-attr">scaleX</span>: I18nManager.isRTL ? <span class="hljs-number">-1</span> : <span class="hljs-number">1</span>}]}}
 /&gt;
 </code></pre></li>
 <li><p>Or, changing the image source according to the direction:</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">let</span> imageSource = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./back.png'</span>);
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">let</span> imageSource = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./back.png'</span>);
 <span class="hljs-keyword">if</span> (I18nManager.isRTL) {
   imageSource = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./forward.png'</span>);
 }
@@ -116,7 +120,7 @@
   <img src="/react-native/blog/assets/rtl-demo-swipe-rtl.png" width="280" style="margin:10px">
 </p>
 <h5><a class="anchor" aria-hidden="true" id="gestures-example"></a><a href="#gestures-example" 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>Gestures Example</h5>
-<pre><code class="hljs css languages- js"><span class="hljs-comment">// SwipeableRow.js</span>
+<pre><code class="hljs css language-js"><span class="hljs-comment">// SwipeableRow.js</span>
 _isSwipingExcessivelyRightFromClosedPosition(gestureState: <span class="hljs-built_in">Object</span>): boolean {
   <span class="hljs-comment">// ...</span>
   <span class="hljs-keyword">const</span> gestureStateDx = IS_RTL ? -gestureState.dx : gestureState.dx;
@@ -127,7 +131,7 @@ _isSwipingExcessivelyRightFromClosedPosition(gestureState: <span class="hljs-bui
 },
 </code></pre>
 <h5><a class="anchor" aria-hidden="true" id="animation-example"></a><a href="#animation-example" 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>Animation Example</h5>
-<pre><code class="hljs css languages- js"><span class="hljs-comment">// SwipeableRow.js</span>
+<pre><code class="hljs css language-js"><span class="hljs-comment">// SwipeableRow.js</span>
 _animateBounceBack(duration: number): <span class="hljs-keyword">void</span> {
   <span class="hljs-comment">// ...</span>
   <span class="hljs-keyword">const</span> swipeBounceBackDistance = IS_RTL ?
@@ -145,7 +149,7 @@ _animateBounceBack(duration: number): <span class="hljs-keyword">void</span> {
 <p align="center">
   <img src="/react-native/blog/assets/rtl-demo-forcertl.png" width="300">
 </p>
-<pre><code class="hljs css languages- js">&lt;RNTesterBlock title={<span class="hljs-string">'Quickly Test RTL Layout'</span>}&gt;
+<pre><code class="hljs css language-js">&lt;RNTesterBlock title={<span class="hljs-string">'Quickly Test RTL Layout'</span>}&gt;
   <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.flexDirectionRow}</span>&gt;</span>
     <span class="hljs-tag">&lt;<span class="hljs-name">Text</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.switchRowTextView}</span>&gt;</span>forceRTL<span class="hljs-tag">&lt;/<span class="hljs-name">Text</span>&gt;</span>
     <span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.switchRowSwitchView}</span>&gt;</span>
@@ -188,7 +192,7 @@ _onDirectionChange = <span class="hljs-function"><span class="hljs-params">()</s
 <h2><a class="anchor" aria-hidden="true" id="try-it-out"></a><a href="#try-it-out" 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>Try it Out!</h2>
 <p>Check out the <a href="https://github.com/facebook/react-native/blob/master/RNTester/js/RTLExample.js"><code>RTLExample</code></a> in the <code>RNTester</code> to understand more about RTL support, and let us know how it works for you!</p>
 <p>Finally, thank you for reading! We hope that the RTL support for React Native helps you grow your apps for international audience!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Right-to-Left Layout Support For React Native Apps" data-url="https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps" data-related="reactnative" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Right-to-Left Layout Support For React Native Apps" data-url="https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps" data-related="reactnative" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/08/19/right-to-left-support-for-react-native-apps/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps">Right-to-Left Layout Support For React Native Apps</a></h1><p class="post-meta">August 19, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener">Mengjue (Mandy) Wang</a>Software Engineer Intern at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13987140?v=3&amp;s=128"/></a></div></div></header><div><span><p>After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is necessary.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps">Right-to-Left Layout Support For React Native Apps</a></h1><p class="post-meta">August 19, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener">Mengjue (Mandy) Wang</a>Software Engineer Intern at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13987140?v=3&amp;s=128" alt="Mengjue (Mandy) Wang"/></a></div></div></header><div><span><p>After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is necessary.</p>
 <p>We're glad to announce that React Native has been improved to support RTL layouts. This is now available in the <a href="https://github.com/facebook/react-native">react-native</a> master branch today, and will be available in the next RC: <a href="https://github.com/facebook/react-native/releases"><code>v0.33.0-rc</code></a>.</p>
 <p>This involved changing <a href="https://github.com/facebook/css-layout">css-layout</a>, the core layout engine used by RN, and RN core implementation, as well as specific OSS JS components to support RTL.</p>
 <p>To battle test the RTL support in production, the latest version of the <strong>Facebook Ads Manager</strong> app (the first cross-platform 100% RN app) is now available in Arabic and Hebrew with RTL layouts for both <a href="https://itunes.apple.com/app/id964397083">iOS</a> and <a href="https://play.google.com/store/apps/details?id=com.facebook.adsmanager">Android</a>. Here is how it looks like in those RTL languages:</p>
@@ -60,11 +64,11 @@
 </ul></li>
 <li><p>Allow RTL layout for your app by calling the <code>allowRTL()</code> function at the beginning of native code. We provided this utility to only apply to an RTL layout when your app is ready. Here is an example:</p>
 <p>iOS:</p>
-<pre><code class="hljs css languages- objc"><span class="hljs-comment">// in AppDelegate.m</span>
+<pre><code class="hljs css language-objc"><span class="hljs-comment">// in AppDelegate.m</span>
      [[RCTI18nUtil sharedInstance] allowRTL:<span class="hljs-literal">YES</span>];
 </code></pre>
 <p>Android:</p>
-<pre><code class="hljs css languages- java"><span class="hljs-comment">// in MainActivity.java</span>
+<pre><code class="hljs css language-java"><span class="hljs-comment">// in MainActivity.java</span>
      I18nUtil sharedI18nUtilInstance = I18nUtil.getInstance();
      sharedI18nUtilInstance.allowRTL(context, <span class="hljs-keyword">true</span>);
 </code></pre></li>
@@ -95,13 +99,13 @@
 <p>Here are two ways to flip the icon according to the direction:</p>
 <ul>
 <li><p>Adding a <code>transform</code> style to the image component:</p>
-<pre><code class="hljs css languages- javascript">&lt;Image
+<pre><code class="hljs css language-javascript">&lt;Image
   source={...}
   style={{<span class="hljs-attr">transform</span>: [{<span class="hljs-attr">scaleX</span>: I18nManager.isRTL ? <span class="hljs-number">-1</span> : <span class="hljs-number">1</span>}]}}
 /&gt;
 </code></pre></li>
 <li><p>Or, changing the image source according to the direction:</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">let</span> imageSource = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./back.png'</span>);
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">let</span> imageSource = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./back.png'</span>);
 <span class="hljs-keyword">if</span> (I18nManager.isRTL) {
   imageSource = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./forward.png'</span>);
 }
@@ -116,7 +120,7 @@
   <img src="/react-native/blog/assets/rtl-demo-swipe-rtl.png" width="280" style="margin:10px">
 </p>
 <h5><a class="anchor" aria-hidden="true" id="gestures-example"></a><a href="#gestures-example" 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>Gestures Example</h5>
-<pre><code class="hljs css languages- js"><span class="hljs-comment">// SwipeableRow.js</span>
+<pre><code class="hljs css language-js"><span class="hljs-comment">// SwipeableRow.js</span>
 _isSwipingExcessivelyRightFromClosedPosition(gestureState: <span class="hljs-built_in">Object</span>): boolean {
   <span class="hljs-comment">// ...</span>
   <span class="hljs-keyword">const</span> gestureStateDx = IS_RTL ? -gestureState.dx : gestureState.dx;
@@ -127,7 +131,7 @@ _isSwipingExcessivelyRightFromClosedPosition(gestureState: <span class="hljs-bui
 },
 </code></pre>
 <h5><a class="anchor" aria-hidden="true" id="animation-example"></a><a href="#animation-example" 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>Animation Example</h5>
-<pre><code class="hljs css languages- js"><span class="hljs-comment">// SwipeableRow.js</span>
+<pre><code class="hljs css language-js"><span class="hljs-comment">// SwipeableRow.js</span>
 _animateBounceBack(duration: number): <span class="hljs-keyword">void</span> {
   <span class="hljs-comment">// ...</span>
   <span class="hljs-keyword">const</span> swipeBounceBackDistance = IS_RTL ?
@@ -145,7 +149,7 @@ _animateBounceBack(duration: number): <span class="hljs-keyword">void</span> {
 <p align="center">
   <img src="/react-native/blog/assets/rtl-demo-forcertl.png" width="300">
 </p>
-<pre><code class="hljs css languages- js">&lt;RNTesterBlock title={<span class="hljs-string">'Quickly Test RTL Layout'</span>}&gt;
+<pre><code class="hljs css language-js">&lt;RNTesterBlock title={<span class="hljs-string">'Quickly Test RTL Layout'</span>}&gt;
   <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.flexDirectionRow}</span>&gt;</span>
     <span class="hljs-tag">&lt;<span class="hljs-name">Text</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.switchRowTextView}</span>&gt;</span>forceRTL<span class="hljs-tag">&lt;/<span class="hljs-name">Text</span>&gt;</span>
     <span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.switchRowSwitchView}</span>&gt;</span>
@@ -188,7 +192,7 @@ _onDirectionChange = <span class="hljs-function"><span class="hljs-params">()</s
 <h2><a class="anchor" aria-hidden="true" id="try-it-out"></a><a href="#try-it-out" 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>Try it Out!</h2>
 <p>Check out the <a href="https://github.com/facebook/react-native/blob/master/RNTester/js/RTLExample.js"><code>RTLExample</code></a> in the <code>RNTester</code> to understand more about RTL support, and let us know how it works for you!</p>
 <p>Finally, thank you for reading! We hope that the RTL support for React Native helps you grow your apps for international audience!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Right-to-Left Layout Support For React Native Apps" data-url="https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps" data-related="reactnative" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Right-to-Left Layout Support For React Native Apps" data-url="https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps" data-related="reactnative" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/09/08/exponent-talks-unraveling-navigation.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,8 +33,8 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation">Expo Talks: Adam on Unraveling Navigation</a></h1><p class="post-meta">September 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><div><span><p><a href="https://twitter.com/skevy">Adam Miskiewicz</a> from <a href="https://expo.io/">Expo</a> talks about mobile navigation and the <a href="https://github.com/exponent/ex-navigation"><code>ex-navigation</code></a> React Native library at Expo's office hours last week.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Expo Talks: Adam on Unraveling Navigation" data-url="https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation" data-related="reactnative" data-via="hectorramos" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation">Expo Talks: Adam on Unraveling Navigation</a></h1><p class="post-meta">September 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><div><span><p><a href="https://twitter.com/skevy">Adam Miskiewicz</a> from <a href="https://expo.io/">Expo</a> talks about mobile navigation and the <a href="https://github.com/exponent/ex-navigation"><code>ex-navigation</code></a> React Native library at Expo's office hours last week.</p>
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Expo Talks: Adam on Unraveling Navigation" data-url="https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation" data-related="reactnative" data-via="hectorramos" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/09/08/exponent-talks-unraveling-navigation/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,8 +33,8 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation">Expo Talks: Adam on Unraveling Navigation</a></h1><p class="post-meta">September 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><div><span><p><a href="https://twitter.com/skevy">Adam Miskiewicz</a> from <a href="https://expo.io/">Expo</a> talks about mobile navigation and the <a href="https://github.com/exponent/ex-navigation"><code>ex-navigation</code></a> React Native library at Expo's office hours last week.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Expo Talks: Adam on Unraveling Navigation" data-url="https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation" data-related="reactnative" data-via="hectorramos" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation">Expo Talks: Adam on Unraveling Navigation</a></h1><p class="post-meta">September 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><div><span><p><a href="https://twitter.com/skevy">Adam Miskiewicz</a> from <a href="https://expo.io/">Expo</a> talks about mobile navigation and the <a href="https://github.com/exponent/ex-navigation"><code>ex-navigation</code></a> React Native library at Expo's office hours last week.</p>
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Expo Talks: Adam on Unraveling Navigation" data-url="https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation" data-related="reactnative" data-via="hectorramos" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/10/25/0.36-headless-js-the-keyboard-api-and-more.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,21 +33,21 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/10/25/0">0.36: Headless JS, the Keyboard API, &amp; more</a></h1><p class="post-meta">October 25, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><div><span><p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">React Native 0.36</a>. Read on to learn more about what's new.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/10/25/0">0.36: Headless JS, the Keyboard API, &amp; more</a></h1><p class="post-meta">October 25, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><div><span><p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">React Native 0.36</a>. Read on to learn more about what's new.</p>
 <h2><a class="anchor" aria-hidden="true" id="headless-js"></a><a href="#headless-js" 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>Headless JS</h2>
 <p>Headless JS is a way to run tasks in JavaScript while your app is in the background. It can be used, for example, to sync fresh data, handle push notifications, or play music. It is only available on Android, for now.</p>
 <p>To get started, define your async task in a dedicated file (e.g. <code>SomeTaskName.js</code>):</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-built_in">module</span>.exports = <span class="hljs-keyword">async</span> (taskData) =&gt; {
+<pre><code class="hljs css language-javascript"><span class="hljs-built_in">module</span>.exports = <span class="hljs-keyword">async</span> (taskData) =&gt; {
   <span class="hljs-comment">// Perform your task here.</span>
 };
 </code></pre>
 <p>Next, register your task in on <code>AppRegistry</code>:</p>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerHeadlessTask(<span class="hljs-string">'SomeTaskName'</span>, () =&gt; <span class="hljs-built_in">require</span>(<span class="hljs-string">'SomeTaskName'</span>));
+<pre><code class="hljs css language-javascript">AppRegistry.registerHeadlessTask(<span class="hljs-string">'SomeTaskName'</span>, () =&gt; <span class="hljs-built_in">require</span>(<span class="hljs-string">'SomeTaskName'</span>));
 </code></pre>
 <p>Using Headless JS does require some native Java code to be written in order to allow you to start up the service when needed. Take a look at our new <a href="/react-native/headless-js-android.md">Headless JS docs</a> to learn more!</p>
 <h2><a class="anchor" aria-hidden="true" id="the-keyboard-api"></a><a href="#the-keyboard-api" 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 Keyboard API</h2>
 <p>Working with the on-screen keyboard is now easier with <a href="/react-native/keyboard.md"><code>Keyboard</code></a>. You can now listen for native keyboard events and react to them. For example, to dismiss the active keyboard, simply call <code>Keyboard.dismiss()</code>:</p>
-<pre><code class="hljs css languages- js"><span class="hljs-keyword">import</span> {Keyboard} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
+<pre><code class="hljs css language-js"><span class="hljs-keyword">import</span> {Keyboard} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
 
 <span class="hljs-comment">// Hide that keyboard!</span>
 Keyboard.dismiss();
@@ -74,10 +78,10 @@ Animated.spring(a, {
 <h2><a class="anchor" aria-hidden="true" id="and-more"></a><a href="#and-more" 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>...and more</h2>
 <p>The above is just a sample of what has changed in 0.36. Check out the <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">release notes on GitHub</a> to see the full list of new features, bug fixes, and breaking changes.</p>
 <p>You can upgrade to 0.36 by running the following commands in a terminal:</p>
-<pre><code class="hljs css languages- bash">$ npm install --save react-native@0.36
+<pre><code class="hljs css language-bash">$ npm install --save react-native@0.36
 $ react-native upgrade
 </code></pre>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="0.36: Headless JS, the Keyboard API, &amp; more" data-url="https://facebook.github.io/react-native/blog/2016/10/25/0" data-related="reactnative" data-via="hectorramos" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/10/25/0" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="0.36: Headless JS, the Keyboard API, &amp; more" data-url="https://facebook.github.io/react-native/blog/2016/10/25/0" data-related="reactnative" data-via="hectorramos" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/10/25/0" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/10/25/0.36-headless-js-the-keyboard-api-and-more/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,21 +33,21 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/10/25/0">0.36: Headless JS, the Keyboard API, &amp; more</a></h1><p class="post-meta">October 25, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><div><span><p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">React Native 0.36</a>. Read on to learn more about what's new.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/10/25/0">0.36: Headless JS, the Keyboard API, &amp; more</a></h1><p class="post-meta">October 25, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><div><span><p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">React Native 0.36</a>. Read on to learn more about what's new.</p>
 <h2><a class="anchor" aria-hidden="true" id="headless-js"></a><a href="#headless-js" 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>Headless JS</h2>
 <p>Headless JS is a way to run tasks in JavaScript while your app is in the background. It can be used, for example, to sync fresh data, handle push notifications, or play music. It is only available on Android, for now.</p>
 <p>To get started, define your async task in a dedicated file (e.g. <code>SomeTaskName.js</code>):</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-built_in">module</span>.exports = <span class="hljs-keyword">async</span> (taskData) =&gt; {
+<pre><code class="hljs css language-javascript"><span class="hljs-built_in">module</span>.exports = <span class="hljs-keyword">async</span> (taskData) =&gt; {
   <span class="hljs-comment">// Perform your task here.</span>
 };
 </code></pre>
 <p>Next, register your task in on <code>AppRegistry</code>:</p>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerHeadlessTask(<span class="hljs-string">'SomeTaskName'</span>, () =&gt; <span class="hljs-built_in">require</span>(<span class="hljs-string">'SomeTaskName'</span>));
+<pre><code class="hljs css language-javascript">AppRegistry.registerHeadlessTask(<span class="hljs-string">'SomeTaskName'</span>, () =&gt; <span class="hljs-built_in">require</span>(<span class="hljs-string">'SomeTaskName'</span>));
 </code></pre>
 <p>Using Headless JS does require some native Java code to be written in order to allow you to start up the service when needed. Take a look at our new <a href="/react-native/headless-js-android.md">Headless JS docs</a> to learn more!</p>
 <h2><a class="anchor" aria-hidden="true" id="the-keyboard-api"></a><a href="#the-keyboard-api" 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 Keyboard API</h2>
 <p>Working with the on-screen keyboard is now easier with <a href="/react-native/keyboard.md"><code>Keyboard</code></a>. You can now listen for native keyboard events and react to them. For example, to dismiss the active keyboard, simply call <code>Keyboard.dismiss()</code>:</p>
-<pre><code class="hljs css languages- js"><span class="hljs-keyword">import</span> {Keyboard} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
+<pre><code class="hljs css language-js"><span class="hljs-keyword">import</span> {Keyboard} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
 
 <span class="hljs-comment">// Hide that keyboard!</span>
 Keyboard.dismiss();
@@ -74,10 +78,10 @@ Animated.spring(a, {
 <h2><a class="anchor" aria-hidden="true" id="and-more"></a><a href="#and-more" 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>...and more</h2>
 <p>The above is just a sample of what has changed in 0.36. Check out the <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">release notes on GitHub</a> to see the full list of new features, bug fixes, and breaking changes.</p>
 <p>You can upgrade to 0.36 by running the following commands in a terminal:</p>
-<pre><code class="hljs css languages- bash">$ npm install --save react-native@0.36
+<pre><code class="hljs css language-bash">$ npm install --save react-native@0.36
 $ react-native upgrade
 </code></pre>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="0.36: Headless JS, the Keyboard API, &amp; more" data-url="https://facebook.github.io/react-native/blog/2016/10/25/0" data-related="reactnative" data-via="hectorramos" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/10/25/0" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="0.36: Headless JS, the Keyboard API, &amp; more" data-url="https://facebook.github.io/react-native/blog/2016/10/25/0" data-related="reactnative" data-via="hectorramos" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/10/25/0" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap">Introducing Button, Faster Installs with Yarn, and a Public Roadmap</a></h1><p class="post-meta">November 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><div><span><p>We have heard from many people that there is so much work happening with React Native, it can be tough to keep track of what's going on. To help communicate what work is in progress, we are now publishing a <a href="https://github.com/facebook/react-native/wiki/Roadmap">roadmap for React Native</a>. At a high level, this work can be broken down into three priorities:</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap">Introducing Button, Faster Installs with Yarn, and a Public Roadmap</a></h1><p class="post-meta">November 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><div><span><p>We have heard from many people that there is so much work happening with React Native, it can be tough to keep track of what's going on. To help communicate what work is in progress, we are now publishing a <a href="https://github.com/facebook/react-native/wiki/Roadmap">roadmap for React Native</a>. At a high level, this work can be broken down into three priorities:</p>
 <ul>
 <li><strong>Core Libraries</strong>. Adding more functionality to the most useful components and APIs.</li>
 <li><strong>Stability</strong>. Improve the underlying infrastructure to reduce bugs and improve code quality.</li>
@@ -58,7 +62,7 @@
 <p>In simple local testing <code>react-native init</code> finished in <strong>about 1 minute on a good network</strong> (vs around 3 minutes when using npm 3.10.8). Installing yarn is optional but highly recommended.</p>
 <h2><a class="anchor" aria-hidden="true" id="thank-you"></a><a href="#thank-you" 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>Thank you!</h2>
 <p>We'd like to thank everyone who contributed to this release. The full <a href="https://github.com/facebook/react-native/releases/tag/v0.37.0">release notes</a> are now available on GitHub. With over two dozen bug fixes and new features, React Native just keeps getting better thanks to you.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Button, Faster Installs with Yarn, and a Public Roadmap" data-url="https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap" data-related="reactnative" data-via="hectorramos" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Button, Faster Installs with Yarn, and a Public Roadmap" data-url="https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap" data-related="reactnative" data-via="hectorramos" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap">Introducing Button, Faster Installs with Yarn, and a Public Roadmap</a></h1><p class="post-meta">November 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><div><span><p>We have heard from many people that there is so much work happening with React Native, it can be tough to keep track of what's going on. To help communicate what work is in progress, we are now publishing a <a href="https://github.com/facebook/react-native/wiki/Roadmap">roadmap for React Native</a>. At a high level, this work can be broken down into three priorities:</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap">Introducing Button, Faster Installs with Yarn, and a Public Roadmap</a></h1><p class="post-meta">November 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><div><span><p>We have heard from many people that there is so much work happening with React Native, it can be tough to keep track of what's going on. To help communicate what work is in progress, we are now publishing a <a href="https://github.com/facebook/react-native/wiki/Roadmap">roadmap for React Native</a>. At a high level, this work can be broken down into three priorities:</p>
 <ul>
 <li><strong>Core Libraries</strong>. Adding more functionality to the most useful components and APIs.</li>
 <li><strong>Stability</strong>. Improve the underlying infrastructure to reduce bugs and improve code quality.</li>
@@ -58,7 +62,7 @@
 <p>In simple local testing <code>react-native init</code> finished in <strong>about 1 minute on a good network</strong> (vs around 3 minutes when using npm 3.10.8). Installing yarn is optional but highly recommended.</p>
 <h2><a class="anchor" aria-hidden="true" id="thank-you"></a><a href="#thank-you" 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>Thank you!</h2>
 <p>We'd like to thank everyone who contributed to this release. The full <a href="https://github.com/facebook/react-native/releases/tag/v0.37.0">release notes</a> are now available on GitHub. With over two dozen bug fixes and new features, React Native just keeps getting better thanks to you.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Button, Faster Installs with Yarn, and a Public Roadmap" data-url="https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap" data-related="reactnative" data-via="hectorramos" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Button, Faster Installs with Yarn, and a Public Roadmap" data-url="https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap" data-related="reactnative" data-via="hectorramos" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/12/05/easier-upgrades.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/12/05/easier-upgrades">Easier Upgrades Thanks to Git</a></h1><p class="post-meta">December 5, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener">Nicolas Cuillery</a>JavaScript consultant and trainer at Zenika</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener"><img src="https://fr.gravatar.com/userimage/78328995/184460def705a160fd8edadc04f60eaf.jpg?size=128"/></a></div></div></header><div><span><p>Upgrading to new versions of React Native has been difficult. You might have seen something like this before:</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/12/05/easier-upgrades">Easier Upgrades Thanks to Git</a></h1><p class="post-meta">December 5, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener">Nicolas Cuillery</a>JavaScript consultant and trainer at Zenika</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener"><img src="https://fr.gravatar.com/userimage/78328995/184460def705a160fd8edadc04f60eaf.jpg?size=128" alt="Nicolas Cuillery"/></a></div></div></header><div><span><p>Upgrading to new versions of React Native has been difficult. You might have seen something like this before:</p>
 <p><img src="/react-native/blog/assets/git-upgrade-conflict.png" alt=""></p>
 <p>None of those options is ideal. By overwriting the file we lose our local changes. By not overwriting we don't get the latest updates.</p>
 <p>Today I am proud to introduce a new tool that helps solve this problem. The tool is called <code>react-native-git-upgrade</code> and uses Git behind the scenes to resolve conflicts automatically whenever possible.</p>
@@ -38,13 +42,13 @@
 <p><strong>Requirement</strong>: Git has to be available in the <code>PATH</code>. Your project doesn't have to be managed by Git.</p>
 </blockquote>
 <p>Install <code>react-native-git-upgrade</code> globally:</p>
-<pre><code class="hljs css languages- shell"><span class="hljs-meta">$</span><span class="bash"> npm install -g react-native-git-upgrade</span>
+<pre><code class="hljs css language-shell"><span class="hljs-meta">$</span><span class="bash"> npm install -g react-native-git-upgrade</span>
 </code></pre>
 <p>or, using <a href="https://yarnpkg.com/">Yarn</a>:</p>
-<pre><code class="hljs css languages- shell"><span class="hljs-meta">$</span><span class="bash"> yarn global add react-native-git-upgrade</span>
+<pre><code class="hljs css language-shell"><span class="hljs-meta">$</span><span class="bash"> yarn global add react-native-git-upgrade</span>
 </code></pre>
 <p>Then, run it inside your project directory:</p>
-<pre><code class="hljs css languages- shell"><span class="hljs-meta">$</span><span class="bash"> <span class="hljs-built_in">cd</span> MyProject</span>
+<pre><code class="hljs css language-shell"><span class="hljs-meta">$</span><span class="bash"> <span class="hljs-built_in">cd</span> MyProject</span>
 <span class="hljs-meta">$</span><span class="bash"> react-native-git-upgrade 0.38.0</span>
 </code></pre>
 <blockquote>
@@ -107,7 +111,7 @@ index e98ebb0.<span class="hljs-number">.2</span>fb6a11 <span class="hljs-number
 <p>As a conclusion, I would say, enjoy the feature and feel free <a href="https://github.com/facebook/react-native/issues">to suggest improvements, report issues</a> and especially <a href="https://github.com/facebook/react-native/pulls">send pull requests</a>. Each environment is a bit different and each React Native project is different, and we need your feedback to make this work well for everyone.</p>
 <h3><a class="anchor" aria-hidden="true" id="thank-you"></a><a href="#thank-you" 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>Thank you!</h3>
 <p>I would like to thank the awesome companies <a href="http://www.zenika.com">Zenika</a> and <a href="http://www.groupem6.fr/le-groupe_en/activites/diversifications/m6-web.html">M6 Web</a> without whom none of this would have been possible!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Easier Upgrades Thanks to Git" data-url="https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades" data-related="reactnative" data-via="ncuillery" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Easier Upgrades Thanks to Git" data-url="https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades" data-related="reactnative" data-via="ncuillery" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2016/12/05/easier-upgrades/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/12/05/easier-upgrades">Easier Upgrades Thanks to Git</a></h1><p class="post-meta">December 5, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener">Nicolas Cuillery</a>JavaScript consultant and trainer at Zenika</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener"><img src="https://fr.gravatar.com/userimage/78328995/184460def705a160fd8edadc04f60eaf.jpg?size=128"/></a></div></div></header><div><span><p>Upgrading to new versions of React Native has been difficult. You might have seen something like this before:</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/12/05/easier-upgrades">Easier Upgrades Thanks to Git</a></h1><p class="post-meta">December 5, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener">Nicolas Cuillery</a>JavaScript consultant and trainer at Zenika</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener"><img src="https://fr.gravatar.com/userimage/78328995/184460def705a160fd8edadc04f60eaf.jpg?size=128" alt="Nicolas Cuillery"/></a></div></div></header><div><span><p>Upgrading to new versions of React Native has been difficult. You might have seen something like this before:</p>
 <p><img src="/react-native/blog/assets/git-upgrade-conflict.png" alt=""></p>
 <p>None of those options is ideal. By overwriting the file we lose our local changes. By not overwriting we don't get the latest updates.</p>
 <p>Today I am proud to introduce a new tool that helps solve this problem. The tool is called <code>react-native-git-upgrade</code> and uses Git behind the scenes to resolve conflicts automatically whenever possible.</p>
@@ -38,13 +42,13 @@
 <p><strong>Requirement</strong>: Git has to be available in the <code>PATH</code>. Your project doesn't have to be managed by Git.</p>
 </blockquote>
 <p>Install <code>react-native-git-upgrade</code> globally:</p>
-<pre><code class="hljs css languages- shell"><span class="hljs-meta">$</span><span class="bash"> npm install -g react-native-git-upgrade</span>
+<pre><code class="hljs css language-shell"><span class="hljs-meta">$</span><span class="bash"> npm install -g react-native-git-upgrade</span>
 </code></pre>
 <p>or, using <a href="https://yarnpkg.com/">Yarn</a>:</p>
-<pre><code class="hljs css languages- shell"><span class="hljs-meta">$</span><span class="bash"> yarn global add react-native-git-upgrade</span>
+<pre><code class="hljs css language-shell"><span class="hljs-meta">$</span><span class="bash"> yarn global add react-native-git-upgrade</span>
 </code></pre>
 <p>Then, run it inside your project directory:</p>
-<pre><code class="hljs css languages- shell"><span class="hljs-meta">$</span><span class="bash"> <span class="hljs-built_in">cd</span> MyProject</span>
+<pre><code class="hljs css language-shell"><span class="hljs-meta">$</span><span class="bash"> <span class="hljs-built_in">cd</span> MyProject</span>
 <span class="hljs-meta">$</span><span class="bash"> react-native-git-upgrade 0.38.0</span>
 </code></pre>
 <blockquote>
@@ -107,7 +111,7 @@ index e98ebb0.<span class="hljs-number">.2</span>fb6a11 <span class="hljs-number
 <p>As a conclusion, I would say, enjoy the feature and feel free <a href="https://github.com/facebook/react-native/issues">to suggest improvements, report issues</a> and especially <a href="https://github.com/facebook/react-native/pulls">send pull requests</a>. Each environment is a bit different and each React Native project is different, and we need your feedback to make this work well for everyone.</p>
 <h3><a class="anchor" aria-hidden="true" id="thank-you"></a><a href="#thank-you" 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>Thank you!</h3>
 <p>I would like to thank the awesome companies <a href="http://www.zenika.com">Zenika</a> and <a href="http://www.groupem6.fr/le-groupe_en/activites/diversifications/m6-web.html">M6 Web</a> without whom none of this would have been possible!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Easier Upgrades Thanks to Git" data-url="https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades" data-related="reactnative" data-via="ncuillery" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Easier Upgrades Thanks to Git" data-url="https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades" data-related="reactnative" data-via="ncuillery" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/01/07/monthly-release-cadence.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/01/07/monthly-release-cadence">A Monthly Release Cadence: Releasing December and January RC</a></h1><p class="post-meta">January 7, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener">Eric Vicenti</a>Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/077ad5372b65567fe952a99f3b627048?s=128"/></a></div></div></header><div><span><p>Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release of our production iOS apps, so we decided to release the open source versions at the same pace. Now, many of the Facebook apps ship once per week, especially on Android. Because we ship from master weekly, we need to keep it quite stable. So the bi-weekly release cadence doesn't even benefit internal contributors anymore.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/01/07/monthly-release-cadence">A Monthly Release Cadence: Releasing December and January RC</a></h1><p class="post-meta">January 7, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener">Eric Vicenti</a>Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/077ad5372b65567fe952a99f3b627048?s=128" alt="Eric Vicenti"/></a></div></div></header><div><span><p>Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release of our production iOS apps, so we decided to release the open source versions at the same pace. Now, many of the Facebook apps ship once per week, especially on Android. Because we ship from master weekly, we need to keep it quite stable. So the bi-weekly release cadence doesn't even benefit internal contributors anymore.</p>
 <p>We frequently hear feedback from the community that the release rate is hard to keep up with. Tools like <a href="https://expo.io/">Expo</a> had to skip every other release in order to manage the rapid change in version. So it seems clear that the bi-weekly releases did not serve the community well.</p>
 <h3><a class="anchor" aria-hidden="true" id="now-releasing-monthly"></a><a href="#now-releasing-monthly" 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>Now releasing monthly</h3>
 <p>We're happy to announce the new monthly release cadence, and the December 2016 release, <code>v0.40</code>, which has been stabilizing for all last month and is ready to adopt. (Just make sure to <a href="https://github.com/facebook/react-native/releases/tag/v0.40.0">update headers in your native modules on iOS</a>).</p>
@@ -43,7 +47,7 @@ react-<span class="hljs-keyword">native</span>-git-<span class="hljs-keyword">up
 </code></pre>
 <p>We hope this simpler approach will make it easier for the community to keep track of changes in React Native, and to adopt new versions as quickly as possible!</p>
 <p>(Thanks go to <a href="https://github.com/mkonicek">Martin Konicek</a> for coming up with this plan and <a href="https://github.com/grabbou">Mike Grabowski</a> for making it happen)</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="A Monthly Release Cadence: Releasing December and January RC" data-url="https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence" data-related="reactnative" data-via="EricVicenti" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="A Monthly Release Cadence: Releasing December and January RC" data-url="https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence" data-related="reactnative" data-via="EricVicenti" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/01/07/monthly-release-cadence/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/01/07/monthly-release-cadence">A Monthly Release Cadence: Releasing December and January RC</a></h1><p class="post-meta">January 7, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener">Eric Vicenti</a>Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/077ad5372b65567fe952a99f3b627048?s=128"/></a></div></div></header><div><span><p>Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release of our production iOS apps, so we decided to release the open source versions at the same pace. Now, many of the Facebook apps ship once per week, especially on Android. Because we ship from master weekly, we need to keep it quite stable. So the bi-weekly release cadence doesn't even benefit internal contributors anymore.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/01/07/monthly-release-cadence">A Monthly Release Cadence: Releasing December and January RC</a></h1><p class="post-meta">January 7, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener">Eric Vicenti</a>Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/077ad5372b65567fe952a99f3b627048?s=128" alt="Eric Vicenti"/></a></div></div></header><div><span><p>Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release of our production iOS apps, so we decided to release the open source versions at the same pace. Now, many of the Facebook apps ship once per week, especially on Android. Because we ship from master weekly, we need to keep it quite stable. So the bi-weekly release cadence doesn't even benefit internal contributors anymore.</p>
 <p>We frequently hear feedback from the community that the release rate is hard to keep up with. Tools like <a href="https://expo.io/">Expo</a> had to skip every other release in order to manage the rapid change in version. So it seems clear that the bi-weekly releases did not serve the community well.</p>
 <h3><a class="anchor" aria-hidden="true" id="now-releasing-monthly"></a><a href="#now-releasing-monthly" 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>Now releasing monthly</h3>
 <p>We're happy to announce the new monthly release cadence, and the December 2016 release, <code>v0.40</code>, which has been stabilizing for all last month and is ready to adopt. (Just make sure to <a href="https://github.com/facebook/react-native/releases/tag/v0.40.0">update headers in your native modules on iOS</a>).</p>
@@ -43,7 +47,7 @@ react-<span class="hljs-keyword">native</span>-git-<span class="hljs-keyword">up
 </code></pre>
 <p>We hope this simpler approach will make it easier for the community to keep track of changes in React Native, and to adopt new versions as quickly as possible!</p>
 <p>(Thanks go to <a href="https://github.com/mkonicek">Martin Konicek</a> for coming up with this plan and <a href="https://github.com/grabbou">Mike Grabowski</a> for making it happen)</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="A Monthly Release Cadence: Releasing December and January RC" data-url="https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence" data-related="reactnative" data-via="EricVicenti" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="A Monthly Release Cadence: Releasing December and January RC" data-url="https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence" data-related="reactnative" data-via="EricVicenti" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/02/14/using-native-driver-for-animated.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/02/14/using-native-driver-for-animated">Using Native Driver for Animated</a></h1><p class="post-meta">February 14, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener">Janic Duplessis</a>Software Engineer at App &amp; Flow</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/8d6b6c0f5b228b0a8566a69de448b9dd?s=128"/></a></div></div></header><div><span><p>For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers to create performant animations without having to worry about some of their code causing it to lag.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/02/14/using-native-driver-for-animated">Using Native Driver for Animated</a></h1><p class="post-meta">February 14, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener">Janic Duplessis</a>Software Engineer at App &amp; Flow</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/8d6b6c0f5b228b0a8566a69de448b9dd?s=128" alt="Janic Duplessis"/></a></div></div></header><div><span><p>For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers to create performant animations without having to worry about some of their code causing it to lag.</p>
 <h2><a class="anchor" aria-hidden="true" id="what-is-this"></a><a href="#what-is-this" 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>What is this?</h2>
 <p>The Animated API was designed with a very important constraint in mind, it is serializable. This means we can send everything about the animation to native before it has even started and allows native code to perform the animation on the UI thread without having to go through the bridge on every frame. It is very useful because once the animation has started, the JS thread can be blocked and the animation will still run smoothly. In practice this can happen a lot because user code runs on the JS thread and React renders can also lock JS for a long time.</p>
 <h2><a class="anchor" aria-hidden="true" id="a-bit-of-history"></a><a href="#a-bit-of-history" 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>A bit of history...</h2>
@@ -137,7 +141,7 @@ NativeAnimatedModule.connectNodes(<span class="hljs-number">2</span>, <span clas
 <h2><a class="anchor" aria-hidden="true" id="resources"></a><a href="#resources" 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>Resources</h2>
 <p>For more information about animated I recommend watching <a href="https://www.youtube.com/watch?v=xtqUJVqpKNo">this talk</a> by <a href="https://twitter.com/Vjeux">Christopher Chedeau</a>.</p>
 <p>If you want a deep dive into animations and how offloading them to native can improve user experience there is also <a href="https://www.youtube.com/watch?v=qgSMjYWqBk4">this talk</a> by <a href="https://twitter.com/kzzzf">Krzysztof Magiera</a>.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using Native Driver for Animated" data-url="https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated" data-related="reactnative" data-via="janicduplessis" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using Native Driver for Animated" data-url="https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated" data-related="reactnative" data-via="janicduplessis" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/02/14/using-native-driver-for-animated/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/02/14/using-native-driver-for-animated">Using Native Driver for Animated</a></h1><p class="post-meta">February 14, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener">Janic Duplessis</a>Software Engineer at App &amp; Flow</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/8d6b6c0f5b228b0a8566a69de448b9dd?s=128"/></a></div></div></header><div><span><p>For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers to create performant animations without having to worry about some of their code causing it to lag.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/02/14/using-native-driver-for-animated">Using Native Driver for Animated</a></h1><p class="post-meta">February 14, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener">Janic Duplessis</a>Software Engineer at App &amp; Flow</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/8d6b6c0f5b228b0a8566a69de448b9dd?s=128" alt="Janic Duplessis"/></a></div></div></header><div><span><p>For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers to create performant animations without having to worry about some of their code causing it to lag.</p>
 <h2><a class="anchor" aria-hidden="true" id="what-is-this"></a><a href="#what-is-this" 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>What is this?</h2>
 <p>The Animated API was designed with a very important constraint in mind, it is serializable. This means we can send everything about the animation to native before it has even started and allows native code to perform the animation on the UI thread without having to go through the bridge on every frame. It is very useful because once the animation has started, the JS thread can be blocked and the animation will still run smoothly. In practice this can happen a lot because user code runs on the JS thread and React renders can also lock JS for a long time.</p>
 <h2><a class="anchor" aria-hidden="true" id="a-bit-of-history"></a><a href="#a-bit-of-history" 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>A bit of history...</h2>
@@ -137,7 +141,7 @@ NativeAnimatedModule.connectNodes(<span class="hljs-number">2</span>, <span clas
 <h2><a class="anchor" aria-hidden="true" id="resources"></a><a href="#resources" 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>Resources</h2>
 <p>For more information about animated I recommend watching <a href="https://www.youtube.com/watch?v=xtqUJVqpKNo">this talk</a> by <a href="https://twitter.com/Vjeux">Christopher Chedeau</a>.</p>
 <p>If you want a deep dive into animations and how offloading them to native can improve user experience there is also <a href="https://www.youtube.com/watch?v=qgSMjYWqBk4">this talk</a> by <a href="https://twitter.com/kzzzf">Krzysztof Magiera</a>.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using Native Driver for Animated" data-url="https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated" data-related="reactnative" data-via="janicduplessis" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using Native Driver for Animated" data-url="https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated" data-related="reactnative" data-via="janicduplessis" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/03/13/better-list-views.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/better-list-views">Better List Views in React Native</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener">Spencer Ahrens</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/1509831"/></a></div></div></header><div><span><p>Many of you have started playing with some of our new List components already after our <a href="https://www.facebook.com/groups/react.native.community/permalink/921378591331053">teaser announcement in the community group</a>, but we are officially announcing them today! No more <code>ListView</code>s or <code>DataSource</code>s, stale rows, ignored bugs, or excessive memory consumption - with the latest React Native March 2017 release candidate (<code>0.43-rc.1</code>) you can pick from the new suite of components what best fits your use-case, with great perf and feature sets out of the box:</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/better-list-views">Better List Views in React Native</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener">Spencer Ahrens</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/1509831" alt="Spencer Ahrens"/></a></div></div></header><div><span><p>Many of you have started playing with some of our new List components already after our <a href="https://www.facebook.com/groups/react.native.community/permalink/921378591331053">teaser announcement in the community group</a>, but we are officially announcing them today! No more <code>ListView</code>s or <code>DataSource</code>s, stale rows, ignored bugs, or excessive memory consumption - with the latest React Native March 2017 release candidate (<code>0.43-rc.1</code>) you can pick from the new suite of components what best fits your use-case, with great perf and feature sets out of the box:</p>
 <h3><a class="anchor" aria-hidden="true" id="flatlist-https-facebookgithubio-react-native-releases-next-flatlistmd"></a><a href="#flatlist-https-facebookgithubio-react-native-releases-next-flatlistmd" 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><a href="https://facebook.github.io/react-native/releases/next/flatlist.md"><code>&lt;FlatList&gt;</code></a></h3>
 <p>This is the workhorse component for simple, performant lists. Provide an array of data and a <code>renderItem</code> function and you're good to go:</p>
 <pre><code class="hljs">&lt;FlatList
@@ -75,7 +79,7 @@
 <ul>
 <li><p>The internal state of item subtrees is not preserved when content scrolls out of the render window. Make sure all your data is captured in the item data or external stores like Flux, Redux, or Relay.</p></li>
 <li><p>These components are based on <code>PureComponent</code> which means that they will not re-render if <code>props</code> remains shallow-equal. Make sure that everything your <code>renderItem</code> function depends on directly is passed as a prop that is not <code>===</code> after updates, otherwise your UI may not update on changes. This includes the <code>data</code> prop and parent component state. For example:</p>
-<pre><code class="hljs css languages- javascript">&lt;FlatList
+<pre><code class="hljs css language-javascript">&lt;FlatList
   data={<span class="hljs-keyword">this</span>.state.data}
   renderItem={({item}) =&gt; (
     <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">MyItem</span>
@@ -120,7 +124,7 @@
 <li>More performance optimizations.</li>
 <li>Support functional item components with state.</li>
 </ul>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Better List Views in React Native" data-url="https://facebook.github.io/react-native/blog/2017/03/13/better-list-views" data-related="reactnative" data-via="sahrens2012" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/better-list-views" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Better List Views in React Native" data-url="https://facebook.github.io/react-native/blog/2017/03/13/better-list-views" data-related="reactnative" data-via="sahrens2012" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/better-list-views" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/03/13/better-list-views/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/better-list-views">Better List Views in React Native</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener">Spencer Ahrens</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/1509831"/></a></div></div></header><div><span><p>Many of you have started playing with some of our new List components already after our <a href="https://www.facebook.com/groups/react.native.community/permalink/921378591331053">teaser announcement in the community group</a>, but we are officially announcing them today! No more <code>ListView</code>s or <code>DataSource</code>s, stale rows, ignored bugs, or excessive memory consumption - with the latest React Native March 2017 release candidate (<code>0.43-rc.1</code>) you can pick from the new suite of components what best fits your use-case, with great perf and feature sets out of the box:</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/better-list-views">Better List Views in React Native</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener">Spencer Ahrens</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/1509831" alt="Spencer Ahrens"/></a></div></div></header><div><span><p>Many of you have started playing with some of our new List components already after our <a href="https://www.facebook.com/groups/react.native.community/permalink/921378591331053">teaser announcement in the community group</a>, but we are officially announcing them today! No more <code>ListView</code>s or <code>DataSource</code>s, stale rows, ignored bugs, or excessive memory consumption - with the latest React Native March 2017 release candidate (<code>0.43-rc.1</code>) you can pick from the new suite of components what best fits your use-case, with great perf and feature sets out of the box:</p>
 <h3><a class="anchor" aria-hidden="true" id="flatlist-https-facebookgithubio-react-native-releases-next-flatlistmd"></a><a href="#flatlist-https-facebookgithubio-react-native-releases-next-flatlistmd" 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><a href="https://facebook.github.io/react-native/releases/next/flatlist.md"><code>&lt;FlatList&gt;</code></a></h3>
 <p>This is the workhorse component for simple, performant lists. Provide an array of data and a <code>renderItem</code> function and you're good to go:</p>
 <pre><code class="hljs">&lt;FlatList
@@ -75,7 +79,7 @@
 <ul>
 <li><p>The internal state of item subtrees is not preserved when content scrolls out of the render window. Make sure all your data is captured in the item data or external stores like Flux, Redux, or Relay.</p></li>
 <li><p>These components are based on <code>PureComponent</code> which means that they will not re-render if <code>props</code> remains shallow-equal. Make sure that everything your <code>renderItem</code> function depends on directly is passed as a prop that is not <code>===</code> after updates, otherwise your UI may not update on changes. This includes the <code>data</code> prop and parent component state. For example:</p>
-<pre><code class="hljs css languages- javascript">&lt;FlatList
+<pre><code class="hljs css language-javascript">&lt;FlatList
   data={<span class="hljs-keyword">this</span>.state.data}
   renderItem={({item}) =&gt; (
     <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">MyItem</span>
@@ -120,7 +124,7 @@
 <li>More performance optimizations.</li>
 <li>Support functional item components with state.</li>
 </ul>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Better List Views in React Native" data-url="https://facebook.github.io/react-native/blog/2017/03/13/better-list-views" data-related="reactnative" data-via="sahrens2012" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/better-list-views" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Better List Views in React Native" data-url="https://facebook.github.io/react-native/blog/2017/03/13/better-list-views" data-related="reactnative" data-via="sahrens2012" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/better-list-views" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/03/13/idx-the-existential-function.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,16 +33,16 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/idx-the-existential-function">idx: The Existential Function</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener">Timothy Yung</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/1592444107/image.jpg"/></a></div></div></header><div><span><p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/idx-the-existential-function">idx: The Existential Function</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener">Timothy Yung</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/1592444107/image.jpg" alt="Timothy Yung"/></a></div></div></header><div><span><p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors.</p>
 <p>Unfortunately, accessing these deeply nested values is currently tedious and verbose.</p>
-<pre><code class="hljs css languages- javascript">props.user &amp;&amp;
+<pre><code class="hljs css language-javascript">props.user &amp;&amp;
   props.user.friends &amp;&amp;
   props.user.friends[<span class="hljs-number">0</span>] &amp;&amp;
   props.user.friends[<span class="hljs-number">0</span>].friends;
 </code></pre>
 <p>There is <a href="https://github.com/claudepache/es-optional-chaining">an ECMAScript proposal to introduce the existential operator</a> which will make this much more convenient. But until a time when that proposal is finalized, we want a solution that improves our quality of life, maintains existing language semantics, and encourages type safety with Flow.</p>
 <p>We came up with an existential <em>function</em> we call <code>idx</code>.</p>
-<pre><code class="hljs css languages- javascript">idx(props, (_) =&gt; _.user.friends[<span class="hljs-number">0</span>].friends);
+<pre><code class="hljs css language-javascript">idx(props, (_) =&gt; _.user.friends[<span class="hljs-number">0</span>].friends);
 </code></pre>
 <p>The invocation in this code snippet behaves similarly to the boolean expression in the code snippet above, except with significantly less repetition. The <code>idx</code> function takes exactly two arguments:</p>
 <ul>
@@ -47,7 +51,7 @@
 </ul>
 <p>In theory, the <code>idx</code> function will try-catch errors that are the result of accessing properties on null or undefined. If such an error is caught, it will return either null or undefined. (And you can see how this might be implemented in <a href="https://github.com/facebookincubator/idx/blob/master/packages/idx/src/idx.js">idx.js</a>.)</p>
 <p>In practice, try-catching every nested property access is slow, and differentiating between specific kinds of TypeErrors is fragile. To deal with these shortcomings, we created a Babel plugin that transforms the above <code>idx</code> invocation into the following expression:</p>
-<pre><code class="hljs css languages- javascript">props.user == <span class="hljs-literal">null</span>
+<pre><code class="hljs css language-javascript">props.user == <span class="hljs-literal">null</span>
   ? props.user
   : props.user.friends == <span class="hljs-literal">null</span>
     ? props.user.friends
@@ -57,7 +61,7 @@
 </code></pre>
 <p>Finally, we added a custom Flow type declaration for <code>idx</code> that allows the traversal in the second argument to be properly type-checked while permitting nested access on nullable properties.</p>
 <p>The function, Babel plugin, and Flow declaration are now <a href="https://github.com/facebookincubator/idx">available on GitHub</a>. They are used by installing the <strong>idx</strong> and <strong>babel-plugin-idx</strong> npm packages, and adding “idx” to the list of plugins in your <code>.babelrc</code> file.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="idx: The Existential Function" data-url="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function" data-related="reactnative" data-via="yungsters" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="idx: The Existential Function" data-url="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function" data-related="reactnative" data-via="yungsters" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/03/13/idx-the-existential-function/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,16 +33,16 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/idx-the-existential-function">idx: The Existential Function</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener">Timothy Yung</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/1592444107/image.jpg"/></a></div></div></header><div><span><p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/idx-the-existential-function">idx: The Existential Function</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener">Timothy Yung</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/1592444107/image.jpg" alt="Timothy Yung"/></a></div></div></header><div><span><p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors.</p>
 <p>Unfortunately, accessing these deeply nested values is currently tedious and verbose.</p>
-<pre><code class="hljs css languages- javascript">props.user &amp;&amp;
+<pre><code class="hljs css language-javascript">props.user &amp;&amp;
   props.user.friends &amp;&amp;
   props.user.friends[<span class="hljs-number">0</span>] &amp;&amp;
   props.user.friends[<span class="hljs-number">0</span>].friends;
 </code></pre>
 <p>There is <a href="https://github.com/claudepache/es-optional-chaining">an ECMAScript proposal to introduce the existential operator</a> which will make this much more convenient. But until a time when that proposal is finalized, we want a solution that improves our quality of life, maintains existing language semantics, and encourages type safety with Flow.</p>
 <p>We came up with an existential <em>function</em> we call <code>idx</code>.</p>
-<pre><code class="hljs css languages- javascript">idx(props, (_) =&gt; _.user.friends[<span class="hljs-number">0</span>].friends);
+<pre><code class="hljs css language-javascript">idx(props, (_) =&gt; _.user.friends[<span class="hljs-number">0</span>].friends);
 </code></pre>
 <p>The invocation in this code snippet behaves similarly to the boolean expression in the code snippet above, except with significantly less repetition. The <code>idx</code> function takes exactly two arguments:</p>
 <ul>
@@ -47,7 +51,7 @@
 </ul>
 <p>In theory, the <code>idx</code> function will try-catch errors that are the result of accessing properties on null or undefined. If such an error is caught, it will return either null or undefined. (And you can see how this might be implemented in <a href="https://github.com/facebookincubator/idx/blob/master/packages/idx/src/idx.js">idx.js</a>.)</p>
 <p>In practice, try-catching every nested property access is slow, and differentiating between specific kinds of TypeErrors is fragile. To deal with these shortcomings, we created a Babel plugin that transforms the above <code>idx</code> invocation into the following expression:</p>
-<pre><code class="hljs css languages- javascript">props.user == <span class="hljs-literal">null</span>
+<pre><code class="hljs css language-javascript">props.user == <span class="hljs-literal">null</span>
   ? props.user
   : props.user.friends == <span class="hljs-literal">null</span>
     ? props.user.friends
@@ -57,7 +61,7 @@
 </code></pre>
 <p>Finally, we added a custom Flow type declaration for <code>idx</code> that allows the traversal in the second argument to be properly type-checked while permitting nested access on nullable properties.</p>
 <p>The function, Babel plugin, and Flow declaration are now <a href="https://github.com/facebookincubator/idx">available on GitHub</a>. They are used by installing the <strong>idx</strong> and <strong>babel-plugin-idx</strong> npm packages, and adding “idx” to the list of plugins in your <code>.babelrc</code> file.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="idx: The Existential Function" data-url="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function" data-related="reactnative" data-via="yungsters" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="idx: The Existential Function" data-url="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function" data-related="reactnative" data-via="yungsters" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/03/13/introducing-create-react-native-app.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/introducing-create-react-native-app">Introducing Create React Native App</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener">Adam Perry</a>Software Engineer at Expo</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6812281"/></a></div></div></header><div><span><p>Today we’re announcing <a href="https://github.com/react-community/create-react-native-app">Create React Native App</a>: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of <a href="https://github.com/facebookincubator/create-react-app">Create React App</a> and is the product of a collaboration between <a href="https://code.facebook.com">Facebook</a> and <a href="https://expo.io">Expo</a> (formerly Exponent).</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/introducing-create-react-native-app">Introducing Create React Native App</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener">Adam Perry</a>Software Engineer at Expo</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6812281" alt="Adam Perry"/></a></div></div></header><div><span><p>Today we’re announcing <a href="https://github.com/react-community/create-react-native-app">Create React Native App</a>: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of <a href="https://github.com/facebookincubator/create-react-app">Create React App</a> and is the product of a collaboration between <a href="https://code.facebook.com">Facebook</a> and <a href="https://expo.io">Expo</a> (formerly Exponent).</p>
 <p>Many developers struggle with installing and configuring React Native’s current native build dependencies, especially for Android. With Create React Native App, there’s no need to use Xcode or Android Studio, and you can develop for your iOS device using Linux or Windows. This is accomplished using the Expo app, which loads and runs CRNA projects written in pure JavaScript without compiling any native code.</p>
 <p>Try creating a new project (replace with suitable yarn commands if you have it installed):</p>
 <pre><code class="hljs">$ <span class="hljs-string">npm </span>i -g <span class="hljs-built_in">create-react-native-app</span>
@@ -43,7 +47,7 @@ $ <span class="hljs-built_in">create-react-native-app</span> <span class="hljs-s
 <p>You can run <code>npm run eject</code> to get a project very similar to what <code>react-native init</code> would generate. At that point you’ll need Xcode and/or Android Studio just as you would if you started with <code>react-native init</code> , adding libraries with <code>react-native link</code> will work, and you’ll have full control over the native code compilation process.</p>
 <h2><a class="anchor" aria-hidden="true" id="questions-feedback"></a><a href="#questions-feedback" 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>Questions? Feedback?</h2>
 <p>Create React Native App is now stable enough for general use, which means we’re very eager to hear about your experience using it! You can find me <a href="https://twitter.com/dika10sune">on Twitter</a> or open an issue on <a href="https://github.com/react-community/create-react-native-app">the GitHub repository</a>. Pull requests are very welcome!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Create React Native App" data-url="https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app" data-related="reactnative" data-via="dika10sune" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Create React Native App" data-url="https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app" data-related="reactnative" data-via="dika10sune" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/03/13/introducing-create-react-native-app/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/introducing-create-react-native-app">Introducing Create React Native App</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener">Adam Perry</a>Software Engineer at Expo</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6812281"/></a></div></div></header><div><span><p>Today we’re announcing <a href="https://github.com/react-community/create-react-native-app">Create React Native App</a>: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of <a href="https://github.com/facebookincubator/create-react-app">Create React App</a> and is the product of a collaboration between <a href="https://code.facebook.com">Facebook</a> and <a href="https://expo.io">Expo</a> (formerly Exponent).</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/introducing-create-react-native-app">Introducing Create React Native App</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener">Adam Perry</a>Software Engineer at Expo</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6812281" alt="Adam Perry"/></a></div></div></header><div><span><p>Today we’re announcing <a href="https://github.com/react-community/create-react-native-app">Create React Native App</a>: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of <a href="https://github.com/facebookincubator/create-react-app">Create React App</a> and is the product of a collaboration between <a href="https://code.facebook.com">Facebook</a> and <a href="https://expo.io">Expo</a> (formerly Exponent).</p>
 <p>Many developers struggle with installing and configuring React Native’s current native build dependencies, especially for Android. With Create React Native App, there’s no need to use Xcode or Android Studio, and you can develop for your iOS device using Linux or Windows. This is accomplished using the Expo app, which loads and runs CRNA projects written in pure JavaScript without compiling any native code.</p>
 <p>Try creating a new project (replace with suitable yarn commands if you have it installed):</p>
 <pre><code class="hljs">$ <span class="hljs-string">npm </span>i -g <span class="hljs-built_in">create-react-native-app</span>
@@ -43,7 +47,7 @@ $ <span class="hljs-built_in">create-react-native-app</span> <span class="hljs-s
 <p>You can run <code>npm run eject</code> to get a project very similar to what <code>react-native init</code> would generate. At that point you’ll need Xcode and/or Android Studio just as you would if you started with <code>react-native init</code> , adding libraries with <code>react-native link</code> will work, and you’ll have full control over the native code compilation process.</p>
 <h2><a class="anchor" aria-hidden="true" id="questions-feedback"></a><a href="#questions-feedback" 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>Questions? Feedback?</h2>
 <p>Create React Native App is now stable enough for general use, which means we’re very eager to hear about your experience using it! You can find me <a href="https://twitter.com/dika10sune">on Twitter</a> or open an issue on <a href="https://github.com/react-community/create-react-native-app">the GitHub repository</a>. Pull requests are very welcome!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Create React Native App" data-url="https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app" data-related="reactnative" data-via="dika10sune" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing Create React Native App" data-url="https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app" data-related="reactnative" data-via="dika10sune" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/06/21/react-native-monthly-1.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/06/21/react-native-monthly-1">React Native Monthly #1</a></h1><p class="post-meta">June 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><div><span><p>At <a href="https://shoutem.github.io/">Shoutem</a>, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep up with the pace the community was growing and improving. That's why we decided to organize a monthly meeting where all major React Native contributors can briefly present what their efforts and plans are.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/06/21/react-native-monthly-1">React Native Monthly #1</a></h1><p class="post-meta">June 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><div><span><p>At <a href="https://shoutem.github.io/">Shoutem</a>, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep up with the pace the community was growing and improving. That's why we decided to organize a monthly meeting where all major React Native contributors can briefly present what their efforts and plans are.</p>
 <h2><a class="anchor" aria-hidden="true" id="monthly-meetings"></a><a href="#monthly-meetings" 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>Monthly meetings</h2>
 <p>We had our first session of the monthly meeting on June 14, 2017. The mission for React Native Monthly is simple and straightforward: <strong>improve the React Native community</strong>. Presenting teams' efforts eases collaboration between teams done offline.</p>
 <h2><a class="anchor" aria-hidden="true" id="teams"></a><a href="#teams" 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>Teams</h2>
@@ -105,7 +109,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>Meetings will be held every four weeks. The next session is scheduled for July 12, 2017. As we just started with this meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/TomislavTenodi">on Twitter</a> if you have any suggestion on what we should cover in the following sessions, or how we should improve the output of the meeting.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #1" data-url="https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #1" data-url="https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/06/21/react-native-monthly-1/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/06/21/react-native-monthly-1">React Native Monthly #1</a></h1><p class="post-meta">June 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><div><span><p>At <a href="https://shoutem.github.io/">Shoutem</a>, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep up with the pace the community was growing and improving. That's why we decided to organize a monthly meeting where all major React Native contributors can briefly present what their efforts and plans are.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/06/21/react-native-monthly-1">React Native Monthly #1</a></h1><p class="post-meta">June 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><div><span><p>At <a href="https://shoutem.github.io/">Shoutem</a>, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep up with the pace the community was growing and improving. That's why we decided to organize a monthly meeting where all major React Native contributors can briefly present what their efforts and plans are.</p>
 <h2><a class="anchor" aria-hidden="true" id="monthly-meetings"></a><a href="#monthly-meetings" 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>Monthly meetings</h2>
 <p>We had our first session of the monthly meeting on June 14, 2017. The mission for React Native Monthly is simple and straightforward: <strong>improve the React Native community</strong>. Presenting teams' efforts eases collaboration between teams done offline.</p>
 <h2><a class="anchor" aria-hidden="true" id="teams"></a><a href="#teams" 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>Teams</h2>
@@ -105,7 +109,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>Meetings will be held every four weeks. The next session is scheduled for July 12, 2017. As we just started with this meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/TomislavTenodi">on Twitter</a> if you have any suggestion on what we should cover in the following sessions, or how we should improve the output of the meeting.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #1" data-url="https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #1" data-url="https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/07/28/react-native-monthly-2.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/07/28/react-native-monthly-2">React Native Monthly #2</a></h1><p class="post-meta">July 28, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! On this session, we were joined by <a href="https://infinite.red/">Infinite Red</a>, great minds behind <a href="https://infinite.red/ChainReactConf">Chain React, the React Native Conference</a>. As most of the people here were presenting talks at Chain React, we pushed the meeting to a week later. Talks from the conference have been <a href="https://www.youtube.com/playlist?list=PLFHvL21g9bk3RxJ1Ut5nR_uTZFVOxu522">posted online</a> and I encourage you to check them out. So, let's see what our teams are up to.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/07/28/react-native-monthly-2">React Native Monthly #2</a></h1><p class="post-meta">July 28, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! On this session, we were joined by <a href="https://infinite.red/">Infinite Red</a>, great minds behind <a href="https://infinite.red/ChainReactConf">Chain React, the React Native Conference</a>. As most of the people here were presenting talks at Chain React, we pushed the meeting to a week later. Talks from the conference have been <a href="https://www.youtube.com/playlist?list=PLFHvL21g9bk3RxJ1Ut5nR_uTZFVOxu522">posted online</a> and I encourage you to check them out. So, let's see what our teams are up to.</p>
 <h2><a class="anchor" aria-hidden="true" id="teams"></a><a href="#teams" 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>Teams</h2>
 <p>On this second meeting, we had 9 teams join us:</p>
 <ul>
@@ -122,7 +126,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for August 16, 2017. As this was only our second meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/TomislavTenodi">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #2" data-url="https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #2" data-url="https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/07/28/react-native-monthly-2/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/07/28/react-native-monthly-2">React Native Monthly #2</a></h1><p class="post-meta">July 28, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! On this session, we were joined by <a href="https://infinite.red/">Infinite Red</a>, great minds behind <a href="https://infinite.red/ChainReactConf">Chain React, the React Native Conference</a>. As most of the people here were presenting talks at Chain React, we pushed the meeting to a week later. Talks from the conference have been <a href="https://www.youtube.com/playlist?list=PLFHvL21g9bk3RxJ1Ut5nR_uTZFVOxu522">posted online</a> and I encourage you to check them out. So, let's see what our teams are up to.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/07/28/react-native-monthly-2">React Native Monthly #2</a></h1><p class="post-meta">July 28, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! On this session, we were joined by <a href="https://infinite.red/">Infinite Red</a>, great minds behind <a href="https://infinite.red/ChainReactConf">Chain React, the React Native Conference</a>. As most of the people here were presenting talks at Chain React, we pushed the meeting to a week later. Talks from the conference have been <a href="https://www.youtube.com/playlist?list=PLFHvL21g9bk3RxJ1Ut5nR_uTZFVOxu522">posted online</a> and I encourage you to check them out. So, let's see what our teams are up to.</p>
 <h2><a class="anchor" aria-hidden="true" id="teams"></a><a href="#teams" 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>Teams</h2>
 <p>On this second meeting, we had 9 teams join us:</p>
 <ul>
@@ -122,7 +126,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for August 16, 2017. As this was only our second meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/TomislavTenodi">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #2" data-url="https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #2" data-url="https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/08/07/react-native-performance-in-marketplace.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -57,7 +61,7 @@
 <p>The lesson so far has been to <em>measure, measure, measure!</em> Some wins come from moving run-time costs to build time, such as Relay Modern and <a href="https://github.com/facebook/react-native/commit/797ca6c219b2a44f88f10c61d91e8cc21e2f306e">Lazy NativeModules</a>. Other wins come from avoiding work by being smarter about parallelizing code or removing dead code. And some wins come from large architectural changes to React Native, such as cleaning up thread blockages. There is no grand solution to performance, and longer-term performance wins will come from incremental instrumentation and improvements. Do not let cognitive bias influence your decisions. Instead, carefully gather and interpret production data to guide future work.</p>
 <h2><a class="anchor" aria-hidden="true" id="future-plans"></a><a href="#future-plans" 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>Future plans</h2>
 <p>In the long term, we want Marketplace TTI to be comparable to similar products built with Native, and, in general, have React Native performance on par with native performance. Further more, although this half we drastically reduced the bridge startup cost by about 80%, we plan to bring the cost of the React Native bridge close to zero via projects like <a href="https://prepack.io/">Prepack</a> and more build time processing.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Performance in Marketplace" data-url="https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace" data-related="reactnative" data-via="AaaChiuuu" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Performance in Marketplace" data-url="https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace" data-related="reactnative" data-via="AaaChiuuu" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/08/07/react-native-performance-in-marketplace/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -57,7 +61,7 @@
 <p>The lesson so far has been to <em>measure, measure, measure!</em> Some wins come from moving run-time costs to build time, such as Relay Modern and <a href="https://github.com/facebook/react-native/commit/797ca6c219b2a44f88f10c61d91e8cc21e2f306e">Lazy NativeModules</a>. Other wins come from avoiding work by being smarter about parallelizing code or removing dead code. And some wins come from large architectural changes to React Native, such as cleaning up thread blockages. There is no grand solution to performance, and longer-term performance wins will come from incremental instrumentation and improvements. Do not let cognitive bias influence your decisions. Instead, carefully gather and interpret production data to guide future work.</p>
 <h2><a class="anchor" aria-hidden="true" id="future-plans"></a><a href="#future-plans" 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>Future plans</h2>
 <p>In the long term, we want Marketplace TTI to be comparable to similar products built with Native, and, in general, have React Native performance on par with native performance. Further more, although this half we drastically reduced the bridge startup cost by about 80%, we plan to bring the cost of the React Native bridge close to zero via projects like <a href="https://prepack.io/">Prepack</a> and more build time processing.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Performance in Marketplace" data-url="https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace" data-related="reactnative" data-via="AaaChiuuu" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Performance in Marketplace" data-url="https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace" data-related="reactnative" data-via="AaaChiuuu" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/08/30/react-native-monthly-3.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/08/30/react-native-monthly-3">React Native Monthly #3</a></h1><p class="post-meta">August 30, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! This month's meeting was a bit shorter as most of our teams were busy shipping. Next month, we are at <a href="https://react-native.eu/">React Native EU</a> conference in Wroclaw, Poland. Make sure to grab a ticket and see you there in person! Meanwhile, let's see what our teams are up to.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/08/30/react-native-monthly-3">React Native Monthly #3</a></h1><p class="post-meta">August 30, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg" alt="Mike Grabowski"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! This month's meeting was a bit shorter as most of our teams were busy shipping. Next month, we are at <a href="https://react-native.eu/">React Native EU</a> conference in Wroclaw, Poland. Make sure to grab a ticket and see you there in person! Meanwhile, let's see what our teams are up to.</p>
 <h2><a class="anchor" aria-hidden="true" id="teams"></a><a href="#teams" 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>Teams</h2>
 <p>On this third meeting, we had 5 teams join us:</p>
 <ul>
@@ -74,7 +78,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for Wednesday 13, September 2017. As this was only our third meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/grabbou">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #3" data-url="https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3" data-related="reactnative" data-via="grabbou" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #3" data-url="https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3" data-related="reactnative" data-via="grabbou" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/08/30/react-native-monthly-3/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/08/30/react-native-monthly-3">React Native Monthly #3</a></h1><p class="post-meta">August 30, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! This month's meeting was a bit shorter as most of our teams were busy shipping. Next month, we are at <a href="https://react-native.eu/">React Native EU</a> conference in Wroclaw, Poland. Make sure to grab a ticket and see you there in person! Meanwhile, let's see what our teams are up to.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/08/30/react-native-monthly-3">React Native Monthly #3</a></h1><p class="post-meta">August 30, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg" alt="Mike Grabowski"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! This month's meeting was a bit shorter as most of our teams were busy shipping. Next month, we are at <a href="https://react-native.eu/">React Native EU</a> conference in Wroclaw, Poland. Make sure to grab a ticket and see you there in person! Meanwhile, let's see what our teams are up to.</p>
 <h2><a class="anchor" aria-hidden="true" id="teams"></a><a href="#teams" 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>Teams</h2>
 <p>On this third meeting, we had 5 teams join us:</p>
 <ul>
@@ -74,7 +78,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for Wednesday 13, September 2017. As this was only our third meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/grabbou">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #3" data-url="https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3" data-related="reactnative" data-via="grabbou" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #3" data-url="https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3" data-related="reactnative" data-via="grabbou" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/09/21/react-native-monthly-4.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/09/21/react-native-monthly-4">React Native Monthly #4</a></h1><p class="post-meta">September 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! Here are the notes from each team:</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/09/21/react-native-monthly-4">React Native Monthly #4</a></h1><p class="post-meta">September 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg" alt="Mike Grabowski"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! Here are the notes from each team:</p>
 <h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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>Callstack</h3>
 <ul>
 <li><a href="https://react-native.eu">React Native EU</a> is over. More than 300 participants from 33 countries have visited Wroclaw. Talks can be found <a href="https://www.youtube.com/channel/UCUNE_g1mQPuyW975WjgjYxA/videos">on Youtube</a>.</li>
@@ -61,7 +65,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for Wednesday 10, October 2017. As this was only our fourth meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/grabbou">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #4" data-url="https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4" data-related="reactnative" data-via="grabbou" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #4" data-url="https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4" data-related="reactnative" data-via="grabbou" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/09/21/react-native-monthly-4/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/09/21/react-native-monthly-4">React Native Monthly #4</a></h1><p class="post-meta">September 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! Here are the notes from each team:</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/09/21/react-native-monthly-4">React Native Monthly #4</a></h1><p class="post-meta">September 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg" alt="Mike Grabowski"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! Here are the notes from each team:</p>
 <h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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>Callstack</h3>
 <ul>
 <li><a href="https://react-native.eu">React Native EU</a> is over. More than 300 participants from 33 countries have visited Wroclaw. Talks can be found <a href="https://www.youtube.com/channel/UCUNE_g1mQPuyW975WjgjYxA/videos">on Youtube</a>.</li>
@@ -61,7 +65,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for Wednesday 10, October 2017. As this was only our fourth meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/grabbou">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #4" data-url="https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4" data-related="reactnative" data-via="grabbou" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #4" data-url="https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4" data-related="reactnative" data-via="grabbou" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/11/06/react-native-monthly-5.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/11/06/react-native-monthly-5">React Native Monthly #5</a></h1><p class="post-meta">November 6, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! Let's see what our teams are up to.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/11/06/react-native-monthly-5">React Native Monthly #5</a></h1><p class="post-meta">November 6, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! Let's see what our teams are up to.</p>
 <h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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>Callstack</h3>
 <ul>
 <li>We’ve been working on React Native CI. Most importantly, we have migrated from Travis to Circle, leaving React Native with a single, unified CI pipeline.</li>
@@ -93,7 +97,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for Wednesday 6, December 2017. Feel free to ping me <a href="https://twitter.com/TomislavTenodi">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #5" data-url="https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #5" data-url="https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2017/11/06/react-native-monthly-5/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/11/06/react-native-monthly-5">React Native Monthly #5</a></h1><p class="post-meta">November 6, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! Let's see what our teams are up to.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/11/06/react-native-monthly-5">React Native Monthly #5</a></h1><p class="post-meta">November 6, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><div><span><p>The React Native monthly meeting continues! Let's see what our teams are up to.</p>
 <h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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>Callstack</h3>
 <ul>
 <li>We’ve been working on React Native CI. Most importantly, we have migrated from Travis to Circle, leaving React Native with a single, unified CI pipeline.</li>
@@ -93,7 +97,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for Wednesday 6, December 2017. Feel free to ping me <a href="https://twitter.com/TomislavTenodi">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #5" data-url="https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #5" data-url="https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/01/09/react-native-monthly-6.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/09/react-native-monthly-6">React Native Monthly #6</a></h1><p class="post-meta">January 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><div><span><p>The React Native monthly meeting is still going strong! Make sure to check a note on the bottom of this post for the next sessions.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/09/react-native-monthly-6">React Native Monthly #6</a></h1><p class="post-meta">January 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><div><span><p>The React Native monthly meeting is still going strong! Make sure to check a note on the bottom of this post for the next sessions.</p>
 <h3><a class="anchor" aria-hidden="true" id="expo"></a><a href="#expo" 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>Expo</h3>
 <ul>
 <li>Congratulations to <a href="https://github.com/dabbott">Devin Abbott</a> and <a href="https://twitter.com/hdjirdeh">Houssein Djirdeh</a> on their pre-release of the &quot;Full Stack React Native&quot; book! It walks you through learning React Native by building several small apps. You can try those apps out on <a href="https://www.fullstackreact.com/react-native/">https://www.fullstackreact.com/react-native/</a> before buying the book.</li>
@@ -73,7 +77,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-sessions"></a><a href="#next-sessions" 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>Next sessions</h2>
 <p>There's been some discussion on re-purposing this meeting to discuss a single and specific topic (e.g. navigation, moving React Native modules into separate repos, documentation, ...). That way we feel we can contribute the best to React Native community. It might take place in the next meeting session. Feel free to tweet what you'd like to see covered as a topic.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #6" data-url="https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #6" data-url="https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/01/09/react-native-monthly-6/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/09/react-native-monthly-6">React Native Monthly #6</a></h1><p class="post-meta">January 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><div><span><p>The React Native monthly meeting is still going strong! Make sure to check a note on the bottom of this post for the next sessions.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/09/react-native-monthly-6">React Native Monthly #6</a></h1><p class="post-meta">January 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><div><span><p>The React Native monthly meeting is still going strong! Make sure to check a note on the bottom of this post for the next sessions.</p>
 <h3><a class="anchor" aria-hidden="true" id="expo"></a><a href="#expo" 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>Expo</h3>
 <ul>
 <li>Congratulations to <a href="https://github.com/dabbott">Devin Abbott</a> and <a href="https://twitter.com/hdjirdeh">Houssein Djirdeh</a> on their pre-release of the &quot;Full Stack React Native&quot; book! It walks you through learning React Native by building several small apps. You can try those apps out on <a href="https://www.fullstackreact.com/react-native/">https://www.fullstackreact.com/react-native/</a> before buying the book.</li>
@@ -73,7 +77,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-sessions"></a><a href="#next-sessions" 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>Next sessions</h2>
 <p>There's been some discussion on re-purposing this meeting to discuss a single and specific topic (e.g. navigation, moving React Native modules into separate repos, documentation, ...). That way we feel we can contribute the best to React Native community. It might take place in the next meeting session. Feel free to tweet what you'd like to see covered as a topic.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #6" data-url="https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="React Native Monthly #6" data-url="https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6" data-related="reactnative" data-via="TomislavTenodi" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native">Implementing Twitter’s App Loading Animation in React Native</a></h1><p class="post-meta">January 18, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener">Eli White</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/249164?s=460&amp;v=4"/></a></div></div></header><div><span><p>Twitter’s iOS app has a loading animation I quite enjoy.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native">Implementing Twitter’s App Loading Animation in React Native</a></h1><p class="post-meta">January 18, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener">Eli White</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/249164?s=460&amp;v=4" alt="Eli White"/></a></div></div></header><div><span><p>Twitter’s iOS app has a loading animation I quite enjoy.</p>
 <p><img src="/react-native/blog/assets/loading-screen-01.gif" style="float: left; padding-right: 80px; padding-bottom: 20px"/></p>
 <p>Once the app is ready, the Twitter logo delightfully expands, revealing the app.</p>
 <p>I wanted to figure out how to recreate this loading animation with React Native.</p>
@@ -64,7 +68,7 @@
 <h2><a class="anchor" aria-hidden="true" id="now-for-the-react-native"></a><a href="#now-for-the-react-native" 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>Now, for the React Native</h2>
 <p>Alrighty. Now that we know what we are building and how the animation works, we can get down to the code — the reason you are really here.</p>
 <p>The main piece of this puzzle is <a href="https://facebook.github.io/react-native/docs/maskedviewios.html">MaskedViewIOS</a>, a core React Native component.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">import</span> {MaskedViewIOS} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">import</span> {MaskedViewIOS} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
 
 <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">MaskedViewIOS</span> <span class="hljs-attr">maskElement</span>=<span class="hljs-string">{</span>&lt;<span class="hljs-attr">Text</span>&gt;</span>Basic Mask<span class="hljs-tag">&lt;/<span class="hljs-name">Text</span>&gt;</span>}&gt;
   <span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{{backgroundColor:</span> '<span class="hljs-attr">blue</span>'}} /&gt;</span>
@@ -72,7 +76,7 @@
 </span></code></pre>
 <p><code>MaskedViewIOS</code> takes props <code>maskElement</code> and <code>children</code>. The children are masked by the <code>maskElement</code>. Note that the mask doesn’t need to be an image, it can be any arbitrary view. The behavior of the above example would be to render the blue view, but for it to be visible only where the words “Basic Mask” are from the <code>maskElement</code>. We just made complicated blue text.</p>
 <p>What we want to do is render our blue layer, and then on top render our masked app and white layers with the Twitter logo.</p>
-<pre><code class="hljs css languages- javascript">{
+<pre><code class="hljs css language-javascript">{
   fullScreenBlueLayer;
 }
 &lt;MaskedViewIOS
@@ -108,12 +112,12 @@
 <p><code>Animated.Value</code> is a wrapper around a native value that Animated uses to know the state of an animation. You typically want to only have one of these for a complete animation. Most components that use Animated will store the value in state.</p>
 <p>Since I’m thinking about this animation as steps occurring at different points in time along the complete animation, we will start our <code>Animated.Value</code> at 0, representing 0% complete, and end our value at 100, representing 100% complete.</p>
 <p>Our initial component state will be the following.</p>
-<pre><code class="hljs css languages- javascript">state = {
+<pre><code class="hljs css language-javascript">state = {
   <span class="hljs-attr">loadingProgress</span>: <span class="hljs-keyword">new</span> Animated.Value(<span class="hljs-number">0</span>),
 };
 </code></pre>
 <p>When we are ready to begin the animation, we tell Animated to animate this value to 100.</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
+<pre><code class="hljs css language-javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
   <span class="hljs-attr">toValue</span>: <span class="hljs-number">100</span>,
   <span class="hljs-attr">duration</span>: <span class="hljs-number">1000</span>,
   <span class="hljs-attr">useNativeDriver</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">// This is important!</span>
@@ -126,7 +130,7 @@
 <p>The app scale starts at 1.1 and scales down to its regular scale by the end of the animation.</p>
 <h2><a class="anchor" aria-hidden="true" id="and-now-in-code"></a><a href="#and-now-in-code" 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>And now, in code.</h2>
 <p>What we essentially did above is map the values from the animation progress percentage to the values for the individual pieces. We do that with Animated using <code>.interpolate</code>. We create 3 different style objects, one for each piece of the animation, using interpolated values based off of <code>this.state.loadingProgress</code>.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> loadingProgress = <span class="hljs-keyword">this</span>.state.loadingProgress;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> loadingProgress = <span class="hljs-keyword">this</span>.state.loadingProgress;
 
 <span class="hljs-keyword">const</span> opacityClearToVisible = {
   <span class="hljs-attr">opacity</span>: loadingProgress.interpolate({
@@ -160,7 +164,7 @@
 };
 </code></pre>
 <p>Now that we have these style objects, we can use them when rendering the snippet of the view from earlier in the post. Note that only <code>Animated.View</code>, <code>Animated.Text</code>, and <code>Animated.Image</code> are able to use style objects that use <code>Animated.Value</code>.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = &lt;View style={styles.fullScreenBlueLayer} /&gt;;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = &lt;View style={styles.fullScreenBlueLayer} /&gt;;
 const fullScreenWhiteLayer = &lt;View style={styles.fullScreenWhiteLayer} /&gt;;
 
 return (
@@ -187,7 +191,7 @@ return (
 <p><img src="/react-native/blog/assets/loading-screen-06.gif" style="float: left; padding-right: 80px; padding-bottom: 20px"/></p>
 <p>Yay! We now have the animation pieces looking like we want. Now we just have to clean up our blue and white layers which will never be seen again.</p>
 <p>To know when we can clean them up, we need to know when the animation is complete. Luckily where we call, <code>Animated.timing</code> ,<code>.start</code> takes an optional callback that runs when the animation is complete.</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
+<pre><code class="hljs css language-javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
   <span class="hljs-attr">toValue</span>: <span class="hljs-number">100</span>,
   <span class="hljs-attr">duration</span>: <span class="hljs-number">1000</span>,
   <span class="hljs-attr">useNativeDriver</span>: <span class="hljs-literal">true</span>,
@@ -198,7 +202,7 @@ return (
 });
 </code></pre>
 <p>Now that we have a value in <code>state</code> to know whether we are done with the animation, we can modify our blue and white layers to use that.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = <span class="hljs-keyword">this</span>.state.animationDone ? <span class="hljs-literal">null</span> : (
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = <span class="hljs-keyword">this</span>.state.animationDone ? <span class="hljs-literal">null</span> : (
   &lt;View style={[styles.fullScreenBlueLayer]} /&gt;
 );
 const fullScreenWhiteLayer = this.state.animationDone ? null : (
@@ -216,7 +220,7 @@ const fullScreenWhiteLayer = this.state.animationDone ? null : (
 <li>The actual Twitter animation seems to speed up the mask reveal towards the end. Try modifying the loader to use a different easing function (or a spring!) to better match that behavior.</li>
 <li>The current end-scale of the mask is hard coded and likely won’t reveal the entire app on a tablet. Calculating the end scale based on screen size and image size would be an awesome PR.</li>
 </ol>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Implementing Twitter’s App Loading Animation in React Native" data-url="https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native" data-related="reactnative" data-via="eli_white" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Implementing Twitter’s App Loading Animation in React Native" data-url="https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native" data-related="reactnative" data-via="eli_white" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native">Implementing Twitter’s App Loading Animation in React Native</a></h1><p class="post-meta">January 18, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener">Eli White</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/249164?s=460&amp;v=4"/></a></div></div></header><div><span><p>Twitter’s iOS app has a loading animation I quite enjoy.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native">Implementing Twitter’s App Loading Animation in React Native</a></h1><p class="post-meta">January 18, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener">Eli White</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/249164?s=460&amp;v=4" alt="Eli White"/></a></div></div></header><div><span><p>Twitter’s iOS app has a loading animation I quite enjoy.</p>
 <p><img src="/react-native/blog/assets/loading-screen-01.gif" style="float: left; padding-right: 80px; padding-bottom: 20px"/></p>
 <p>Once the app is ready, the Twitter logo delightfully expands, revealing the app.</p>
 <p>I wanted to figure out how to recreate this loading animation with React Native.</p>
@@ -64,7 +68,7 @@
 <h2><a class="anchor" aria-hidden="true" id="now-for-the-react-native"></a><a href="#now-for-the-react-native" 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>Now, for the React Native</h2>
 <p>Alrighty. Now that we know what we are building and how the animation works, we can get down to the code — the reason you are really here.</p>
 <p>The main piece of this puzzle is <a href="https://facebook.github.io/react-native/docs/maskedviewios.html">MaskedViewIOS</a>, a core React Native component.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">import</span> {MaskedViewIOS} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">import</span> {MaskedViewIOS} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
 
 <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">MaskedViewIOS</span> <span class="hljs-attr">maskElement</span>=<span class="hljs-string">{</span>&lt;<span class="hljs-attr">Text</span>&gt;</span>Basic Mask<span class="hljs-tag">&lt;/<span class="hljs-name">Text</span>&gt;</span>}&gt;
   <span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{{backgroundColor:</span> '<span class="hljs-attr">blue</span>'}} /&gt;</span>
@@ -72,7 +76,7 @@
 </span></code></pre>
 <p><code>MaskedViewIOS</code> takes props <code>maskElement</code> and <code>children</code>. The children are masked by the <code>maskElement</code>. Note that the mask doesn’t need to be an image, it can be any arbitrary view. The behavior of the above example would be to render the blue view, but for it to be visible only where the words “Basic Mask” are from the <code>maskElement</code>. We just made complicated blue text.</p>
 <p>What we want to do is render our blue layer, and then on top render our masked app and white layers with the Twitter logo.</p>
-<pre><code class="hljs css languages- javascript">{
+<pre><code class="hljs css language-javascript">{
   fullScreenBlueLayer;
 }
 &lt;MaskedViewIOS
@@ -108,12 +112,12 @@
 <p><code>Animated.Value</code> is a wrapper around a native value that Animated uses to know the state of an animation. You typically want to only have one of these for a complete animation. Most components that use Animated will store the value in state.</p>
 <p>Since I’m thinking about this animation as steps occurring at different points in time along the complete animation, we will start our <code>Animated.Value</code> at 0, representing 0% complete, and end our value at 100, representing 100% complete.</p>
 <p>Our initial component state will be the following.</p>
-<pre><code class="hljs css languages- javascript">state = {
+<pre><code class="hljs css language-javascript">state = {
   <span class="hljs-attr">loadingProgress</span>: <span class="hljs-keyword">new</span> Animated.Value(<span class="hljs-number">0</span>),
 };
 </code></pre>
 <p>When we are ready to begin the animation, we tell Animated to animate this value to 100.</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
+<pre><code class="hljs css language-javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
   <span class="hljs-attr">toValue</span>: <span class="hljs-number">100</span>,
   <span class="hljs-attr">duration</span>: <span class="hljs-number">1000</span>,
   <span class="hljs-attr">useNativeDriver</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">// This is important!</span>
@@ -126,7 +130,7 @@
 <p>The app scale starts at 1.1 and scales down to its regular scale by the end of the animation.</p>
 <h2><a class="anchor" aria-hidden="true" id="and-now-in-code"></a><a href="#and-now-in-code" 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>And now, in code.</h2>
 <p>What we essentially did above is map the values from the animation progress percentage to the values for the individual pieces. We do that with Animated using <code>.interpolate</code>. We create 3 different style objects, one for each piece of the animation, using interpolated values based off of <code>this.state.loadingProgress</code>.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> loadingProgress = <span class="hljs-keyword">this</span>.state.loadingProgress;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> loadingProgress = <span class="hljs-keyword">this</span>.state.loadingProgress;
 
 <span class="hljs-keyword">const</span> opacityClearToVisible = {
   <span class="hljs-attr">opacity</span>: loadingProgress.interpolate({
@@ -160,7 +164,7 @@
 };
 </code></pre>
 <p>Now that we have these style objects, we can use them when rendering the snippet of the view from earlier in the post. Note that only <code>Animated.View</code>, <code>Animated.Text</code>, and <code>Animated.Image</code> are able to use style objects that use <code>Animated.Value</code>.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = &lt;View style={styles.fullScreenBlueLayer} /&gt;;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = &lt;View style={styles.fullScreenBlueLayer} /&gt;;
 const fullScreenWhiteLayer = &lt;View style={styles.fullScreenWhiteLayer} /&gt;;
 
 return (
@@ -187,7 +191,7 @@ return (
 <p><img src="/react-native/blog/assets/loading-screen-06.gif" style="float: left; padding-right: 80px; padding-bottom: 20px"/></p>
 <p>Yay! We now have the animation pieces looking like we want. Now we just have to clean up our blue and white layers which will never be seen again.</p>
 <p>To know when we can clean them up, we need to know when the animation is complete. Luckily where we call, <code>Animated.timing</code> ,<code>.start</code> takes an optional callback that runs when the animation is complete.</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
+<pre><code class="hljs css language-javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
   <span class="hljs-attr">toValue</span>: <span class="hljs-number">100</span>,
   <span class="hljs-attr">duration</span>: <span class="hljs-number">1000</span>,
   <span class="hljs-attr">useNativeDriver</span>: <span class="hljs-literal">true</span>,
@@ -198,7 +202,7 @@ return (
 });
 </code></pre>
 <p>Now that we have a value in <code>state</code> to know whether we are done with the animation, we can modify our blue and white layers to use that.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = <span class="hljs-keyword">this</span>.state.animationDone ? <span class="hljs-literal">null</span> : (
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = <span class="hljs-keyword">this</span>.state.animationDone ? <span class="hljs-literal">null</span> : (
   &lt;View style={[styles.fullScreenBlueLayer]} /&gt;
 );
 const fullScreenWhiteLayer = this.state.animationDone ? null : (
@@ -216,7 +220,7 @@ const fullScreenWhiteLayer = this.state.animationDone ? null : (
 <li>The actual Twitter animation seems to speed up the mask reveal towards the end. Try modifying the loader to use a different easing function (or a spring!) to better match that behavior.</li>
 <li>The current end-scale of the mask is hard coded and likely won’t reveal the entire app on a tablet. Calculating the end scale based on screen size and image size would be an awesome PR.</li>
 </ol>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Implementing Twitter’s App Loading Animation in React Native" data-url="https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native" data-related="reactnative" data-via="eli_white" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Implementing Twitter’s App Loading Animation in React Native" data-url="https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native" data-related="reactnative" data-via="eli_white" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/03/05/AWS-app-sync.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/05/AWS-app-sync">Using AWS with React Native</a></h1><p class="post-meta">March 5, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener">Richard Threlkeld</a>Senior Technical Product Manager at AWS Mobile</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/811239086581227520/APX1eZwF_400x400.jpg"/></a></div></div></header><div><span><p>AWS is well known in the technology industry as a provider of cloud services. These include compute, storage, and database technologies, as well as fully managed serverless offerings. The AWS Mobile team has been working closely with customers and members of the JavaScript ecosystem to make cloud-connected mobile and web applications more secure, scalable, and easier to develop and deploy. We began with a <a href="https://github.com/awslabs/aws-mobile-react-native-starter">complete starter kit</a>, but have a few more recent developments.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/05/AWS-app-sync">Using AWS with React Native</a></h1><p class="post-meta">March 5, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener">Richard Threlkeld</a>Senior Technical Product Manager at AWS Mobile</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/811239086581227520/APX1eZwF_400x400.jpg" alt="Richard Threlkeld"/></a></div></div></header><div><span><p>AWS is well known in the technology industry as a provider of cloud services. These include compute, storage, and database technologies, as well as fully managed serverless offerings. The AWS Mobile team has been working closely with customers and members of the JavaScript ecosystem to make cloud-connected mobile and web applications more secure, scalable, and easier to develop and deploy. We began with a <a href="https://github.com/awslabs/aws-mobile-react-native-starter">complete starter kit</a>, but have a few more recent developments.</p>
 <p>This blog post talks about some interesting things for React and React Native developers:</p>
 <ul>
 <li><a href="https://github.com/aws/aws-amplify"><strong>AWS Amplify</strong></a>, a declarative library for JavaScript applications using cloud services</li>
@@ -147,7 +151,7 @@ export <span class="hljs-keyword">default</span> withAuthenticator(<span class="
 <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/FtkVlIal_m0?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
 <h2><a class="anchor" aria-hidden="true" id="feedback"></a><a href="#feedback" 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>Feedback</h2>
 <p>The team behind the libraries is eager to hear how these libraries and services work for you. They also want to hear what else we can do to make React and React Native development with cloud services easier for you. Reach out to the AWS Mobile team on GitHub for <a href="https://github.com/aws/aws-amplify">AWS Amplify</a> or <a href="https://github.com/aws-samples/aws-mobile-appsync-events-starter-react-native">AWS AppSync</a>.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using AWS with React Native" data-url="https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync" data-related="reactnative" data-via="undef_obj" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using AWS with React Native" data-url="https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync" data-related="reactnative" data-via="undef_obj" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/03/05/AWS-app-sync/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/05/AWS-app-sync">Using AWS with React Native</a></h1><p class="post-meta">March 5, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener">Richard Threlkeld</a>Senior Technical Product Manager at AWS Mobile</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/811239086581227520/APX1eZwF_400x400.jpg"/></a></div></div></header><div><span><p>AWS is well known in the technology industry as a provider of cloud services. These include compute, storage, and database technologies, as well as fully managed serverless offerings. The AWS Mobile team has been working closely with customers and members of the JavaScript ecosystem to make cloud-connected mobile and web applications more secure, scalable, and easier to develop and deploy. We began with a <a href="https://github.com/awslabs/aws-mobile-react-native-starter">complete starter kit</a>, but have a few more recent developments.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/05/AWS-app-sync">Using AWS with React Native</a></h1><p class="post-meta">March 5, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener">Richard Threlkeld</a>Senior Technical Product Manager at AWS Mobile</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/811239086581227520/APX1eZwF_400x400.jpg" alt="Richard Threlkeld"/></a></div></div></header><div><span><p>AWS is well known in the technology industry as a provider of cloud services. These include compute, storage, and database technologies, as well as fully managed serverless offerings. The AWS Mobile team has been working closely with customers and members of the JavaScript ecosystem to make cloud-connected mobile and web applications more secure, scalable, and easier to develop and deploy. We began with a <a href="https://github.com/awslabs/aws-mobile-react-native-starter">complete starter kit</a>, but have a few more recent developments.</p>
 <p>This blog post talks about some interesting things for React and React Native developers:</p>
 <ul>
 <li><a href="https://github.com/aws/aws-amplify"><strong>AWS Amplify</strong></a>, a declarative library for JavaScript applications using cloud services</li>
@@ -147,7 +151,7 @@ export <span class="hljs-keyword">default</span> withAuthenticator(<span class="
 <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/FtkVlIal_m0?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
 <h2><a class="anchor" aria-hidden="true" id="feedback"></a><a href="#feedback" 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>Feedback</h2>
 <p>The team behind the libraries is eager to hear how these libraries and services work for you. They also want to hear what else we can do to make React and React Native development with cloud services easier for you. Reach out to the AWS Mobile team on GitHub for <a href="https://github.com/aws/aws-amplify">AWS Amplify</a> or <a href="https://github.com/aws-samples/aws-mobile-appsync-events-starter-react-native">AWS AppSync</a>.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using AWS with React Native" data-url="https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync" data-related="reactnative" data-via="undef_obj" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using AWS with React Native" data-url="https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync" data-related="reactnative" data-via="undef_obj" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/03/22/building-input-accessory-view-for-react-native.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native">Building &lt;InputAccessoryView&gt; For React Native</a></h1><p class="post-meta">March 22, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener">Peter Argany</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/6011080?s=400&amp;u=028e28081107d0ab16a5cb22baca43c080f5fa50&amp;v=4"/></a></div></div></header><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native">Building &lt;InputAccessoryView&gt; For React Native</a></h1><p class="post-meta">March 22, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener">Peter Argany</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/6011080?s=400&amp;u=028e28081107d0ab16a5cb22baca43c080f5fa50&amp;v=4" alt="Peter Argany"/></a></div></div></header><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
 <p>Three years ago, a GitHub issue was opened to support input accessory view from React Native.</p>
 <p><img src="/react-native/blog/assets/input-accessory-1.png"/></p>
 <p>In the ensuing years, there have been countless '+1s', various workarounds, and zero concrete changes to RN on this issue - until today. Starting with iOS, <a href="http://facebook.github.io/react-native/docs/next/inputaccessoryview.html">we're exposing an API</a> for accessing the native input accessory view and we are excited to share how we built it.</p>
@@ -70,7 +74,7 @@
 <hr style="clear: both; margin-bottom: 20px"/>
 <h2><a class="anchor" aria-hidden="true" id="example-usage"></a><a href="#example-usage" 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>Example Usage</h2>
 <p>Here's an example which builds a keyboard toolbar button to reset <code>&lt;TextInput&gt;</code> state.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">TextInputAccessoryViewExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span>&lt;</span>{}, *&gt; {
+<pre><code class="hljs css language-javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">TextInputAccessoryViewExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span>&lt;</span>{}, *&gt; {
   <span class="hljs-keyword">constructor</span>(props) {
     <span class="hljs-keyword">super</span>(props);
     <span class="hljs-keyword">this</span>.state = {<span class="hljs-attr">text</span>: <span class="hljs-string">'Placeholder Text'</span>};
@@ -103,7 +107,7 @@
 <h2><a class="anchor" aria-hidden="true" id="when-will-i-be-able-to-use-this"></a><a href="#when-will-i-be-able-to-use-this" 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>When will I be able to use this?</h2>
 <p>The full commit for this feature implementation is <a href="https://github.com/facebook/react-native/commit/38197c8230657d567170cdaf8ff4bbb4aee732b8">here</a>. <a href="http://facebook.github.io/react-native/docs/next/inputaccessoryview.html"><code>&lt;InputAccessoryView&gt;</code></a> will be available in the upcoming v0.55.0 release.</p>
 <p>Happy keyboarding :)</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Building &lt;InputAccessoryView&gt; For React Native" data-url="https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native" data-related="reactnative" data-via="peterargany" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Building &lt;InputAccessoryView&gt; For React Native" data-url="https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native" data-related="reactnative" data-via="peterargany" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/03/22/building-input-accessory-view-for-react-native/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native">Building &lt;InputAccessoryView&gt; For React Native</a></h1><p class="post-meta">March 22, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener">Peter Argany</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/6011080?s=400&amp;u=028e28081107d0ab16a5cb22baca43c080f5fa50&amp;v=4"/></a></div></div></header><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native">Building &lt;InputAccessoryView&gt; For React Native</a></h1><p class="post-meta">March 22, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener">Peter Argany</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/6011080?s=400&amp;u=028e28081107d0ab16a5cb22baca43c080f5fa50&amp;v=4" alt="Peter Argany"/></a></div></div></header><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
 <p>Three years ago, a GitHub issue was opened to support input accessory view from React Native.</p>
 <p><img src="/react-native/blog/assets/input-accessory-1.png"/></p>
 <p>In the ensuing years, there have been countless '+1s', various workarounds, and zero concrete changes to RN on this issue - until today. Starting with iOS, <a href="http://facebook.github.io/react-native/docs/next/inputaccessoryview.html">we're exposing an API</a> for accessing the native input accessory view and we are excited to share how we built it.</p>
@@ -70,7 +74,7 @@
 <hr style="clear: both; margin-bottom: 20px"/>
 <h2><a class="anchor" aria-hidden="true" id="example-usage"></a><a href="#example-usage" 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>Example Usage</h2>
 <p>Here's an example which builds a keyboard toolbar button to reset <code>&lt;TextInput&gt;</code> state.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">TextInputAccessoryViewExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span>&lt;</span>{}, *&gt; {
+<pre><code class="hljs css language-javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">TextInputAccessoryViewExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span>&lt;</span>{}, *&gt; {
   <span class="hljs-keyword">constructor</span>(props) {
     <span class="hljs-keyword">super</span>(props);
     <span class="hljs-keyword">this</span>.state = {<span class="hljs-attr">text</span>: <span class="hljs-string">'Placeholder Text'</span>};
@@ -103,7 +107,7 @@
 <h2><a class="anchor" aria-hidden="true" id="when-will-i-be-able-to-use-this"></a><a href="#when-will-i-be-able-to-use-this" 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>When will I be able to use this?</h2>
 <p>The full commit for this feature implementation is <a href="https://github.com/facebook/react-native/commit/38197c8230657d567170cdaf8ff4bbb4aee732b8">here</a>. <a href="http://facebook.github.io/react-native/docs/next/inputaccessoryview.html"><code>&lt;InputAccessoryView&gt;</code></a> will be available in the upcoming v0.55.0 release.</p>
 <p>Happy keyboarding :)</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Building &lt;InputAccessoryView&gt; For React Native" data-url="https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native" data-related="reactnative" data-via="peterargany" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Building &lt;InputAccessoryView&gt; For React Native" data-url="https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native" data-related="reactnative" data-via="peterargany" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/04/09/build-com-app.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/04/09/build-com-app">Built with React Native - The Build.com app</a></h1><p class="post-meta">April 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener">Garrett McCullough</a>Senior Mobile Engineer</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/955503100785172486/UrMKkQXc_400x400.jpg"/></a></div></div></header><div><span><p><a href="https://www.build.com/">Build.com</a>, headquartered in Chico, California, is one of the largest online retailers for home improvement items. The team has had a strong web-centric business for 18 years and began thinking about a mobile App in 2015. Building unique iOS and Android apps wasn’t practical due to our small team and limited native experience. Instead, we decided to take a risk on the very new React Native framework. Our initial commit was on August 12, 2015 using React Native v0.8.0! We were live in both App Stores on October 15, 2016. Over the last two years, we’ve continued to upgrade and expand the app. We are currently on React Native version 0.53.0.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/04/09/build-com-app">Built with React Native - The Build.com app</a></h1><p class="post-meta">April 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener">Garrett McCullough</a>Senior Mobile Engineer</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/955503100785172486/UrMKkQXc_400x400.jpg" alt="Garrett McCullough"/></a></div></div></header><div><span><p><a href="https://www.build.com/">Build.com</a>, headquartered in Chico, California, is one of the largest online retailers for home improvement items. The team has had a strong web-centric business for 18 years and began thinking about a mobile App in 2015. Building unique iOS and Android apps wasn’t practical due to our small team and limited native experience. Instead, we decided to take a risk on the very new React Native framework. Our initial commit was on August 12, 2015 using React Native v0.8.0! We were live in both App Stores on October 15, 2016. Over the last two years, we’ve continued to upgrade and expand the app. We are currently on React Native version 0.53.0.</p>
 <p>You can check out the app at <a href="https://www.build.com/app">https://www.build.com/app</a>.</p>
 <p align="center">
   <img src="/react-native/blog/assets/build-com-blog-image.jpg" />
@@ -82,7 +86,7 @@
 <li>Improve the experience for adding native libraries and bridge modules to a project</li>
 </ul>
 <p>Companies and individuals in the React Native community have been great about volunteering their time and effort to improve the tools that we all use. If you haven’t gotten involved in open source, I hope you’ll take a look at improving the code or documentation for some of the libraries that you use. There are a lot of articles to help you get started and it may be a lot easier than you think!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Built with React Native - The Build.com app" data-url="https://facebook.github.io/react-native/blog/2018/04/09/build-com-app" data-related="reactnative" data-via="gwmccull" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/04/09/build-com-app" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Built with React Native - The Build.com app" data-url="https://facebook.github.io/react-native/blog/2018/04/09/build-com-app" data-related="reactnative" data-via="gwmccull" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/04/09/build-com-app" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/04/09/build-com-app/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/04/09/build-com-app">Built with React Native - The Build.com app</a></h1><p class="post-meta">April 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener">Garrett McCullough</a>Senior Mobile Engineer</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/955503100785172486/UrMKkQXc_400x400.jpg"/></a></div></div></header><div><span><p><a href="https://www.build.com/">Build.com</a>, headquartered in Chico, California, is one of the largest online retailers for home improvement items. The team has had a strong web-centric business for 18 years and began thinking about a mobile App in 2015. Building unique iOS and Android apps wasn’t practical due to our small team and limited native experience. Instead, we decided to take a risk on the very new React Native framework. Our initial commit was on August 12, 2015 using React Native v0.8.0! We were live in both App Stores on October 15, 2016. Over the last two years, we’ve continued to upgrade and expand the app. We are currently on React Native version 0.53.0.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/04/09/build-com-app">Built with React Native - The Build.com app</a></h1><p class="post-meta">April 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener">Garrett McCullough</a>Senior Mobile Engineer</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/955503100785172486/UrMKkQXc_400x400.jpg" alt="Garrett McCullough"/></a></div></div></header><div><span><p><a href="https://www.build.com/">Build.com</a>, headquartered in Chico, California, is one of the largest online retailers for home improvement items. The team has had a strong web-centric business for 18 years and began thinking about a mobile App in 2015. Building unique iOS and Android apps wasn’t practical due to our small team and limited native experience. Instead, we decided to take a risk on the very new React Native framework. Our initial commit was on August 12, 2015 using React Native v0.8.0! We were live in both App Stores on October 15, 2016. Over the last two years, we’ve continued to upgrade and expand the app. We are currently on React Native version 0.53.0.</p>
 <p>You can check out the app at <a href="https://www.build.com/app">https://www.build.com/app</a>.</p>
 <p align="center">
   <img src="/react-native/blog/assets/build-com-blog-image.jpg" />
@@ -82,7 +86,7 @@
 <li>Improve the experience for adding native libraries and bridge modules to a project</li>
 </ul>
 <p>Companies and individuals in the React Native community have been great about volunteering their time and effort to improve the tools that we all use. If you haven’t gotten involved in open source, I hope you’ll take a look at improving the code or documentation for some of the libraries that you use. There are a lot of articles to help you get started and it may be a lot easier than you think!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Built with React Native - The Build.com app" data-url="https://facebook.github.io/react-native/blog/2018/04/09/build-com-app" data-related="reactnative" data-via="gwmccull" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/04/09/build-com-app" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Built with React Native - The Build.com app" data-url="https://facebook.github.io/react-native/blog/2018/04/09/build-com-app" data-related="reactnative" data-via="gwmccull" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/04/09/build-com-app" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/05/07/using-typescript-with-react-native.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,14 +33,14 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/05/07/using-typescript-with-react-native">Using TypeScript with React Native</a></h1><p class="post-meta">May 7, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener">Ash Furrow</a>Software Engineer at Artsy</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/498212?s=460&amp;v=4"/></a></div></div></header><div><span><p>JavaScript! We all love it. But some of us also love <a href="https://en.wikipedia.org/wiki/Data_type">types</a>. Luckily, options exist to add stronger types to JavaScript. My favourite is <a href="https://www.typescriptlang.org">TypeScript</a>, but React Native supports <a href="https://flow.org">Flow</a> out of the box. Which you prefer is a matter of preference, they each have their own approach on how to add the magic of types to JavaScript. Today, we're going to look at how to use TypeScript in React Native apps.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/05/07/using-typescript-with-react-native">Using TypeScript with React Native</a></h1><p class="post-meta">May 7, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener">Ash Furrow</a>Software Engineer at Artsy</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/498212?s=460&amp;v=4" alt="Ash Furrow"/></a></div></div></header><div><span><p>JavaScript! We all love it. But some of us also love <a href="https://en.wikipedia.org/wiki/Data_type">types</a>. Luckily, options exist to add stronger types to JavaScript. My favourite is <a href="https://www.typescriptlang.org">TypeScript</a>, but React Native supports <a href="https://flow.org">Flow</a> out of the box. Which you prefer is a matter of preference, they each have their own approach on how to add the magic of types to JavaScript. Today, we're going to look at how to use TypeScript in React Native apps.</p>
 <p>We'll be using Microsoft's <a href="https://github.com/Microsoft/TypeScript-React-Native-Starter">TypeScript-React-Native-Starter</a> repo as a guide.</p>
 <h2><a class="anchor" aria-hidden="true" id="prerequisites"></a><a href="#prerequisites" 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>Prerequisites</h2>
 <p>Because you might be developing on one of several different platforms, targeting several different types of devices, basic setup can be involved. You should first ensure that you can run a plain React Native app without TypeScript. Follow <a href="https://facebook.github.io/react-native/docs/getting-started.html">the instructions on the React Native website to get started</a>. When you've managed to deploy to a device or emulator, you'll be ready to start a TypeScript React Native app.</p>
 <p>You will also need <a href="https://nodejs.org/en/">Node.js</a>, <a href="https://www.npmjs.com">npm</a>, and <a href="https://yarnpkg.com/lang/en">Yarn</a>.</p>
 <h2><a class="anchor" aria-hidden="true" id="initializing"></a><a href="#initializing" 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>Initializing</h2>
 <p>Once you've tried scaffolding out an ordinary React Native project, you'll be ready to start adding TypeScript. Let's go ahead and do that.</p>
-<pre><code class="hljs css languages- sh">react-native init MyAwesomeProject
+<pre><code class="hljs css language-sh">react-native init MyAwesomeProject
 <span class="hljs-built_in">cd</span> MyAwesomeProject
 </code></pre>
 <h2><a class="anchor" aria-hidden="true" id="adding-typescript"></a><a href="#adding-typescript" 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>Adding TypeScript</h2>
@@ -49,20 +53,20 @@
 <li>adds <a href="https://github.com/DefinitelyTyped/DefinitelyTyped">typings</a> for React and React Native</li>
 </ul>
 <p>Okay, let's go ahead and run these.</p>
-<pre><code class="hljs css languages- sh">yarn add --dev typescript
+<pre><code class="hljs css language-sh">yarn add --dev typescript
 yarn add --dev react-native-typescript-transformer
 yarn tsc --init --pretty --jsx react
 touch rn-cli.config.js
 yarn add --dev @types/react @types/react-native
 </code></pre>
 <p>The <code>tsconfig.json</code> file contains all the settings for the TypeScript compiler. The defaults created by the command above are mostly fine, but open the file and uncomment the following line:</p>
-<pre><code class="hljs css languages- js">{
+<pre><code class="hljs css language-js">{
   <span class="hljs-comment">/* Search the config file for the following line and uncomment it. */</span>
   <span class="hljs-comment">// "allowSyntheticDefaultImports": true,  /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */</span>
 }
 </code></pre>
 <p>The <code>rn-cli.config.js</code> contains the settings for the React Native TypeScript Transformer. Open it and add the following:</p>
-<pre><code class="hljs css languages- js"><span class="hljs-built_in">module</span>.exports = {
+<pre><code class="hljs css language-js"><span class="hljs-built_in">module</span>.exports = {
   getTransformModulePath() {
     <span class="hljs-keyword">return</span> <span class="hljs-built_in">require</span>.resolve(<span class="hljs-string">'react-native-typescript-transformer'</span>);
   },
@@ -74,7 +78,7 @@ yarn add --dev @types/react @types/react-native
 <h2><a class="anchor" aria-hidden="true" id="migrating-to-typescript"></a><a href="#migrating-to-typescript" 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>Migrating to TypeScript</h2>
 <p>Rename the generated <code>App.js</code> and <code>__tests_/App.js</code> files to <code>App.tsx</code>. <code>index.js</code> needs to use the <code>.js</code> extension. All new files should use the <code>.tsx</code> extension (or <code>.ts</code> if the file doesn't contain any JSX).</p>
 <p>If you tried to run the app now, you'd get an error like <code>object prototype may only be an object or null</code>. This is caused by a failure to import the default export from React as well as a named export on the same line. Open <code>App.tsx</code> and modify the import at the top of the file:</p>
-<pre><code class="hljs css languages- diff"><span class="hljs-deletion">-import React, { Component } from 'react';</span>
+<pre><code class="hljs css language-diff"><span class="hljs-deletion">-import React, { Component } from 'react';</span>
 <span class="hljs-addition">+import React from 'react'</span>
 <span class="hljs-addition">+import { Component } from 'react';</span>
 </code></pre>
@@ -82,10 +86,10 @@ yarn add --dev @types/react @types/react-native
 <p>At this point, you should be able to run the React Native app.</p>
 <h2><a class="anchor" aria-hidden="true" id="adding-typescript-testing-infrastructure"></a><a href="#adding-typescript-testing-infrastructure" 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>Adding TypeScript Testing Infrastructure</h2>
 <p>React Native ships with <a href="https://github.com/facebook/jest">Jest</a>, so for testing a React Native app with TypeScript, we'll want to add <a href="https://www.npmjs.com/package/ts-jest">ts-jest</a> to our <code>devDependencies</code>.</p>
-<pre><code class="hljs css languages- sh">yarn add --dev ts-jest
+<pre><code class="hljs css language-sh">yarn add --dev ts-jest
 </code></pre>
 <p>Then, we'll open up our <code>package.json</code> and replace the <code>jest</code> field with the following:</p>
-<pre><code class="hljs css languages- js">{
+<pre><code class="hljs css language-js">{
   <span class="hljs-string">"jest"</span>: {
     <span class="hljs-string">"preset"</span>: <span class="hljs-string">"react-native"</span>,
     <span class="hljs-string">"moduleFileExtensions"</span>: [
@@ -110,18 +114,18 @@ yarn add --dev @types/react @types/react-native
 <h2><a class="anchor" aria-hidden="true" id="installing-dependency-type-declarations"></a><a href="#installing-dependency-type-declarations" 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>Installing Dependency Type Declarations</h2>
 <p>To get the best experience in TypeScript, we want the type-checker to understand the shape and API of our dependencies. Some libraries will publish their packages with <code>.d.ts</code> files (type declaration/type definition files), which can describe the shape of the underlying JavaScript. For other libraries, we'll need to explicitly install the appropriate package in the <code>@types/</code> npm scope.</p>
 <p>For example, here we'll need types for Jest, React, and React Native, and React Test Renderer.</p>
-<pre><code class="hljs css languages- ts">yarn add --dev <span class="hljs-meta">@types</span>/jest <span class="hljs-meta">@types</span>/react <span class="hljs-meta">@types</span>/react-native <span class="hljs-meta">@types</span>/react-test-renderer
+<pre><code class="hljs css language-ts">yarn add --dev <span class="hljs-meta">@types</span>/jest <span class="hljs-meta">@types</span>/react <span class="hljs-meta">@types</span>/react-native <span class="hljs-meta">@types</span>/react-test-renderer
 </code></pre>
 <p>We saved these declaration file packages to our <em>dev</em> dependencies because this is a React Native <em>app</em> that only uses these dependencies during development and not during runtime. If we were publishing a library to NPM, we might have to add some of these type dependencies as regular dependencies.</p>
 <p>You can read more <a href="https://www.typescriptlang.org/docs/handbook/declaration-files/consumption.html">here about getting <code>.d.ts</code> files</a>.</p>
 <h2><a class="anchor" aria-hidden="true" id="ignoring-more-files"></a><a href="#ignoring-more-files" 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>Ignoring More Files</h2>
 <p>For your source control, you'll want to start ignoring the <code>.jest</code> folder. If you're using git, we can just add entries to our <code>.gitignore</code> file.</p>
-<pre><code class="hljs css languages- config"><span class="hljs-meta">#</span><span class="bash"> Jest</span>
+<pre><code class="hljs css language-config"><span class="hljs-meta">#</span><span class="bash"> Jest</span>
 <span class="hljs-meta">#</span><span class="bash"></span>
 .jest/
 </code></pre>
 <p>As a checkpoint, consider committing your files into version control.</p>
-<pre><code class="hljs css languages- sh">git init
+<pre><code class="hljs css language-sh">git init
 git add .gitignore <span class="hljs-comment"># import to do this first, to ignore our files</span>
 git add .
 git commit -am <span class="hljs-string">"Initial commit."</span>
@@ -129,7 +133,7 @@ git commit -am <span class="hljs-string">"Initial commit."</span>
 <h2><a class="anchor" aria-hidden="true" id="adding-a-component"></a><a href="#adding-a-component" 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>Adding a Component</h2>
 <p>Let's add a component to our app. Let's go ahead and create a <code>Hello.tsx</code> component. It's a pedagogical component, not something that you'd actually write in an app, but something nontrivial that shows off how to use TypeScript in React Native.</p>
 <p>Create a <code>components</code> directory and add the following example.</p>
-<pre><code class="hljs css languages- ts">// components/Hello.tsx
+<pre><code class="hljs css language-ts">// components/Hello.tsx
 import React from 'react';
 import {Button, StyleSheet, Text, View} from 'react-native';
 
@@ -225,10 +229,10 @@ const styles = StyleSheet.create({
 <h2><a class="anchor" aria-hidden="true" id="adding-a-component-test"></a><a href="#adding-a-component-test" 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>Adding a Component Test</h2>
 <p>Now that we've got a component, let's try testing it.</p>
 <p>We already have Jest installed as a test runner. We're going to write snapshot tests for our components, let's add the required add-on for snapshot tests:</p>
-<pre><code class="hljs css languages- sh">yarn add --dev react-addons-test-utils
+<pre><code class="hljs css language-sh">yarn add --dev react-addons-test-utils
 </code></pre>
 <p>Now let's create a <code>__tests__</code> folder in the <code>components</code> directory and add a test for <code>Hello.tsx</code>:</p>
-<pre><code class="hljs css languages- ts"><span class="hljs-comment">// components/__tests__/Hello.tsx</span>
+<pre><code class="hljs css language-ts"><span class="hljs-comment">// components/__tests__/Hello.tsx</span>
 <span class="hljs-keyword">import</span> React <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
 <span class="hljs-keyword">import</span> renderer <span class="hljs-keyword">from</span> <span class="hljs-string">'react-test-renderer'</span>;
 
@@ -245,7 +249,7 @@ it(<span class="hljs-string">'renders correctly with defaults'</span>, <span cla
 <h2><a class="anchor" aria-hidden="true" id="next-steps"></a><a href="#next-steps" 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>Next Steps</h2>
 <p>Check out the official <a href="https://reactjs.org/tutorial/tutorial.html">React tutorial</a> and state-management library <a href="http://redux.js.org">Redux</a>. These resources can be helpful when writing React Native apps. Additionally, you may want to look at <a href="https://microsoft.github.io/reactxp/">ReactXP</a>, a component library written entirely in TypeScript that supports both React on the web as well as React Native.</p>
 <p>Have fun in a more type-safe React Native development environment!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using TypeScript with React Native" data-url="https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native" data-related="reactnative" data-via="ashfurrow" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using TypeScript with React Native" data-url="https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native" data-related="reactnative" data-via="ashfurrow" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/05/07/using-typescript-with-react-native/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,14 +33,14 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/05/07/using-typescript-with-react-native">Using TypeScript with React Native</a></h1><p class="post-meta">May 7, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener">Ash Furrow</a>Software Engineer at Artsy</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/498212?s=460&amp;v=4"/></a></div></div></header><div><span><p>JavaScript! We all love it. But some of us also love <a href="https://en.wikipedia.org/wiki/Data_type">types</a>. Luckily, options exist to add stronger types to JavaScript. My favourite is <a href="https://www.typescriptlang.org">TypeScript</a>, but React Native supports <a href="https://flow.org">Flow</a> out of the box. Which you prefer is a matter of preference, they each have their own approach on how to add the magic of types to JavaScript. Today, we're going to look at how to use TypeScript in React Native apps.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/05/07/using-typescript-with-react-native">Using TypeScript with React Native</a></h1><p class="post-meta">May 7, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener">Ash Furrow</a>Software Engineer at Artsy</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/498212?s=460&amp;v=4" alt="Ash Furrow"/></a></div></div></header><div><span><p>JavaScript! We all love it. But some of us also love <a href="https://en.wikipedia.org/wiki/Data_type">types</a>. Luckily, options exist to add stronger types to JavaScript. My favourite is <a href="https://www.typescriptlang.org">TypeScript</a>, but React Native supports <a href="https://flow.org">Flow</a> out of the box. Which you prefer is a matter of preference, they each have their own approach on how to add the magic of types to JavaScript. Today, we're going to look at how to use TypeScript in React Native apps.</p>
 <p>We'll be using Microsoft's <a href="https://github.com/Microsoft/TypeScript-React-Native-Starter">TypeScript-React-Native-Starter</a> repo as a guide.</p>
 <h2><a class="anchor" aria-hidden="true" id="prerequisites"></a><a href="#prerequisites" 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>Prerequisites</h2>
 <p>Because you might be developing on one of several different platforms, targeting several different types of devices, basic setup can be involved. You should first ensure that you can run a plain React Native app without TypeScript. Follow <a href="https://facebook.github.io/react-native/docs/getting-started.html">the instructions on the React Native website to get started</a>. When you've managed to deploy to a device or emulator, you'll be ready to start a TypeScript React Native app.</p>
 <p>You will also need <a href="https://nodejs.org/en/">Node.js</a>, <a href="https://www.npmjs.com">npm</a>, and <a href="https://yarnpkg.com/lang/en">Yarn</a>.</p>
 <h2><a class="anchor" aria-hidden="true" id="initializing"></a><a href="#initializing" 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>Initializing</h2>
 <p>Once you've tried scaffolding out an ordinary React Native project, you'll be ready to start adding TypeScript. Let's go ahead and do that.</p>
-<pre><code class="hljs css languages- sh">react-native init MyAwesomeProject
+<pre><code class="hljs css language-sh">react-native init MyAwesomeProject
 <span class="hljs-built_in">cd</span> MyAwesomeProject
 </code></pre>
 <h2><a class="anchor" aria-hidden="true" id="adding-typescript"></a><a href="#adding-typescript" 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>Adding TypeScript</h2>
@@ -49,20 +53,20 @@
 <li>adds <a href="https://github.com/DefinitelyTyped/DefinitelyTyped">typings</a> for React and React Native</li>
 </ul>
 <p>Okay, let's go ahead and run these.</p>
-<pre><code class="hljs css languages- sh">yarn add --dev typescript
+<pre><code class="hljs css language-sh">yarn add --dev typescript
 yarn add --dev react-native-typescript-transformer
 yarn tsc --init --pretty --jsx react
 touch rn-cli.config.js
 yarn add --dev @types/react @types/react-native
 </code></pre>
 <p>The <code>tsconfig.json</code> file contains all the settings for the TypeScript compiler. The defaults created by the command above are mostly fine, but open the file and uncomment the following line:</p>
-<pre><code class="hljs css languages- js">{
+<pre><code class="hljs css language-js">{
   <span class="hljs-comment">/* Search the config file for the following line and uncomment it. */</span>
   <span class="hljs-comment">// "allowSyntheticDefaultImports": true,  /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */</span>
 }
 </code></pre>
 <p>The <code>rn-cli.config.js</code> contains the settings for the React Native TypeScript Transformer. Open it and add the following:</p>
-<pre><code class="hljs css languages- js"><span class="hljs-built_in">module</span>.exports = {
+<pre><code class="hljs css language-js"><span class="hljs-built_in">module</span>.exports = {
   getTransformModulePath() {
     <span class="hljs-keyword">return</span> <span class="hljs-built_in">require</span>.resolve(<span class="hljs-string">'react-native-typescript-transformer'</span>);
   },
@@ -74,7 +78,7 @@ yarn add --dev @types/react @types/react-native
 <h2><a class="anchor" aria-hidden="true" id="migrating-to-typescript"></a><a href="#migrating-to-typescript" 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>Migrating to TypeScript</h2>
 <p>Rename the generated <code>App.js</code> and <code>__tests_/App.js</code> files to <code>App.tsx</code>. <code>index.js</code> needs to use the <code>.js</code> extension. All new files should use the <code>.tsx</code> extension (or <code>.ts</code> if the file doesn't contain any JSX).</p>
 <p>If you tried to run the app now, you'd get an error like <code>object prototype may only be an object or null</code>. This is caused by a failure to import the default export from React as well as a named export on the same line. Open <code>App.tsx</code> and modify the import at the top of the file:</p>
-<pre><code class="hljs css languages- diff"><span class="hljs-deletion">-import React, { Component } from 'react';</span>
+<pre><code class="hljs css language-diff"><span class="hljs-deletion">-import React, { Component } from 'react';</span>
 <span class="hljs-addition">+import React from 'react'</span>
 <span class="hljs-addition">+import { Component } from 'react';</span>
 </code></pre>
@@ -82,10 +86,10 @@ yarn add --dev @types/react @types/react-native
 <p>At this point, you should be able to run the React Native app.</p>
 <h2><a class="anchor" aria-hidden="true" id="adding-typescript-testing-infrastructure"></a><a href="#adding-typescript-testing-infrastructure" 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>Adding TypeScript Testing Infrastructure</h2>
 <p>React Native ships with <a href="https://github.com/facebook/jest">Jest</a>, so for testing a React Native app with TypeScript, we'll want to add <a href="https://www.npmjs.com/package/ts-jest">ts-jest</a> to our <code>devDependencies</code>.</p>
-<pre><code class="hljs css languages- sh">yarn add --dev ts-jest
+<pre><code class="hljs css language-sh">yarn add --dev ts-jest
 </code></pre>
 <p>Then, we'll open up our <code>package.json</code> and replace the <code>jest</code> field with the following:</p>
-<pre><code class="hljs css languages- js">{
+<pre><code class="hljs css language-js">{
   <span class="hljs-string">"jest"</span>: {
     <span class="hljs-string">"preset"</span>: <span class="hljs-string">"react-native"</span>,
     <span class="hljs-string">"moduleFileExtensions"</span>: [
@@ -110,18 +114,18 @@ yarn add --dev @types/react @types/react-native
 <h2><a class="anchor" aria-hidden="true" id="installing-dependency-type-declarations"></a><a href="#installing-dependency-type-declarations" 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>Installing Dependency Type Declarations</h2>
 <p>To get the best experience in TypeScript, we want the type-checker to understand the shape and API of our dependencies. Some libraries will publish their packages with <code>.d.ts</code> files (type declaration/type definition files), which can describe the shape of the underlying JavaScript. For other libraries, we'll need to explicitly install the appropriate package in the <code>@types/</code> npm scope.</p>
 <p>For example, here we'll need types for Jest, React, and React Native, and React Test Renderer.</p>
-<pre><code class="hljs css languages- ts">yarn add --dev <span class="hljs-meta">@types</span>/jest <span class="hljs-meta">@types</span>/react <span class="hljs-meta">@types</span>/react-native <span class="hljs-meta">@types</span>/react-test-renderer
+<pre><code class="hljs css language-ts">yarn add --dev <span class="hljs-meta">@types</span>/jest <span class="hljs-meta">@types</span>/react <span class="hljs-meta">@types</span>/react-native <span class="hljs-meta">@types</span>/react-test-renderer
 </code></pre>
 <p>We saved these declaration file packages to our <em>dev</em> dependencies because this is a React Native <em>app</em> that only uses these dependencies during development and not during runtime. If we were publishing a library to NPM, we might have to add some of these type dependencies as regular dependencies.</p>
 <p>You can read more <a href="https://www.typescriptlang.org/docs/handbook/declaration-files/consumption.html">here about getting <code>.d.ts</code> files</a>.</p>
 <h2><a class="anchor" aria-hidden="true" id="ignoring-more-files"></a><a href="#ignoring-more-files" 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>Ignoring More Files</h2>
 <p>For your source control, you'll want to start ignoring the <code>.jest</code> folder. If you're using git, we can just add entries to our <code>.gitignore</code> file.</p>
-<pre><code class="hljs css languages- config"><span class="hljs-meta">#</span><span class="bash"> Jest</span>
+<pre><code class="hljs css language-config"><span class="hljs-meta">#</span><span class="bash"> Jest</span>
 <span class="hljs-meta">#</span><span class="bash"></span>
 .jest/
 </code></pre>
 <p>As a checkpoint, consider committing your files into version control.</p>
-<pre><code class="hljs css languages- sh">git init
+<pre><code class="hljs css language-sh">git init
 git add .gitignore <span class="hljs-comment"># import to do this first, to ignore our files</span>
 git add .
 git commit -am <span class="hljs-string">"Initial commit."</span>
@@ -129,7 +133,7 @@ git commit -am <span class="hljs-string">"Initial commit."</span>
 <h2><a class="anchor" aria-hidden="true" id="adding-a-component"></a><a href="#adding-a-component" 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>Adding a Component</h2>
 <p>Let's add a component to our app. Let's go ahead and create a <code>Hello.tsx</code> component. It's a pedagogical component, not something that you'd actually write in an app, but something nontrivial that shows off how to use TypeScript in React Native.</p>
 <p>Create a <code>components</code> directory and add the following example.</p>
-<pre><code class="hljs css languages- ts">// components/Hello.tsx
+<pre><code class="hljs css language-ts">// components/Hello.tsx
 import React from 'react';
 import {Button, StyleSheet, Text, View} from 'react-native';
 
@@ -225,10 +229,10 @@ const styles = StyleSheet.create({
 <h2><a class="anchor" aria-hidden="true" id="adding-a-component-test"></a><a href="#adding-a-component-test" 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>Adding a Component Test</h2>
 <p>Now that we've got a component, let's try testing it.</p>
 <p>We already have Jest installed as a test runner. We're going to write snapshot tests for our components, let's add the required add-on for snapshot tests:</p>
-<pre><code class="hljs css languages- sh">yarn add --dev react-addons-test-utils
+<pre><code class="hljs css language-sh">yarn add --dev react-addons-test-utils
 </code></pre>
 <p>Now let's create a <code>__tests__</code> folder in the <code>components</code> directory and add a test for <code>Hello.tsx</code>:</p>
-<pre><code class="hljs css languages- ts"><span class="hljs-comment">// components/__tests__/Hello.tsx</span>
+<pre><code class="hljs css language-ts"><span class="hljs-comment">// components/__tests__/Hello.tsx</span>
 <span class="hljs-keyword">import</span> React <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
 <span class="hljs-keyword">import</span> renderer <span class="hljs-keyword">from</span> <span class="hljs-string">'react-test-renderer'</span>;
 
@@ -245,7 +249,7 @@ it(<span class="hljs-string">'renders correctly with defaults'</span>, <span cla
 <h2><a class="anchor" aria-hidden="true" id="next-steps"></a><a href="#next-steps" 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>Next Steps</h2>
 <p>Check out the official <a href="https://reactjs.org/tutorial/tutorial.html">React tutorial</a> and state-management library <a href="http://redux.js.org">Redux</a>. These resources can be helpful when writing React Native apps. Additionally, you may want to look at <a href="https://microsoft.github.io/reactxp/">ReactXP</a>, a component library written entirely in TypeScript that supports both React on the web as well as React Native.</p>
 <p>Have fun in a more type-safe React Native development environment!</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using TypeScript with React Native" data-url="https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native" data-related="reactnative" data-via="ashfurrow" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Using TypeScript with React Native" data-url="https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native" data-related="reactnative" data-via="ashfurrow" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/06/14/state-of-react-native-2018.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/06/14/state-of-react-native-2018">State of React Native 2018</a></h1><p class="post-meta">June 14, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener">Sophie Alpert</a>Engineering Manager on React at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6820?s=460&amp;v=4"/></a></div></div></header><div><span><p>It's been a while since we last published a status update about React Native.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/06/14/state-of-react-native-2018">State of React Native 2018</a></h1><p class="post-meta">June 14, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener">Sophie Alpert</a>Engineering Manager on React at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6820?s=460&amp;v=4" alt="Sophie Alpert"/></a></div></div></header><div><span><p>It's been a while since we last published a status update about React Native.</p>
 <p>At Facebook, we're using React Native more than ever and for many important projects. One of our most popular products is Marketplace, one of the top-level tabs in our app which is used by 800 million people each month. Since its creation in 2015, all of Marketplace has been built with React Native, including over a hundred full-screen views throughout different parts of the app.</p>
 <p>We're also using React Native for many new parts of the app. If you watched the F8 keynote last month, you'll recognize Blood Donations, Crisis Response, Privacy Shortcuts, and Wellness Checks – all recent features built with React Native. And projects outside the main Facebook app are using React Native too. The new Oculus Go VR headset includes <a href="https://www.oculus.com/app/">a companion mobile app</a> that is fully built with React Native, not to mention React VR powering many experiences in the headset itself.</p>
 <p>Naturally, we also use many other technologies to build our apps. <a href="https://fblitho.com/">Litho</a> and <a href="https://componentkit.org/">ComponentKit</a> are two libraries we use extensively in our apps; both provide a React-like component API for building native screens. It's never been a goal for React Native to replace all other technologies – we are focused on making React Native itself better, but we love seeing other teams borrow ideas from React Native, like bringing <a href="https://instagram-engineering.com/instant-feedback-in-ios-engineering-workflows-c3f6508c76c8">instant reload</a> to non-JavaScript code too.</p>
@@ -45,7 +49,7 @@
 <p>Just as our architecture changes will help React Native interoperate more cleanly with other native infrastructure, React Native should be slimmer on the JavaScript side to fit better with the JavaScript ecosystem, which includes making the VM and bundler swappable. We know the pace of breaking changes can be hard to keep up with, so we'd like to find ways to have fewer major releases. Finally, we know that some teams are looking for more thorough documentation in topics like startup optimization, where our expertise hasn't yet been written down. Expect to see some of these changes over the coming year.</p>
 <p>If you're using React Native, you're part of our community; keep letting us know how we can make React Native better for you.</p>
 <p>React Native is just one tool in a mobile developer's toolbox, but it's one that we strongly believe in – and we're making it better every day, with over 2500 commits in the last year from 500+ contributors.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="State of React Native 2018" data-url="https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018" data-related="reactnative" data-via="sophiebits" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="State of React Native 2018" data-url="https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018" data-related="reactnative" data-via="sophiebits" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/06/14/state-of-react-native-2018/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/06/14/state-of-react-native-2018">State of React Native 2018</a></h1><p class="post-meta">June 14, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener">Sophie Alpert</a>Engineering Manager on React at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6820?s=460&amp;v=4"/></a></div></div></header><div><span><p>It's been a while since we last published a status update about React Native.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/06/14/state-of-react-native-2018">State of React Native 2018</a></h1><p class="post-meta">June 14, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener">Sophie Alpert</a>Engineering Manager on React at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6820?s=460&amp;v=4" alt="Sophie Alpert"/></a></div></div></header><div><span><p>It's been a while since we last published a status update about React Native.</p>
 <p>At Facebook, we're using React Native more than ever and for many important projects. One of our most popular products is Marketplace, one of the top-level tabs in our app which is used by 800 million people each month. Since its creation in 2015, all of Marketplace has been built with React Native, including over a hundred full-screen views throughout different parts of the app.</p>
 <p>We're also using React Native for many new parts of the app. If you watched the F8 keynote last month, you'll recognize Blood Donations, Crisis Response, Privacy Shortcuts, and Wellness Checks – all recent features built with React Native. And projects outside the main Facebook app are using React Native too. The new Oculus Go VR headset includes <a href="https://www.oculus.com/app/">a companion mobile app</a> that is fully built with React Native, not to mention React VR powering many experiences in the headset itself.</p>
 <p>Naturally, we also use many other technologies to build our apps. <a href="https://fblitho.com/">Litho</a> and <a href="https://componentkit.org/">ComponentKit</a> are two libraries we use extensively in our apps; both provide a React-like component API for building native screens. It's never been a goal for React Native to replace all other technologies – we are focused on making React Native itself better, but we love seeing other teams borrow ideas from React Native, like bringing <a href="https://instagram-engineering.com/instant-feedback-in-ios-engineering-workflows-c3f6508c76c8">instant reload</a> to non-JavaScript code too.</p>
@@ -45,7 +49,7 @@
 <p>Just as our architecture changes will help React Native interoperate more cleanly with other native infrastructure, React Native should be slimmer on the JavaScript side to fit better with the JavaScript ecosystem, which includes making the VM and bundler swappable. We know the pace of breaking changes can be hard to keep up with, so we'd like to find ways to have fewer major releases. Finally, we know that some teams are looking for more thorough documentation in topics like startup optimization, where our expertise hasn't yet been written down. Expect to see some of these changes over the coming year.</p>
 <p>If you're using React Native, you're part of our community; keep letting us know how we can make React Native better for you.</p>
 <p>React Native is just one tool in a mobile developer's toolbox, but it's one that we strongly believe in – and we're making it better every day, with over 2500 commits in the last year from 500+ contributors.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="State of React Native 2018" data-url="https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018" data-related="reactnative" data-via="sophiebits" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="State of React Native 2018" data-url="https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018" data-related="reactnative" data-via="sophiebits" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/07/04/releasing-react-native-056.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/07/04/releasing-react-native-056">Releasing 0.56</a></h1><p class="post-meta">July 4, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener">Lorenzo Sciandra</a>Core Maintainer &amp; React Native Developer at Drivetribe</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/16104054?s=460&amp;v=4"/></a></div></div></header><div><span><p>The long-awaited 0.56 version of React Native is now available 🎉. This blog post highlights some of the <a href="https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#highlights">changes</a> introduced in this new release. We also want to take the opportunity to explain what has kept us busy since March.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/07/04/releasing-react-native-056">Releasing 0.56</a></h1><p class="post-meta">July 4, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener">Lorenzo Sciandra</a>Core Maintainer &amp; React Native Developer at Drivetribe</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/16104054?s=460&amp;v=4" alt="Lorenzo Sciandra"/></a></div></div></header><div><span><p>The long-awaited 0.56 version of React Native is now available 🎉. This blog post highlights some of the <a href="https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#highlights">changes</a> introduced in this new release. We also want to take the opportunity to explain what has kept us busy since March.</p>
 <h3><a class="anchor" aria-hidden="true" id="the-breaking-changes-dilemma-or-when-to-release"></a><a href="#the-breaking-changes-dilemma-or-when-to-release" 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 breaking changes dilemma, or, &quot;when to release?&quot;</h3>
 <p>The <a href="https://facebook.github.io/react-native/docs/contributing#our-development-process">Contributor's Guide</a> explains the integration process that all changes to React Native go through. The project has is composed by <a href="https://github.com/facebook/react-native-website/issues/370">many different tools</a>, requiring coordination and constant support to keep everything working properly. Add to this the vibrant open source community that contributes back to the project, and you will get a sense of the mind-bending scale of it all.</p>
 <p>With React Native's impressive adoption, breaking changes must be made with great care, and the process is not as smooth as we'd like. A decision was made to skip the April and May releases to allow the core team to integrate and test a new set of breaking changes. <a href="https://github.com/react-native-community/react-native-releases/issues/14">Dedicated community communication</a> channels were used along the way to ensure that the June 2018 (<code>0.56.0</code>) release is as hassle-free as possible to adopt by those who patiently waited for the stable release.</p>
@@ -58,7 +62,7 @@
 <p>Happy coding everyone!</p>
 <p><a href="https://twitter.com/Kelset">Lorenzo</a>, <a href="https://github.com/turnrye">Ryan</a>, and the whole <a href="https://twitter.com/reactnative">React Native core team</a></p>
 <p><strong>PS:</strong> as always, we'd like to remind everyone that React Native is still in 0.x versioning because of the many changes still undergoing - so remember when upgrading that yes, probably, something may still crash or be broken. Be helpful towards each other in the issues and when submitting PRs - and remember to follow the <a href="https://code.fb.com/codeofconduct/">CoC</a> enforced: there's always a human on the other side of the screen.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Releasing 0.56" data-url="https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056" data-related="reactnative" data-via="kelset" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Releasing 0.56" data-url="https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056" data-related="reactnative" data-via="kelset" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/07/04/releasing-react-native-056/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/07/04/releasing-react-native-056">Releasing 0.56</a></h1><p class="post-meta">July 4, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener">Lorenzo Sciandra</a>Core Maintainer &amp; React Native Developer at Drivetribe</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/16104054?s=460&amp;v=4"/></a></div></div></header><div><span><p>The long-awaited 0.56 version of React Native is now available 🎉. This blog post highlights some of the <a href="https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#highlights">changes</a> introduced in this new release. We also want to take the opportunity to explain what has kept us busy since March.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/07/04/releasing-react-native-056">Releasing 0.56</a></h1><p class="post-meta">July 4, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener">Lorenzo Sciandra</a>Core Maintainer &amp; React Native Developer at Drivetribe</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/16104054?s=460&amp;v=4" alt="Lorenzo Sciandra"/></a></div></div></header><div><span><p>The long-awaited 0.56 version of React Native is now available 🎉. This blog post highlights some of the <a href="https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#highlights">changes</a> introduced in this new release. We also want to take the opportunity to explain what has kept us busy since March.</p>
 <h3><a class="anchor" aria-hidden="true" id="the-breaking-changes-dilemma-or-when-to-release"></a><a href="#the-breaking-changes-dilemma-or-when-to-release" 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 breaking changes dilemma, or, &quot;when to release?&quot;</h3>
 <p>The <a href="https://facebook.github.io/react-native/docs/contributing#our-development-process">Contributor's Guide</a> explains the integration process that all changes to React Native go through. The project has is composed by <a href="https://github.com/facebook/react-native-website/issues/370">many different tools</a>, requiring coordination and constant support to keep everything working properly. Add to this the vibrant open source community that contributes back to the project, and you will get a sense of the mind-bending scale of it all.</p>
 <p>With React Native's impressive adoption, breaking changes must be made with great care, and the process is not as smooth as we'd like. A decision was made to skip the April and May releases to allow the core team to integrate and test a new set of breaking changes. <a href="https://github.com/react-native-community/react-native-releases/issues/14">Dedicated community communication</a> channels were used along the way to ensure that the June 2018 (<code>0.56.0</code>) release is as hassle-free as possible to adopt by those who patiently waited for the stable release.</p>
@@ -58,7 +62,7 @@
 <p>Happy coding everyone!</p>
 <p><a href="https://twitter.com/Kelset">Lorenzo</a>, <a href="https://github.com/turnrye">Ryan</a>, and the whole <a href="https://twitter.com/reactnative">React Native core team</a></p>
 <p><strong>PS:</strong> as always, we'd like to remind everyone that React Native is still in 0.x versioning because of the many changes still undergoing - so remember when upgrading that yes, probably, something may still crash or be broken. Be helpful towards each other in the issues and when submitting PRs - and remember to follow the <a href="https://code.fb.com/codeofconduct/">CoC</a> enforced: there's always a human on the other side of the screen.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Releasing 0.56" data-url="https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056" data-related="reactnative" data-via="kelset" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Releasing 0.56" data-url="https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056" data-related="reactnative" data-via="kelset" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/08/13/react-native-accessibility-updates.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/08/13/react-native-accessibility-updates">Accessibility API Updates</a></h1><p class="post-meta">August 13, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener">Ziqi Chen</a>Student at UC Berkeley</p><div class="authorPhoto authorPhotoBig"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/13990087?s=400&amp;u=5841da1b6064341d52ecab70a586b6701d9f6978&amp;v=4"/></a></div></div></header><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/08/13/react-native-accessibility-updates">Accessibility API Updates</a></h1><p class="post-meta">August 13, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener">Ziqi Chen</a>Student at UC Berkeley</p><div class="authorPhoto authorPhotoBig"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/13990087?s=400&amp;u=5841da1b6064341d52ecab70a586b6701d9f6978&amp;v=4" alt="Ziqi Chen"/></a></div></div></header><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
 <p>As technology advances and mobile apps become increasingly important to everyday life, the necessity of creating accessible applications has likewise grown in importance.</p>
 <p>React Native's limited Accessibility API has always been a huge pain point for developers, so we've made a few updates to the Accessibility API to make it easier to create inclusive mobile applications.</p>
 <h2><a class="anchor" aria-hidden="true" id="problems-with-the-existing-api"></a><a href="#problems-with-the-existing-api" 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>Problems With the Existing API</h2>
@@ -110,7 +114,7 @@ accessibilityStates={[“selected”]}
 </code></pre>
 <p>These properties are already being used in Facebook's codebase. The codemod for Facebook was surprisingly simple. The jscodeshift script fixed about half of our instances, and the other half was fixed manually. Overall, the entire process took less than a few hours.</p>
 <p>Hopefully you will find the updated API useful! And please continue making apps accessible! #inclusion</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Accessibility API Updates" data-url="https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates" data-related="reactnative" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Accessibility API Updates" data-url="https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates" data-related="reactnative" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/08/13/react-native-accessibility-updates/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/08/13/react-native-accessibility-updates">Accessibility API Updates</a></h1><p class="post-meta">August 13, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener">Ziqi Chen</a>Student at UC Berkeley</p><div class="authorPhoto authorPhotoBig"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/13990087?s=400&amp;u=5841da1b6064341d52ecab70a586b6701d9f6978&amp;v=4"/></a></div></div></header><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/08/13/react-native-accessibility-updates">Accessibility API Updates</a></h1><p class="post-meta">August 13, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener">Ziqi Chen</a>Student at UC Berkeley</p><div class="authorPhoto authorPhotoBig"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/13990087?s=400&amp;u=5841da1b6064341d52ecab70a586b6701d9f6978&amp;v=4" alt="Ziqi Chen"/></a></div></div></header><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
 <p>As technology advances and mobile apps become increasingly important to everyday life, the necessity of creating accessible applications has likewise grown in importance.</p>
 <p>React Native's limited Accessibility API has always been a huge pain point for developers, so we've made a few updates to the Accessibility API to make it easier to create inclusive mobile applications.</p>
 <h2><a class="anchor" aria-hidden="true" id="problems-with-the-existing-api"></a><a href="#problems-with-the-existing-api" 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>Problems With the Existing API</h2>
@@ -110,7 +114,7 @@ accessibilityStates={[“selected”]}
 </code></pre>
 <p>These properties are already being used in Facebook's codebase. The codemod for Facebook was surprisingly simple. The jscodeshift script fixed about half of our instances, and the other half was fixed manually. Overall, the entire process took less than a few hours.</p>
 <p>Hopefully you will find the updated API useful! And please continue making apps accessible! #inclusion</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Accessibility API Updates" data-url="https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates" data-related="reactnative" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Accessibility API Updates" data-url="https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates" data-related="reactnative" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/08/27/wkwebview.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -32,7 +36,7 @@
         </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/08/27/wkwebview">Introducing new iOS WebViews</a></h1><p class="post-meta">August 27, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/rsnara" target="_blank" rel="noreferrer noopener">Ramanpreet Nara</a>Software Engineer at Facebook</p></div></header><div><span><p>For a long time now, Apple has discouraged using UIWebViews in favor of WKWebView. In iOS 12, which will be released in the upcoming months, <a href="https://developer.apple.com/videos/play/wwdc2018/234/?time=104">UIWebViews will be formally deprecated</a>. React Native's iOS WebView implementation relies heavily on the UIWebView class. Therefore, in light of these developments, we've built a new native iOS backend to the WebView React Native component that uses WKWebView.</p>
 <p>The tail end of these changes were landed in <a href="https://github.com/facebook/react-native/commit/33b353c97c31190439a22febbd3d2a9ead49d3c9">this commit</a>, and will become available in the 0.57 release.</p>
 <p>To opt into this new implementation, please use the <a href="/react-native/docs/next/webview#usewebkit"><code>useWebKit</code></a> prop:</p>
-<pre><code class="hljs css languages- js">&lt;WebView useWebKit={<span class="hljs-literal">true</span>} source={{<span class="hljs-attr">url</span>: <span class="hljs-string">'https://www.google.com'</span>}} /&gt;
+<pre><code class="hljs css language-js">&lt;WebView useWebKit={<span class="hljs-literal">true</span>} source={{<span class="hljs-attr">url</span>: <span class="hljs-string">'https://www.google.com'</span>}} /&gt;
 </code></pre>
 <h2><a class="anchor" aria-hidden="true" id="improvements"></a><a href="#improvements" 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>Improvements</h2>
 <p><code>UIWebView</code> had no legitimate way to facilitate communication between the JavaScript running in the WebView, and React Native. When messages were sent from the WebView, we relied on a hack to deliver them to React Native. Succinctly, we encoded the message data into a url with a special scheme, and navigated the WebView to it. On the native side, we intercepted and cancelled this navigation, parsed the data from the url, and finally called into React Native. This implementation was error prone and insecure. I'm glad to announce that we've leveraged <code>WKWebView</code> features to completely replace it.</p>
@@ -47,7 +51,7 @@
 <p><strong>Not supported:</strong></p>
 <p><code>scalesPageToFit</code> (<a href="https://github.com/facebook/react-native/commit/b18fddadfeae5512690a0a059a4fa80c864f43a3">commit</a>)</p>
 <p>WKWebView didn't support the scalesPageToFit prop, so we couldn't implement this on the WebView React Native component.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing new iOS WebViews" data-url="https://facebook.github.io/react-native/blog/2018/08/27/wkwebview" data-related="reactnative" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/08/27/wkwebview" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing new iOS WebViews" data-url="https://facebook.github.io/react-native/blog/2018/08/27/wkwebview" data-related="reactnative" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/08/27/wkwebview" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/2018/08/27/wkwebview/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -32,7 +36,7 @@
         </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="lonePost"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/08/27/wkwebview">Introducing new iOS WebViews</a></h1><p class="post-meta">August 27, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/rsnara" target="_blank" rel="noreferrer noopener">Ramanpreet Nara</a>Software Engineer at Facebook</p></div></header><div><span><p>For a long time now, Apple has discouraged using UIWebViews in favor of WKWebView. In iOS 12, which will be released in the upcoming months, <a href="https://developer.apple.com/videos/play/wwdc2018/234/?time=104">UIWebViews will be formally deprecated</a>. React Native's iOS WebView implementation relies heavily on the UIWebView class. Therefore, in light of these developments, we've built a new native iOS backend to the WebView React Native component that uses WKWebView.</p>
 <p>The tail end of these changes were landed in <a href="https://github.com/facebook/react-native/commit/33b353c97c31190439a22febbd3d2a9ead49d3c9">this commit</a>, and will become available in the 0.57 release.</p>
 <p>To opt into this new implementation, please use the <a href="/react-native/docs/next/webview#usewebkit"><code>useWebKit</code></a> prop:</p>
-<pre><code class="hljs css languages- js">&lt;WebView useWebKit={<span class="hljs-literal">true</span>} source={{<span class="hljs-attr">url</span>: <span class="hljs-string">'https://www.google.com'</span>}} /&gt;
+<pre><code class="hljs css language-js">&lt;WebView useWebKit={<span class="hljs-literal">true</span>} source={{<span class="hljs-attr">url</span>: <span class="hljs-string">'https://www.google.com'</span>}} /&gt;
 </code></pre>
 <h2><a class="anchor" aria-hidden="true" id="improvements"></a><a href="#improvements" 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>Improvements</h2>
 <p><code>UIWebView</code> had no legitimate way to facilitate communication between the JavaScript running in the WebView, and React Native. When messages were sent from the WebView, we relied on a hack to deliver them to React Native. Succinctly, we encoded the message data into a url with a special scheme, and navigated the WebView to it. On the native side, we intercepted and cancelled this navigation, parsed the data from the url, and finally called into React Native. This implementation was error prone and insecure. I'm glad to announce that we've leveraged <code>WKWebView</code> features to completely replace it.</p>
@@ -47,7 +51,7 @@
 <p><strong>Not supported:</strong></p>
 <p><code>scalesPageToFit</code> (<a href="https://github.com/facebook/react-native/commit/b18fddadfeae5512690a0a059a4fa80c864f43a3">commit</a>)</p>
 <p>WKWebView didn't support the scalesPageToFit prop, so we couldn't implement this on the WebView React Native component.</p>
-</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing new iOS WebViews" data-url="https://facebook.github.io/react-native/blog/2018/08/27/wkwebview" data-related="reactnative" data-show-count="false"></a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/08/27/wkwebview" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
+</span></div></div><div class="blogSocialSection"><div class="blogSocialSectionItem"><a href="https://twitter.com/share" class="twitter-share-button" data-text="Introducing new iOS WebViews" data-url="https://facebook.github.io/react-native/blog/2018/08/27/wkwebview" data-related="reactnative" data-show-count="false">Tweet</a></div><div class="blogSocialSectionItem"><div class="fb-like" data-href="https://facebook.github.io/react-native/blog/2018/08/27/wkwebview" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></div><div class="blog-recent"><a class="button" href="/react-native/blog">Recent Posts</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
               var search = docsearch({
                 

blog/atom.xml

@@ -13,8 +13,7 @@
         <link href="https://facebook.github.io/react-native/blog/2018/08/27/wkwebview.html">
         </link>
         <updated>2018-08-27T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>For a long time now, Apple has discouraged using UIWebViews in favor of WKWebView. In iOS 12, which will be released in the upcoming months, <a href="https://developer.apple.com/videos/play/wwdc2018/234/?time=104">UIWebViews will be formally deprecated</a>. Rea</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>For a long time now, Apple has discouraged using UIWebViews in favor of WKWebView. In iOS 12, which will be released in the upcoming months, <a href="https://developer.apple.com/videos/play/wwdc2018/234/?time=104">UIWebViews will be formally deprecated</a>. React Native's iOS WebView implementation relies heavily on the UIWeb...</p>]]></summary>
         <author>
             <name>Ramanpreet Nara</name>
             <uri>https://github.com/rsnara</uri>
@@ -26,10 +25,7 @@
         <link href="https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates.html">
         </link>
         <updated>2018-08-13T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
-<p>As technology advances and mobile apps become increasingly important to everyday life, the necessity of creating accessible applications has likewise grown in importance.</p>
-<p>React Native's limited Accessibility API has always been a huge</p>
-]]></summary>
+        <summary type="html"><![CDATA[<h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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"/></svg></a>Motivation</h2> <p>As technology advances and mobile apps become increasingly important to everyday life, the necessity of creating accessible applications has likewise grown in importance.</p> <p>React Native's limited Accessibility API has always been a huge pain ...</p>]]></summary>
         <author>
             <name>Ziqi Chen</name>
             <uri>https://ziqichen.com/</uri>
@@ -41,8 +37,7 @@
         <link href="https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056.html">
         </link>
         <updated>2018-07-04T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>The long-awaited 0.56 version of React Native is now available 🎉. This blog post highlights some of the <a href="https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#highlights">changes</a> introduced in this new release. We</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>The long-awaited 0.56 version of React Native is now available 🎉. This blog post highlights some of the <a href="https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#highlights">changes</a> introduced in this new release. We also want to take the opportunity to explain what has kept us busy since March.</p> <h3><a class="anchor" aria-hidden="true" id="the-breaking-changes-dilemma-or-when-to-release"></a><a href="#the-breaking-changes-dilemma-or-when-to-release" 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"/></svg></a>The breaking changes d...</h3>]]></summary>
         <author>
             <name>Lorenzo Sciandra</name>
             <uri>https://github.com/kelset</uri>
@@ -54,9 +49,7 @@
         <link href="https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018.html">
         </link>
         <updated>2018-06-14T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>It's been a while since we last published a status update about React Native.</p>
-<p>At Facebook, we're using React Native more than ever and for many important projects. One of our most popular products is Marketplace, one of the top-level tabs in our app</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>It's been a while since we last published a status update about React Native.</p> <p>At Facebook, we're using React Native more than ever and for many important projects. One of our most popular products is Marketplace, one of the top-level tabs in our app ...</p>]]></summary>
         <author>
             <name>Sophie Alpert</name>
             <uri>https://github.com/sophiebits</uri>
@@ -68,8 +61,7 @@
         <link href="https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native.html">
         </link>
         <updated>2018-05-07T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>JavaScript! We all love it. But some of us also love <a href="https://en.wikipedia.org/wiki/Data_type">types</a>. Luckily, options exist to add stronger types to JavaScript. My favourite is <a href="https://www.typescriptlang.org">TypeScript</a>, but React Native supports</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>JavaScript! We all love it. But some of us also love <a href="https://en.wikipedia.org/wiki/Data_type">types</a>. Luckily, options exist to add stronger types to JavaScript. My favourite is <a href="https://www.typescriptlang.org">TypeScript</a>, but React Native supports <a href="https://flow.org">Flow</a> out of the box. Which you prefer is a matter of preference, they each h...</p>]]></summary>
         <author>
             <name>Ash Furrow</name>
             <uri>https://github.com/ashfurrow</uri>
@@ -81,8 +73,7 @@
         <link href="https://facebook.github.io/react-native/blog/2018/04/09/build-com-app.html">
         </link>
         <updated>2018-04-09T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p><a href="https://www.build.com/">Build.com</a>, headquartered in Chico, California, is one of the largest online retailers for home improvement items. The team has had a strong web-centric business for 18 years and began thinking about a mobile App in 2015. Bui</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p><a href="https://www.build.com/">Build.com</a>, headquartered in Chico, California, is one of the largest online retailers for home improvement items. The team has had a strong web-centric business for 18 years and began thinking about a mobile App in 2015. Building unique iOS and Andro...</p>]]></summary>
         <author>
             <name>Garrett McCullough</name>
             <uri>https://twitter.com/gwmccull</uri>
@@ -94,11 +85,7 @@
         <link href="https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native.html">
         </link>
         <updated>2018-03-22T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
-<p>Three years ago, a GitHub issue was opened to support input accessory view from React Native.</p>
-<p><img src="/react-native/blog/assets/input-accessory-1.png"/></p>
-<p>In the ensuing years, there have been countless '+1s', various workarounds, an</p>
-]]></summary>
+        <summary type="html"><![CDATA[<h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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"/></svg></a>Motivation</h2> <p>Three years ago, a GitHub issue was opened to support input accessory view from React Native.</p> <p><img src="/react-native/blog/assets/input-accessory-1.png"></p> <p>In the ensuing years, there have been countless '+1s', various workarounds, and zero concrete changes to RN on this issue - until today. Startin...</p>]]></summary>
         <author>
             <name>Peter Argany</name>
             <uri>https://github.com/PeteTheHeat</uri>
@@ -110,8 +97,7 @@
         <link href="https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync.html">
         </link>
         <updated>2018-03-05T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>AWS is well known in the technology industry as a provider of cloud services. These include compute, storage, and database technologies, as well as fully managed serverless offerings. The AWS Mobile team has been working closely with customers and me</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>AWS is well known in the technology industry as a provider of cloud services. These include compute, storage, and database technologies, as well as fully managed serverless offerings. The AWS Mobile team has been working closely with customers and me...</p>]]></summary>
         <author>
             <name>Richard Threlkeld</name>
             <uri>https://twitter.com/undef_obj</uri>
@@ -123,10 +109,7 @@
         <link href="https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native.html">
         </link>
         <updated>2018-01-18T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>Twitter’s iOS app has a loading animation I quite enjoy.</p>
-<p><img src="/react-native/blog/assets/loading-screen-01.gif" style="float: left; padding-right: 80px; padding-bottom: 20px"/></p>
-<p>Once the app is ready, the Twitter logo delightfully expands, revea</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>Twitter’s iOS app has a loading animation I quite enjoy.</p> <p><img src="/react-native/blog/assets/loading-screen-01.gif" style="float: left; padding-right: 80px; padding-bottom: 20px"></p> <p>Once the app is ready, the Twitter logo delightfully expands, revealing the app.</p> <p>I wanted to figure out how to recreate this loading animation with React Native.</p> <hr style="clear: both; margin-bottom: 40px; width: 80px"> <p>To understand <em>how</em> to build it...</p>]]></summary>
         <author>
             <name>Eli White</name>
             <uri>https://github.com/TheSavior</uri>
@@ -138,12 +121,7 @@
         <link href="https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6.html">
         </link>
         <updated>2018-01-09T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>The React Native monthly meeting is still going strong! Make sure to check a note on the bottom of this post for the next sessions.</p>
-<h3><a class="anchor" aria-hidden="true" id="expo"></a><a href="#expo" 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>Expo</h3>
-<ul>
-<li>Congratulations to <a href="https://github.com/dabbott">Devin Abbott</a> and [Houssein Djirdeh](<a href="https://twitter.com/">https://twitter.com/</a></li>
-</ul>
-]]></summary>
+        <summary type="html"><![CDATA[<p>The React Native monthly meeting is still going strong! Make sure to check a note on the bottom of this post for the next sessions.</p> <h3><a class="anchor" aria-hidden="true" id="expo"></a><a href="#expo" 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"/></svg></a>Expo</h3> <ul> <li>Congratulations to <a href="https://github.com/dabbott">Devin Abbott</a> and <a href="https://twitter.com/hdjirdeh">Houssein Djirdeh</a> on their pre-release of the &quot;Full Stack React Native&q...</li></ul>]]></summary>
         <author>
             <name>Tomislav Tenodi</name>
             <uri>https://twitter.com/TomislavTenodi</uri>
@@ -155,12 +133,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5.html">
         </link>
         <updated>2017-11-06T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>The React Native monthly meeting continues! Let's see what our teams are up to.</p>
-<h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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>Callstack</h3>
-<ul>
-<li>We’ve been working on React Native CI. Most importantly, we have migrated from Travis to Circle, leaving React Native with a single, unified CI pipeline</li>
-</ul>
-]]></summary>
+        <summary type="html"><![CDATA[<p>The React Native monthly meeting continues! Let's see what our teams are up to.</p> <h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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"/></svg></a>Callstack</h3> <ul> <li>We’ve been working on React Native CI. Most importantly, we have migrated from Travis to Circle, leaving React Native with a single, unified CI pipeline.</li> <li>We’ve ...</li></ul>]]></summary>
         <author>
             <name>Tomislav Tenodi</name>
             <uri>https://github.com/tenodi</uri>
@@ -172,12 +145,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4.html">
         </link>
         <updated>2017-09-21T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>The React Native monthly meeting continues! Here are the notes from each team:</p>
-<h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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>Callstack</h3>
-<ul>
-<li><a href="https://react-native.eu">React Native EU</a> is over. More than 300 participants from 33 countries have visited Wroclaw. Talks can be found [on Youtube](ht</li>
-</ul>
-]]></summary>
+        <summary type="html"><![CDATA[<p>The React Native monthly meeting continues! Here are the notes from each team:</p> <h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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"/></svg></a>Callstack</h3> <ul> <li><a href="https://react-native.eu">React Native EU</a> is over. More than 300 participants from 33 countries have visited Wroclaw. Talks can be found <a href="https://www.youtube.com/channel/UCUNE_g1mQPuyW975WjgjYxA/videos">on Youtube</a>.</li> <li>We are slowly getting back to our ope...</li></ul>]]></summary>
         <author>
             <name>Mike Grabowski</name>
             <uri>https://github.com/grabbou</uri>
@@ -189,8 +157,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3.html">
         </link>
         <updated>2017-08-30T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>The React Native monthly meeting continues! This month's meeting was a bit shorter as most of our teams were busy shipping. Next month, we are at <a href="https://react-native.eu/">React Native EU</a> conference in Wroclaw, Poland. Make sure to grab a ticket an</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>The React Native monthly meeting continues! This month's meeting was a bit shorter as most of our teams were busy shipping. Next month, we are at <a href="https://react-native.eu/">React Native EU</a> conference in Wroclaw, Poland. Make sure to grab a ticket and see you there in person! M...</p>]]></summary>
         <author>
             <name>Mike Grabowski</name>
             <uri>https://github.com/grabbou</uri>
@@ -202,8 +169,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace.html">
         </link>
         <updated>2017-08-07T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>React Native is used in multiple places across multiple apps in the Facebook family including a top level tab in the main Facebook apps. Our focus for this post is a highly visible product, [Marketplace](<a href="https://newsroom.fb.com/news/2016/10/introduci">https://newsroom.fb.com/news/2016/10/introduci</a></p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>React Native is used in multiple places across multiple apps in the Facebook family including a top level tab in the main Facebook apps. Our focus for this post is a highly visible product, <a href="https://newsroom.fb.com/news/2016/10/introducing-marketplace-buy-and-sell-with-your-local-community/">Marketplace</a>. It is available in a dozen or so countries and ...</p>]]></summary>
         <author>
             <name>Aaron Chiu</name>
             <uri>https://www.facebook.com/aaronechiu</uri>
@@ -215,8 +181,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2.html">
         </link>
         <updated>2017-07-28T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>The React Native monthly meeting continues! On this session, we were joined by <a href="https://infinite.red/">Infinite Red</a>, great minds behind <a href="https://infinite.red/ChainReactConf">Chain React, the React Native Conference</a>. As most of the people here were</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>The React Native monthly meeting continues! On this session, we were joined by <a href="https://infinite.red/">Infinite Red</a>, great minds behind <a href="https://infinite.red/ChainReactConf">Chain React, the React Native Conference</a>. As most of the people here were presenting talks at Chain React, we pushed the meeting to a week ...</p>]]></summary>
         <author>
             <name>Tomislav Tenodi</name>
             <uri>https://github.com/tenodi</uri>
@@ -228,8 +193,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1.html">
         </link>
         <updated>2017-06-21T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>At <a href="https://shoutem.github.io/">Shoutem</a>, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep u</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>At <a href="https://shoutem.github.io/">Shoutem</a>, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep up with the pace the community ...</p>]]></summary>
         <author>
             <name>Tomislav Tenodi</name>
             <uri>https://github.com/tenodi</uri>
@@ -241,8 +205,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app.html">
         </link>
         <updated>2017-03-13T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>Today we’re announcing <a href="https://github.com/react-community/create-react-native-app">Create React Native App</a>: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of [Create Rea</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>Today we’re announcing <a href="https://github.com/react-community/create-react-native-app">Create React Native App</a>: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of <a href="https://github.com/facebookincubator/create-react-app">Create React App</a> and is the product of a collaboration between <a href="https://code.facebook.com">Facebook</a> a...</p>]]></summary>
         <author>
             <name>Adam Perry</name>
             <uri>https://github.com/dikaiosune</uri>
@@ -254,8 +217,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function.html">
         </link>
         <updated>2017-03-13T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be n</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be n...</p>]]></summary>
         <author>
             <name>Timothy Yung</name>
             <uri>https://github.com/yungsters</uri>
@@ -267,8 +229,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/03/13/better-list-views.html">
         </link>
         <updated>2017-03-13T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>Many of you have started playing with some of our new List components already after our <a href="https://www.facebook.com/groups/react.native.community/permalink/921378591331053">teaser announcement in the community group</a>, but we are officially announcing t</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>Many of you have started playing with some of our new List components already after our <a href="https://www.facebook.com/groups/react.native.community/permalink/921378591331053">teaser announcement in the community group</a>, but we are officially announcing them today! No more <code>ListView</code>s or <code>DataSource</code>s, stale rows, ignored bugs, or excessive ...</p>]]></summary>
         <author>
             <name>Spencer Ahrens</name>
             <uri>https://github.com/sahrens</uri>
@@ -280,8 +241,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated.html">
         </link>
         <updated>2017-02-14T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers t</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers t...</p>]]></summary>
         <author>
             <name>Janic Duplessis</name>
             <uri>https://twitter.com/janicduplessis</uri>
@@ -293,8 +253,7 @@
         <link href="https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence.html">
         </link>
         <updated>2017-01-07T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release o</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release o...</p>]]></summary>
         <author>
             <name>Eric Vicenti</name>
             <uri>https://twitter.com/EricVicenti</uri>
@@ -306,10 +265,7 @@
         <link href="https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades.html">
         </link>
         <updated>2016-12-05T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>Upgrading to new versions of React Native has been difficult. You might have seen something like this before:</p>
-<p><img src="/react-native/blog/assets/git-upgrade-conflict.png" alt=""></p>
-<p>None of those options is ideal. By overwriting the file we lose our local changes.</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>Upgrading to new versions of React Native has been difficult. You might have seen something like this before:</p> <p><img src="/react-native/blog/assets/git-upgrade-conflict.png" alt=""></p> <p>None of those options is ideal. By overwriting the file we lose our local changes. By not overwriting we don't get the latest updates.</p> <p>Toda...</p>]]></summary>
         <author>
             <name>Nicolas Cuillery</name>
             <uri>https://twitter.com/ncuillery</uri>
@@ -321,8 +277,7 @@
         <link href="https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap.html">
         </link>
         <updated>2016-11-08T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>We have heard from many people that there is so much work happening with React Native, it can be tough to keep track of what's going on. To help communicate what work is in progress, we are now publishing a [roadmap for React Native](<a href="https://github.c">https://github.c</a></p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>We have heard from many people that there is so much work happening with React Native, it can be tough to keep track of what's going on. To help communicate what work is in progress, we are now publishing a <a href="https://github.com/facebook/react-native/wiki/Roadmap">roadmap for React Native</a>. At a high level, ...</p>]]></summary>
         <author>
             <name>Héctor Ramos</name>
             <uri>https://twitter.com/hectorramos</uri>
@@ -334,10 +289,7 @@
         <link href="https://facebook.github.io/react-native/blog/2016/10/25/0.36-headless-js-the-keyboard-api-and-more.html">
         </link>
         <updated>2016-10-25T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">React Native 0.36</a>. Read on to learn more about what's new.</p>
-<h2><a class="anchor" aria-hidden="true" id="headless-js"></a><a href="#headless-js" 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>Headless JS</h2>
-<p>Headless JS is a way to run tasks in JavaScript while your app is in the background. I</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">React Native 0.36</a>. Read on to learn more about what's new.</p> <h2><a class="anchor" aria-hidden="true" id="headless-js"></a><a href="#headless-js" 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"/></svg></a>Headless JS</h2> <p>Headless JS is a way to run tasks in JavaScript while your app is in the background. It can be used, for example, to sync fresh data, handle push notificati...</p>]]></summary>
         <author>
             <name>Héctor Ramos</name>
             <uri>https://twitter.com/hectorramos</uri>
@@ -349,8 +301,7 @@
         <link href="https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation.html">
         </link>
         <updated>2016-09-08T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p><a href="https://twitter.com/skevy">Adam Miskiewicz</a> from <a href="https://expo.io/">Expo</a> talks about mobile navigation and the <a href="https://github.com/exponent/ex-navigation"><code>ex-navigation</code></a> React Native library at Expo's office hours last week.</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p><a href="https://twitter.com/skevy">Adam Miskiewicz</a> from <a href="https://expo.io/">Expo</a> talks about mobile navigation and the <a href="https://github.com/exponent/ex-navigation"><code>ex-navigation</code></a> React Native library at Expo's office hours last week.</p> ]]></summary>
         <author>
             <name>Héctor Ramos</name>
             <uri>https://twitter.com/hectorramos</uri>
@@ -362,8 +313,7 @@
         <link href="https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps.html">
         </link>
         <updated>2016-08-19T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is ne</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is ne...</p>]]></summary>
         <author>
             <name>Mengjue (Mandy) Wang</name>
             <uri>https://github.com/MengjueW</uri>
@@ -375,8 +325,7 @@
         <link href="https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco.html">
         </link>
         <updated>2016-08-12T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>Last week I had the opportunity to attend the <a href="http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854">React Native Meetup</a> at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>Last week I had the opportunity to attend the <a href="http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854">React Native Meetup</a> at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native.</p> <p><img src="/react-native/blog/assets/rnmsf-august-2016-hero.jpg" alt=""></p> <p>I was part...</p>]]></summary>
         <author>
             <name>Héctor Ramos</name>
             <uri>https://twitter.com/hectorramos</uri>
@@ -388,8 +337,7 @@
         <link href="https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation.html">
         </link>
         <updated>2016-07-06T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better ...</p>]]></summary>
         <author>
             <name>Kevin Lacker</name>
             <uri>https://twitter.com/lacker</uri>
@@ -401,8 +349,7 @@
         <link href="https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review.html">
         </link>
         <updated>2016-04-13T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing [React Native to</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing <a href="http://microsoft.github.io/code-push/articles/ReactNativeWindows.html">React Native to ...</a></p>]]></summary>
         <author>
             <name>Martin Konicek</name>
             <uri>https://github.com/mkonicek</uri>
@@ -414,8 +361,7 @@
         <link href="https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance.html">
         </link>
         <updated>2016-03-28T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across ...</p>]]></summary>
         <author>
             <name>Pieter De Baets</name>
             <uri>https://github.com/javache</uri>
@@ -427,8 +373,7 @@
         <link href="https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading.html">
         </link>
         <updated>2016-03-24T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grow</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grow...</p>]]></summary>
         <author>
             <name>Martín Bigio</name>
             <uri>https://twitter.com/martinbigio</uri>
@@ -440,8 +385,7 @@
         <link href="https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible.html">
         </link>
         <updated>2015-11-23T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vi</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vi...</p>]]></summary>
         <author>
             <name>Georgiy Kassabli</name>
             <uri>https://www.facebook.com/georgiy.kassabli</uri>
@@ -453,8 +397,7 @@
         <link href="https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android.html">
         </link>
         <updated>2015-09-14T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>Earlier this year, we introduced <a href="https://code.facebook.com/posts/1014532261909640/react-native-bringing-modern-web-techniques-to-mobile/">React Native for iOS</a>. React Native brings what developers are used to from React on the web — declarative self</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>Earlier this year, we introduced <a href="https://code.facebook.com/posts/1014532261909640/react-native-bringing-modern-web-techniques-to-mobile/">React Native for iOS</a>. React Native brings what developers are used to from React on the web — declarative self-contained UI components and fast development cycles — to the mobile platform, while retaining the speed, f...</p>]]></summary>
         <author>
             <name>Daniel Witte</name>
             <uri>https://www.facebook.com/drwitte</uri>
@@ -466,8 +409,7 @@
         <link href="https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile.html">
         </link>
         <updated>2015-03-26T06:00:00Z</updated>
-        <summary type="html"><![CDATA[<p>We introduced <a href="https://code.facebook.com/projects/176988925806765/react/">React</a> to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web proje</p>
-]]></summary>
+        <summary type="html"><![CDATA[<p>We introduced <a href="https://code.facebook.com/projects/176988925806765/react/">React</a> to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web projects at Facebook are commonly built using React in one form or ...</p>]]></summary>
         <author>
             <name>Tom Occhino</name>
             <uri>https://github.com/tomocchino</uri>

blog/feed.xml

@@ -17,296 +17,238 @@
             <link>https://facebook.github.io/react-native/blog/2018/08/27/wkwebview.html</link>
             <guid>https://facebook.github.io/react-native/blog/2018/08/27/wkwebview.html</guid>
             <pubDate>Mon, 27 Aug 2018 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>For a long time now, Apple has discouraged using UIWebViews in favor of WKWebView. In iOS 12, which will be released in the upcoming months, <a href="https://developer.apple.com/videos/play/wwdc2018/234/?time=104">UIWebViews will be formally deprecated</a>. Rea</p>
-]]></description>
+            <description><![CDATA[<p>For a long time now, Apple has discouraged using UIWebViews in favor of WKWebView. In iOS 12, which will be released in the upcoming months, <a href="https://developer.apple.com/videos/play/wwdc2018/234/?time=104">UIWebViews will be formally deprecated</a>. React Native's iOS WebView implementation relies heavily on the UIWeb...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Accessibility API Updates]]></title>
             <link>https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates.html</link>
             <guid>https://facebook.github.io/react-native/blog/2018/08/13/react-native-accessibility-updates.html</guid>
             <pubDate>Mon, 13 Aug 2018 06:00:00 GMT</pubDate>
-            <description><![CDATA[<h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
-<p>As technology advances and mobile apps become increasingly important to everyday life, the necessity of creating accessible applications has likewise grown in importance.</p>
-<p>React Native's limited Accessibility API has always been a huge</p>
-]]></description>
+            <description><![CDATA[<h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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"/></svg></a>Motivation</h2> <p>As technology advances and mobile apps become increasingly important to everyday life, the necessity of creating accessible applications has likewise grown in importance.</p> <p>React Native's limited Accessibility API has always been a huge pain ...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Releasing 0.56]]></title>
             <link>https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056.html</link>
             <guid>https://facebook.github.io/react-native/blog/2018/07/04/releasing-react-native-056.html</guid>
             <pubDate>Wed, 04 Jul 2018 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>The long-awaited 0.56 version of React Native is now available 🎉. This blog post highlights some of the <a href="https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#highlights">changes</a> introduced in this new release. We</p>
-]]></description>
+            <description><![CDATA[<p>The long-awaited 0.56 version of React Native is now available 🎉. This blog post highlights some of the <a href="https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#highlights">changes</a> introduced in this new release. We also want to take the opportunity to explain what has kept us busy since March.</p> <h3><a class="anchor" aria-hidden="true" id="the-breaking-changes-dilemma-or-when-to-release"></a><a href="#the-breaking-changes-dilemma-or-when-to-release" 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"/></svg></a>The breaking changes d...</h3>]]></description>
         </item>
         <item>
             <title><![CDATA[State of React Native 2018]]></title>
             <link>https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018.html</link>
             <guid>https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018.html</guid>
             <pubDate>Thu, 14 Jun 2018 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>It's been a while since we last published a status update about React Native.</p>
-<p>At Facebook, we're using React Native more than ever and for many important projects. One of our most popular products is Marketplace, one of the top-level tabs in our app</p>
-]]></description>
+            <description><![CDATA[<p>It's been a while since we last published a status update about React Native.</p> <p>At Facebook, we're using React Native more than ever and for many important projects. One of our most popular products is Marketplace, one of the top-level tabs in our app ...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Using TypeScript with React Native]]></title>
             <link>https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native.html</link>
             <guid>https://facebook.github.io/react-native/blog/2018/05/07/using-typescript-with-react-native.html</guid>
             <pubDate>Mon, 07 May 2018 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>JavaScript! We all love it. But some of us also love <a href="https://en.wikipedia.org/wiki/Data_type">types</a>. Luckily, options exist to add stronger types to JavaScript. My favourite is <a href="https://www.typescriptlang.org">TypeScript</a>, but React Native supports</p>
-]]></description>
+            <description><![CDATA[<p>JavaScript! We all love it. But some of us also love <a href="https://en.wikipedia.org/wiki/Data_type">types</a>. Luckily, options exist to add stronger types to JavaScript. My favourite is <a href="https://www.typescriptlang.org">TypeScript</a>, but React Native supports <a href="https://flow.org">Flow</a> out of the box. Which you prefer is a matter of preference, they each h...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Built with React Native - The Build.com app]]></title>
             <link>https://facebook.github.io/react-native/blog/2018/04/09/build-com-app.html</link>
             <guid>https://facebook.github.io/react-native/blog/2018/04/09/build-com-app.html</guid>
             <pubDate>Mon, 09 Apr 2018 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p><a href="https://www.build.com/">Build.com</a>, headquartered in Chico, California, is one of the largest online retailers for home improvement items. The team has had a strong web-centric business for 18 years and began thinking about a mobile App in 2015. Bui</p>
-]]></description>
+            <description><![CDATA[<p><a href="https://www.build.com/">Build.com</a>, headquartered in Chico, California, is one of the largest online retailers for home improvement items. The team has had a strong web-centric business for 18 years and began thinking about a mobile App in 2015. Building unique iOS and Andro...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Building <InputAccessoryView> For React Native]]></title>
             <link>https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native.html</link>
             <guid>https://facebook.github.io/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native.html</guid>
             <pubDate>Thu, 22 Mar 2018 06:00:00 GMT</pubDate>
-            <description><![CDATA[<h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
-<p>Three years ago, a GitHub issue was opened to support input accessory view from React Native.</p>
-<p><img src="/react-native/blog/assets/input-accessory-1.png"/></p>
-<p>In the ensuing years, there have been countless '+1s', various workarounds, an</p>
-]]></description>
+            <description><![CDATA[<h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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"/></svg></a>Motivation</h2> <p>Three years ago, a GitHub issue was opened to support input accessory view from React Native.</p> <p><img src="/react-native/blog/assets/input-accessory-1.png"></p> <p>In the ensuing years, there have been countless '+1s', various workarounds, and zero concrete changes to RN on this issue - until today. Startin...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Using AWS with React Native]]></title>
             <link>https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync.html</link>
             <guid>https://facebook.github.io/react-native/blog/2018/03/05/AWS-app-sync.html</guid>
             <pubDate>Mon, 05 Mar 2018 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>AWS is well known in the technology industry as a provider of cloud services. These include compute, storage, and database technologies, as well as fully managed serverless offerings. The AWS Mobile team has been working closely with customers and me</p>
-]]></description>
+            <description><![CDATA[<p>AWS is well known in the technology industry as a provider of cloud services. These include compute, storage, and database technologies, as well as fully managed serverless offerings. The AWS Mobile team has been working closely with customers and me...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Implementing Twitter’s App Loading Animation in React Native]]></title>
             <link>https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native.html</link>
             <guid>https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native.html</guid>
             <pubDate>Thu, 18 Jan 2018 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>Twitter’s iOS app has a loading animation I quite enjoy.</p>
-<p><img src="/react-native/blog/assets/loading-screen-01.gif" style="float: left; padding-right: 80px; padding-bottom: 20px"/></p>
-<p>Once the app is ready, the Twitter logo delightfully expands, revea</p>
-]]></description>
+            <description><![CDATA[<p>Twitter’s iOS app has a loading animation I quite enjoy.</p> <p><img src="/react-native/blog/assets/loading-screen-01.gif" style="float: left; padding-right: 80px; padding-bottom: 20px"></p> <p>Once the app is ready, the Twitter logo delightfully expands, revealing the app.</p> <p>I wanted to figure out how to recreate this loading animation with React Native.</p> <hr style="clear: both; margin-bottom: 40px; width: 80px"> <p>To understand <em>how</em> to build it...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[React Native Monthly #6]]></title>
             <link>https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6.html</link>
             <guid>https://facebook.github.io/react-native/blog/2018/01/09/react-native-monthly-6.html</guid>
             <pubDate>Tue, 09 Jan 2018 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>The React Native monthly meeting is still going strong! Make sure to check a note on the bottom of this post for the next sessions.</p>
-<h3><a class="anchor" aria-hidden="true" id="expo"></a><a href="#expo" 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>Expo</h3>
-<ul>
-<li>Congratulations to <a href="https://github.com/dabbott">Devin Abbott</a> and [Houssein Djirdeh](<a href="https://twitter.com/">https://twitter.com/</a></li>
-</ul>
-]]></description>
+            <description><![CDATA[<p>The React Native monthly meeting is still going strong! Make sure to check a note on the bottom of this post for the next sessions.</p> <h3><a class="anchor" aria-hidden="true" id="expo"></a><a href="#expo" 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"/></svg></a>Expo</h3> <ul> <li>Congratulations to <a href="https://github.com/dabbott">Devin Abbott</a> and <a href="https://twitter.com/hdjirdeh">Houssein Djirdeh</a> on their pre-release of the &quot;Full Stack React Native&q...</li></ul>]]></description>
         </item>
         <item>
             <title><![CDATA[React Native Monthly #5]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/11/06/react-native-monthly-5.html</guid>
             <pubDate>Mon, 06 Nov 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>The React Native monthly meeting continues! Let's see what our teams are up to.</p>
-<h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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>Callstack</h3>
-<ul>
-<li>We’ve been working on React Native CI. Most importantly, we have migrated from Travis to Circle, leaving React Native with a single, unified CI pipeline</li>
-</ul>
-]]></description>
+            <description><![CDATA[<p>The React Native monthly meeting continues! Let's see what our teams are up to.</p> <h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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"/></svg></a>Callstack</h3> <ul> <li>We’ve been working on React Native CI. Most importantly, we have migrated from Travis to Circle, leaving React Native with a single, unified CI pipeline.</li> <li>We’ve ...</li></ul>]]></description>
         </item>
         <item>
             <title><![CDATA[React Native Monthly #4]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/09/21/react-native-monthly-4.html</guid>
             <pubDate>Thu, 21 Sep 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>The React Native monthly meeting continues! Here are the notes from each team:</p>
-<h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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>Callstack</h3>
-<ul>
-<li><a href="https://react-native.eu">React Native EU</a> is over. More than 300 participants from 33 countries have visited Wroclaw. Talks can be found [on Youtube](ht</li>
-</ul>
-]]></description>
+            <description><![CDATA[<p>The React Native monthly meeting continues! Here are the notes from each team:</p> <h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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"/></svg></a>Callstack</h3> <ul> <li><a href="https://react-native.eu">React Native EU</a> is over. More than 300 participants from 33 countries have visited Wroclaw. Talks can be found <a href="https://www.youtube.com/channel/UCUNE_g1mQPuyW975WjgjYxA/videos">on Youtube</a>.</li> <li>We are slowly getting back to our ope...</li></ul>]]></description>
         </item>
         <item>
             <title><![CDATA[React Native Monthly #3]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/08/30/react-native-monthly-3.html</guid>
             <pubDate>Wed, 30 Aug 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>The React Native monthly meeting continues! This month's meeting was a bit shorter as most of our teams were busy shipping. Next month, we are at <a href="https://react-native.eu/">React Native EU</a> conference in Wroclaw, Poland. Make sure to grab a ticket an</p>
-]]></description>
+            <description><![CDATA[<p>The React Native monthly meeting continues! This month's meeting was a bit shorter as most of our teams were busy shipping. Next month, we are at <a href="https://react-native.eu/">React Native EU</a> conference in Wroclaw, Poland. Make sure to grab a ticket and see you there in person! M...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[React Native Performance in Marketplace]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/08/07/react-native-performance-in-marketplace.html</guid>
             <pubDate>Mon, 07 Aug 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>React Native is used in multiple places across multiple apps in the Facebook family including a top level tab in the main Facebook apps. Our focus for this post is a highly visible product, [Marketplace](<a href="https://newsroom.fb.com/news/2016/10/introduci">https://newsroom.fb.com/news/2016/10/introduci</a></p>
-]]></description>
+            <description><![CDATA[<p>React Native is used in multiple places across multiple apps in the Facebook family including a top level tab in the main Facebook apps. Our focus for this post is a highly visible product, <a href="https://newsroom.fb.com/news/2016/10/introducing-marketplace-buy-and-sell-with-your-local-community/">Marketplace</a>. It is available in a dozen or so countries and ...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[React Native Monthly #2]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/07/28/react-native-monthly-2.html</guid>
             <pubDate>Fri, 28 Jul 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>The React Native monthly meeting continues! On this session, we were joined by <a href="https://infinite.red/">Infinite Red</a>, great minds behind <a href="https://infinite.red/ChainReactConf">Chain React, the React Native Conference</a>. As most of the people here were</p>
-]]></description>
+            <description><![CDATA[<p>The React Native monthly meeting continues! On this session, we were joined by <a href="https://infinite.red/">Infinite Red</a>, great minds behind <a href="https://infinite.red/ChainReactConf">Chain React, the React Native Conference</a>. As most of the people here were presenting talks at Chain React, we pushed the meeting to a week ...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[React Native Monthly #1]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/06/21/react-native-monthly-1.html</guid>
             <pubDate>Wed, 21 Jun 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>At <a href="https://shoutem.github.io/">Shoutem</a>, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep u</p>
-]]></description>
+            <description><![CDATA[<p>At <a href="https://shoutem.github.io/">Shoutem</a>, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep up with the pace the community ...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Introducing Create React Native App]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app.html</guid>
             <pubDate>Mon, 13 Mar 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>Today we’re announcing <a href="https://github.com/react-community/create-react-native-app">Create React Native App</a>: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of [Create Rea</p>
-]]></description>
+            <description><![CDATA[<p>Today we’re announcing <a href="https://github.com/react-community/create-react-native-app">Create React Native App</a>: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of <a href="https://github.com/facebookincubator/create-react-app">Create React App</a> and is the product of a collaboration between <a href="https://code.facebook.com">Facebook</a> a...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[idx: The Existential Function]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/03/13/idx-the-existential-function.html</guid>
             <pubDate>Mon, 13 Mar 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be n</p>
-]]></description>
+            <description><![CDATA[<p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be n...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Better List Views in React Native]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/03/13/better-list-views.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/03/13/better-list-views.html</guid>
             <pubDate>Mon, 13 Mar 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>Many of you have started playing with some of our new List components already after our <a href="https://www.facebook.com/groups/react.native.community/permalink/921378591331053">teaser announcement in the community group</a>, but we are officially announcing t</p>
-]]></description>
+            <description><![CDATA[<p>Many of you have started playing with some of our new List components already after our <a href="https://www.facebook.com/groups/react.native.community/permalink/921378591331053">teaser announcement in the community group</a>, but we are officially announcing them today! No more <code>ListView</code>s or <code>DataSource</code>s, stale rows, ignored bugs, or excessive ...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Using Native Driver for Animated]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated.html</guid>
             <pubDate>Tue, 14 Feb 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers t</p>
-]]></description>
+            <description><![CDATA[<p>For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers t...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[A Monthly Release Cadence: Releasing December and January RC]]></title>
             <link>https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence.html</link>
             <guid>https://facebook.github.io/react-native/blog/2017/01/07/monthly-release-cadence.html</guid>
             <pubDate>Sat, 07 Jan 2017 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release o</p>
-]]></description>
+            <description><![CDATA[<p>Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release o...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Easier Upgrades Thanks to Git]]></title>
             <link>https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades.html</link>
             <guid>https://facebook.github.io/react-native/blog/2016/12/05/easier-upgrades.html</guid>
             <pubDate>Mon, 05 Dec 2016 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>Upgrading to new versions of React Native has been difficult. You might have seen something like this before:</p>
-<p><img src="/react-native/blog/assets/git-upgrade-conflict.png" alt=""></p>
-<p>None of those options is ideal. By overwriting the file we lose our local changes.</p>
-]]></description>
+            <description><![CDATA[<p>Upgrading to new versions of React Native has been difficult. You might have seen something like this before:</p> <p><img src="/react-native/blog/assets/git-upgrade-conflict.png" alt=""></p> <p>None of those options is ideal. By overwriting the file we lose our local changes. By not overwriting we don't get the latest updates.</p> <p>Toda...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Introducing Button, Faster Installs with Yarn, and a Public Roadmap]]></title>
             <link>https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap.html</link>
             <guid>https://facebook.github.io/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap.html</guid>
             <pubDate>Tue, 08 Nov 2016 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>We have heard from many people that there is so much work happening with React Native, it can be tough to keep track of what's going on. To help communicate what work is in progress, we are now publishing a [roadmap for React Native](<a href="https://github.c">https://github.c</a></p>
-]]></description>
+            <description><![CDATA[<p>We have heard from many people that there is so much work happening with React Native, it can be tough to keep track of what's going on. To help communicate what work is in progress, we are now publishing a <a href="https://github.com/facebook/react-native/wiki/Roadmap">roadmap for React Native</a>. At a high level, ...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[0.36: Headless JS, the Keyboard API, & more]]></title>
             <link>https://facebook.github.io/react-native/blog/2016/10/25/0.36-headless-js-the-keyboard-api-and-more.html</link>
             <guid>https://facebook.github.io/react-native/blog/2016/10/25/0.36-headless-js-the-keyboard-api-and-more.html</guid>
             <pubDate>Tue, 25 Oct 2016 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">React Native 0.36</a>. Read on to learn more about what's new.</p>
-<h2><a class="anchor" aria-hidden="true" id="headless-js"></a><a href="#headless-js" 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>Headless JS</h2>
-<p>Headless JS is a way to run tasks in JavaScript while your app is in the background. I</p>
-]]></description>
+            <description><![CDATA[<p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">React Native 0.36</a>. Read on to learn more about what's new.</p> <h2><a class="anchor" aria-hidden="true" id="headless-js"></a><a href="#headless-js" 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"/></svg></a>Headless JS</h2> <p>Headless JS is a way to run tasks in JavaScript while your app is in the background. It can be used, for example, to sync fresh data, handle push notificati...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Expo Talks: Adam on Unraveling Navigation]]></title>
             <link>https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation.html</link>
             <guid>https://facebook.github.io/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation.html</guid>
             <pubDate>Thu, 08 Sep 2016 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p><a href="https://twitter.com/skevy">Adam Miskiewicz</a> from <a href="https://expo.io/">Expo</a> talks about mobile navigation and the <a href="https://github.com/exponent/ex-navigation"><code>ex-navigation</code></a> React Native library at Expo's office hours last week.</p>
-]]></description>
+            <description><![CDATA[<p><a href="https://twitter.com/skevy">Adam Miskiewicz</a> from <a href="https://expo.io/">Expo</a> talks about mobile navigation and the <a href="https://github.com/exponent/ex-navigation"><code>ex-navigation</code></a> React Native library at Expo's office hours last week.</p> ]]></description>
         </item>
         <item>
             <title><![CDATA[Right-to-Left Layout Support For React Native Apps]]></title>
             <link>https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps.html</link>
             <guid>https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps.html</guid>
             <pubDate>Fri, 19 Aug 2016 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is ne</p>
-]]></description>
+            <description><![CDATA[<p>After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is ne...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[San Francisco Meetup Recap]]></title>
             <link>https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco.html</link>
             <guid>https://facebook.github.io/react-native/blog/2016/08/12/react-native-meetup-san-francisco.html</guid>
             <pubDate>Fri, 12 Aug 2016 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>Last week I had the opportunity to attend the <a href="http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854">React Native Meetup</a> at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet</p>
-]]></description>
+            <description><![CDATA[<p>Last week I had the opportunity to attend the <a href="http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854">React Native Meetup</a> at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native.</p> <p><img src="/react-native/blog/assets/rnmsf-august-2016-hero.jpg" alt=""></p> <p>I was part...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Toward Better Documentation]]></title>
             <link>https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation.html</link>
             <guid>https://facebook.github.io/react-native/blog/2016/07/06/toward-better-documentation.html</guid>
             <pubDate>Wed, 06 Jul 2016 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better</p>
-]]></description>
+            <description><![CDATA[<p>Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better ...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[React Native: A year in review]]></title>
             <link>https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review.html</link>
             <guid>https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review.html</guid>
             <pubDate>Wed, 13 Apr 2016 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing [React Native to</p>
-]]></description>
+            <description><![CDATA[<p>It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing <a href="http://microsoft.github.io/code-push/articles/ReactNativeWindows.html">React Native to ...</a></p>]]></description>
         </item>
         <item>
             <title><![CDATA[Dive into React Native Performance]]></title>
             <link>https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance.html</link>
             <guid>https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance.html</guid>
             <pubDate>Mon, 28 Mar 2016 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across</p>
-]]></description>
+            <description><![CDATA[<p>React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across ...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Introducing Hot Reloading]]></title>
             <link>https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading.html</link>
             <guid>https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading.html</guid>
             <pubDate>Thu, 24 Mar 2016 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grow</p>
-]]></description>
+            <description><![CDATA[<p>React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grow...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[Making React Native apps accessible]]></title>
             <link>https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible.html</link>
             <guid>https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible.html</guid>
             <pubDate>Mon, 23 Nov 2015 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vi</p>
-]]></description>
+            <description><![CDATA[<p>With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vi...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[React Native for Android: How we built the first cross-platform React Native app]]></title>
             <link>https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android.html</link>
             <guid>https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android.html</guid>
             <pubDate>Mon, 14 Sep 2015 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>Earlier this year, we introduced <a href="https://code.facebook.com/posts/1014532261909640/react-native-bringing-modern-web-techniques-to-mobile/">React Native for iOS</a>. React Native brings what developers are used to from React on the web — declarative self</p>
-]]></description>
+            <description><![CDATA[<p>Earlier this year, we introduced <a href="https://code.facebook.com/posts/1014532261909640/react-native-bringing-modern-web-techniques-to-mobile/">React Native for iOS</a>. React Native brings what developers are used to from React on the web — declarative self-contained UI components and fast development cycles — to the mobile platform, while retaining the speed, f...</p>]]></description>
         </item>
         <item>
             <title><![CDATA[React Native: Bringing modern web techniques to mobile]]></title>
             <link>https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile.html</link>
             <guid>https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile.html</guid>
             <pubDate>Thu, 26 Mar 2015 06:00:00 GMT</pubDate>
-            <description><![CDATA[<p>We introduced <a href="https://code.facebook.com/projects/176988925806765/react/">React</a> to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web proje</p>
-]]></description>
+            <description><![CDATA[<p>We introduced <a href="https://code.facebook.com/projects/176988925806765/react/">React</a> to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web projects at Facebook are commonly built using React in one form or ...</p>]]></description>
         </item>
     </channel>
 </rss>

blog/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -32,7 +36,7 @@
         </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="posts"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/08/27/wkwebview">Introducing new iOS WebViews</a></h1><p class="post-meta">August 27, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/rsnara" target="_blank" rel="noreferrer noopener">Ramanpreet Nara</a>Software Engineer at Facebook</p></div></header><article class="post-content"><div><span><p>For a long time now, Apple has discouraged using UIWebViews in favor of WKWebView. In iOS 12, which will be released in the upcoming months, <a href="https://developer.apple.com/videos/play/wwdc2018/234/?time=104">UIWebViews will be formally deprecated</a>. React Native's iOS WebView implementation relies heavily on the UIWebView class. Therefore, in light of these developments, we've built a new native iOS backend to the WebView React Native component that uses WKWebView.</p>
 <p>The tail end of these changes were landed in <a href="https://github.com/facebook/react-native/commit/33b353c97c31190439a22febbd3d2a9ead49d3c9">this commit</a>, and will become available in the 0.57 release.</p>
 <p>To opt into this new implementation, please use the <a href="/react-native/docs/next/webview#usewebkit"><code>useWebKit</code></a> prop:</p>
-<pre><code class="hljs css languages- js">&lt;WebView useWebKit={<span class="hljs-literal">true</span>} source={{<span class="hljs-attr">url</span>: <span class="hljs-string">'https://www.google.com'</span>}} /&gt;
+<pre><code class="hljs css language-js">&lt;WebView useWebKit={<span class="hljs-literal">true</span>} source={{<span class="hljs-attr">url</span>: <span class="hljs-string">'https://www.google.com'</span>}} /&gt;
 </code></pre>
 <h2><a class="anchor" aria-hidden="true" id="improvements"></a><a href="#improvements" 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>Improvements</h2>
 <p><code>UIWebView</code> had no legitimate way to facilitate communication between the JavaScript running in the WebView, and React Native. When messages were sent from the WebView, we relied on a hack to deliver them to React Native. Succinctly, we encoded the message data into a url with a special scheme, and navigated the WebView to it. On the native side, we intercepted and cancelled this navigation, parsed the data from the url, and finally called into React Native. This implementation was error prone and insecure. I'm glad to announce that we've leveraged <code>WKWebView</code> features to completely replace it.</p>
@@ -47,7 +51,7 @@
 <p><strong>Not supported:</strong></p>
 <p><code>scalesPageToFit</code> (<a href="https://github.com/facebook/react-native/commit/b18fddadfeae5512690a0a059a4fa80c864f43a3">commit</a>)</p>
 <p>WKWebView didn't support the scalesPageToFit prop, so we couldn't implement this on the WebView React Native component.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/08/13/react-native-accessibility-updates">Accessibility API Updates</a></h1><p class="post-meta">August 13, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener">Ziqi Chen</a>Student at UC Berkeley</p><div class="authorPhoto authorPhotoBig"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/13990087?s=400&amp;u=5841da1b6064341d52ecab70a586b6701d9f6978&amp;v=4"/></a></div></div></header><article class="post-content"><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/08/13/react-native-accessibility-updates">Accessibility API Updates</a></h1><p class="post-meta">August 13, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener">Ziqi Chen</a>Student at UC Berkeley</p><div class="authorPhoto authorPhotoBig"><a href="https://ziqichen.com/" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/13990087?s=400&amp;u=5841da1b6064341d52ecab70a586b6701d9f6978&amp;v=4" alt="Ziqi Chen"/></a></div></div></header><article class="post-content"><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
 <p>As technology advances and mobile apps become increasingly important to everyday life, the necessity of creating accessible applications has likewise grown in importance.</p>
 <p>React Native's limited Accessibility API has always been a huge pain point for developers, so we've made a few updates to the Accessibility API to make it easier to create inclusive mobile applications.</p>
 <h2><a class="anchor" aria-hidden="true" id="problems-with-the-existing-api"></a><a href="#problems-with-the-existing-api" 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>Problems With the Existing API</h2>
@@ -128,7 +132,7 @@ accessibilityStates={[“selected”]}
 </code></pre>
 <p>These properties are already being used in Facebook's codebase. The codemod for Facebook was surprisingly simple. The jscodeshift script fixed about half of our instances, and the other half was fixed manually. Overall, the entire process took less than a few hours.</p>
 <p>Hopefully you will find the updated API useful! And please continue making apps accessible! #inclusion</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/07/04/releasing-react-native-056">Releasing 0.56</a></h1><p class="post-meta">July 4, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener">Lorenzo Sciandra</a>Core Maintainer &amp; React Native Developer at Drivetribe</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/16104054?s=460&amp;v=4"/></a></div></div></header><article class="post-content"><div><span><p>The long-awaited 0.56 version of React Native is now available 🎉. This blog post highlights some of the <a href="https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#highlights">changes</a> introduced in this new release. We also want to take the opportunity to explain what has kept us busy since March.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/07/04/releasing-react-native-056">Releasing 0.56</a></h1><p class="post-meta">July 4, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener">Lorenzo Sciandra</a>Core Maintainer &amp; React Native Developer at Drivetribe</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/kelset" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/16104054?s=460&amp;v=4" alt="Lorenzo Sciandra"/></a></div></div></header><article class="post-content"><div><span><p>The long-awaited 0.56 version of React Native is now available 🎉. This blog post highlights some of the <a href="https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#highlights">changes</a> introduced in this new release. We also want to take the opportunity to explain what has kept us busy since March.</p>
 <h3><a class="anchor" aria-hidden="true" id="the-breaking-changes-dilemma-or-when-to-release"></a><a href="#the-breaking-changes-dilemma-or-when-to-release" 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 breaking changes dilemma, or, &quot;when to release?&quot;</h3>
 <p>The <a href="https://facebook.github.io/react-native/docs/contributing#our-development-process">Contributor's Guide</a> explains the integration process that all changes to React Native go through. The project has is composed by <a href="https://github.com/facebook/react-native-website/issues/370">many different tools</a>, requiring coordination and constant support to keep everything working properly. Add to this the vibrant open source community that contributes back to the project, and you will get a sense of the mind-bending scale of it all.</p>
 <p>With React Native's impressive adoption, breaking changes must be made with great care, and the process is not as smooth as we'd like. A decision was made to skip the April and May releases to allow the core team to integrate and test a new set of breaking changes. <a href="https://github.com/react-native-community/react-native-releases/issues/14">Dedicated community communication</a> channels were used along the way to ensure that the June 2018 (<code>0.56.0</code>) release is as hassle-free as possible to adopt by those who patiently waited for the stable release.</p>
@@ -157,7 +161,7 @@ accessibilityStates={[“selected”]}
 <p>Happy coding everyone!</p>
 <p><a href="https://twitter.com/Kelset">Lorenzo</a>, <a href="https://github.com/turnrye">Ryan</a>, and the whole <a href="https://twitter.com/reactnative">React Native core team</a></p>
 <p><strong>PS:</strong> as always, we'd like to remind everyone that React Native is still in 0.x versioning because of the many changes still undergoing - so remember when upgrading that yes, probably, something may still crash or be broken. Be helpful towards each other in the issues and when submitting PRs - and remember to follow the <a href="https://code.fb.com/codeofconduct/">CoC</a> enforced: there's always a human on the other side of the screen.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/06/14/state-of-react-native-2018">State of React Native 2018</a></h1><p class="post-meta">June 14, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener">Sophie Alpert</a>Engineering Manager on React at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6820?s=460&amp;v=4"/></a></div></div></header><article class="post-content"><div><span><p>It's been a while since we last published a status update about React Native.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/06/14/state-of-react-native-2018">State of React Native 2018</a></h1><p class="post-meta">June 14, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener">Sophie Alpert</a>Engineering Manager on React at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sophiebits" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6820?s=460&amp;v=4" alt="Sophie Alpert"/></a></div></div></header><article class="post-content"><div><span><p>It's been a while since we last published a status update about React Native.</p>
 <p>At Facebook, we're using React Native more than ever and for many important projects. One of our most popular products is Marketplace, one of the top-level tabs in our app which is used by 800 million people each month. Since its creation in 2015, all of Marketplace has been built with React Native, including over a hundred full-screen views throughout different parts of the app.</p>
 <p>We're also using React Native for many new parts of the app. If you watched the F8 keynote last month, you'll recognize Blood Donations, Crisis Response, Privacy Shortcuts, and Wellness Checks – all recent features built with React Native. And projects outside the main Facebook app are using React Native too. The new Oculus Go VR headset includes <a href="https://www.oculus.com/app/">a companion mobile app</a> that is fully built with React Native, not to mention React VR powering many experiences in the headset itself.</p>
 <p>Naturally, we also use many other technologies to build our apps. <a href="https://fblitho.com/">Litho</a> and <a href="https://componentkit.org/">ComponentKit</a> are two libraries we use extensively in our apps; both provide a React-like component API for building native screens. It's never been a goal for React Native to replace all other technologies – we are focused on making React Native itself better, but we love seeing other teams borrow ideas from React Native, like bringing <a href="https://instagram-engineering.com/instant-feedback-in-ios-engineering-workflows-c3f6508c76c8">instant reload</a> to non-JavaScript code too.</p>
@@ -173,14 +177,14 @@ accessibilityStates={[“selected”]}
 <p>Just as our architecture changes will help React Native interoperate more cleanly with other native infrastructure, React Native should be slimmer on the JavaScript side to fit better with the JavaScript ecosystem, which includes making the VM and bundler swappable. We know the pace of breaking changes can be hard to keep up with, so we'd like to find ways to have fewer major releases. Finally, we know that some teams are looking for more thorough documentation in topics like startup optimization, where our expertise hasn't yet been written down. Expect to see some of these changes over the coming year.</p>
 <p>If you're using React Native, you're part of our community; keep letting us know how we can make React Native better for you.</p>
 <p>React Native is just one tool in a mobile developer's toolbox, but it's one that we strongly believe in – and we're making it better every day, with over 2500 commits in the last year from 500+ contributors.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/05/07/using-typescript-with-react-native">Using TypeScript with React Native</a></h1><p class="post-meta">May 7, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener">Ash Furrow</a>Software Engineer at Artsy</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/498212?s=460&amp;v=4"/></a></div></div></header><article class="post-content"><div><span><p>JavaScript! We all love it. But some of us also love <a href="https://en.wikipedia.org/wiki/Data_type">types</a>. Luckily, options exist to add stronger types to JavaScript. My favourite is <a href="https://www.typescriptlang.org">TypeScript</a>, but React Native supports <a href="https://flow.org">Flow</a> out of the box. Which you prefer is a matter of preference, they each have their own approach on how to add the magic of types to JavaScript. Today, we're going to look at how to use TypeScript in React Native apps.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/05/07/using-typescript-with-react-native">Using TypeScript with React Native</a></h1><p class="post-meta">May 7, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener">Ash Furrow</a>Software Engineer at Artsy</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/ashfurrow" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/498212?s=460&amp;v=4" alt="Ash Furrow"/></a></div></div></header><article class="post-content"><div><span><p>JavaScript! We all love it. But some of us also love <a href="https://en.wikipedia.org/wiki/Data_type">types</a>. Luckily, options exist to add stronger types to JavaScript. My favourite is <a href="https://www.typescriptlang.org">TypeScript</a>, but React Native supports <a href="https://flow.org">Flow</a> out of the box. Which you prefer is a matter of preference, they each have their own approach on how to add the magic of types to JavaScript. Today, we're going to look at how to use TypeScript in React Native apps.</p>
 <p>We'll be using Microsoft's <a href="https://github.com/Microsoft/TypeScript-React-Native-Starter">TypeScript-React-Native-Starter</a> repo as a guide.</p>
 <h2><a class="anchor" aria-hidden="true" id="prerequisites"></a><a href="#prerequisites" 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>Prerequisites</h2>
 <p>Because you might be developing on one of several different platforms, targeting several different types of devices, basic setup can be involved. You should first ensure that you can run a plain React Native app without TypeScript. Follow <a href="https://facebook.github.io/react-native/docs/getting-started.html">the instructions on the React Native website to get started</a>. When you've managed to deploy to a device or emulator, you'll be ready to start a TypeScript React Native app.</p>
 <p>You will also need <a href="https://nodejs.org/en/">Node.js</a>, <a href="https://www.npmjs.com">npm</a>, and <a href="https://yarnpkg.com/lang/en">Yarn</a>.</p>
 <h2><a class="anchor" aria-hidden="true" id="initializing"></a><a href="#initializing" 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>Initializing</h2>
 <p>Once you've tried scaffolding out an ordinary React Native project, you'll be ready to start adding TypeScript. Let's go ahead and do that.</p>
-<pre><code class="hljs css languages- sh">react-native init MyAwesomeProject
+<pre><code class="hljs css language-sh">react-native init MyAwesomeProject
 <span class="hljs-built_in">cd</span> MyAwesomeProject
 </code></pre>
 <h2><a class="anchor" aria-hidden="true" id="adding-typescript"></a><a href="#adding-typescript" 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>Adding TypeScript</h2>
@@ -193,20 +197,20 @@ accessibilityStates={[“selected”]}
 <li>adds <a href="https://github.com/DefinitelyTyped/DefinitelyTyped">typings</a> for React and React Native</li>
 </ul>
 <p>Okay, let's go ahead and run these.</p>
-<pre><code class="hljs css languages- sh">yarn add --dev typescript
+<pre><code class="hljs css language-sh">yarn add --dev typescript
 yarn add --dev react-native-typescript-transformer
 yarn tsc --init --pretty --jsx react
 touch rn-cli.config.js
 yarn add --dev @types/react @types/react-native
 </code></pre>
 <p>The <code>tsconfig.json</code> file contains all the settings for the TypeScript compiler. The defaults created by the command above are mostly fine, but open the file and uncomment the following line:</p>
-<pre><code class="hljs css languages- js">{
+<pre><code class="hljs css language-js">{
   <span class="hljs-comment">/* Search the config file for the following line and uncomment it. */</span>
   <span class="hljs-comment">// "allowSyntheticDefaultImports": true,  /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */</span>
 }
 </code></pre>
 <p>The <code>rn-cli.config.js</code> contains the settings for the React Native TypeScript Transformer. Open it and add the following:</p>
-<pre><code class="hljs css languages- js"><span class="hljs-built_in">module</span>.exports = {
+<pre><code class="hljs css language-js"><span class="hljs-built_in">module</span>.exports = {
   getTransformModulePath() {
     <span class="hljs-keyword">return</span> <span class="hljs-built_in">require</span>.resolve(<span class="hljs-string">'react-native-typescript-transformer'</span>);
   },
@@ -218,7 +222,7 @@ yarn add --dev @types/react @types/react-native
 <h2><a class="anchor" aria-hidden="true" id="migrating-to-typescript"></a><a href="#migrating-to-typescript" 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>Migrating to TypeScript</h2>
 <p>Rename the generated <code>App.js</code> and <code>__tests_/App.js</code> files to <code>App.tsx</code>. <code>index.js</code> needs to use the <code>.js</code> extension. All new files should use the <code>.tsx</code> extension (or <code>.ts</code> if the file doesn't contain any JSX).</p>
 <p>If you tried to run the app now, you'd get an error like <code>object prototype may only be an object or null</code>. This is caused by a failure to import the default export from React as well as a named export on the same line. Open <code>App.tsx</code> and modify the import at the top of the file:</p>
-<pre><code class="hljs css languages- diff"><span class="hljs-deletion">-import React, { Component } from 'react';</span>
+<pre><code class="hljs css language-diff"><span class="hljs-deletion">-import React, { Component } from 'react';</span>
 <span class="hljs-addition">+import React from 'react'</span>
 <span class="hljs-addition">+import { Component } from 'react';</span>
 </code></pre>
@@ -226,10 +230,10 @@ yarn add --dev @types/react @types/react-native
 <p>At this point, you should be able to run the React Native app.</p>
 <h2><a class="anchor" aria-hidden="true" id="adding-typescript-testing-infrastructure"></a><a href="#adding-typescript-testing-infrastructure" 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>Adding TypeScript Testing Infrastructure</h2>
 <p>React Native ships with <a href="https://github.com/facebook/jest">Jest</a>, so for testing a React Native app with TypeScript, we'll want to add <a href="https://www.npmjs.com/package/ts-jest">ts-jest</a> to our <code>devDependencies</code>.</p>
-<pre><code class="hljs css languages- sh">yarn add --dev ts-jest
+<pre><code class="hljs css language-sh">yarn add --dev ts-jest
 </code></pre>
 <p>Then, we'll open up our <code>package.json</code> and replace the <code>jest</code> field with the following:</p>
-<pre><code class="hljs css languages- js">{
+<pre><code class="hljs css language-js">{
   <span class="hljs-string">"jest"</span>: {
     <span class="hljs-string">"preset"</span>: <span class="hljs-string">"react-native"</span>,
     <span class="hljs-string">"moduleFileExtensions"</span>: [
@@ -254,18 +258,18 @@ yarn add --dev @types/react @types/react-native
 <h2><a class="anchor" aria-hidden="true" id="installing-dependency-type-declarations"></a><a href="#installing-dependency-type-declarations" 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>Installing Dependency Type Declarations</h2>
 <p>To get the best experience in TypeScript, we want the type-checker to understand the shape and API of our dependencies. Some libraries will publish their packages with <code>.d.ts</code> files (type declaration/type definition files), which can describe the shape of the underlying JavaScript. For other libraries, we'll need to explicitly install the appropriate package in the <code>@types/</code> npm scope.</p>
 <p>For example, here we'll need types for Jest, React, and React Native, and React Test Renderer.</p>
-<pre><code class="hljs css languages- ts">yarn add --dev <span class="hljs-meta">@types</span>/jest <span class="hljs-meta">@types</span>/react <span class="hljs-meta">@types</span>/react-native <span class="hljs-meta">@types</span>/react-test-renderer
+<pre><code class="hljs css language-ts">yarn add --dev <span class="hljs-meta">@types</span>/jest <span class="hljs-meta">@types</span>/react <span class="hljs-meta">@types</span>/react-native <span class="hljs-meta">@types</span>/react-test-renderer
 </code></pre>
 <p>We saved these declaration file packages to our <em>dev</em> dependencies because this is a React Native <em>app</em> that only uses these dependencies during development and not during runtime. If we were publishing a library to NPM, we might have to add some of these type dependencies as regular dependencies.</p>
 <p>You can read more <a href="https://www.typescriptlang.org/docs/handbook/declaration-files/consumption.html">here about getting <code>.d.ts</code> files</a>.</p>
 <h2><a class="anchor" aria-hidden="true" id="ignoring-more-files"></a><a href="#ignoring-more-files" 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>Ignoring More Files</h2>
 <p>For your source control, you'll want to start ignoring the <code>.jest</code> folder. If you're using git, we can just add entries to our <code>.gitignore</code> file.</p>
-<pre><code class="hljs css languages- config"><span class="hljs-meta">#</span><span class="bash"> Jest</span>
+<pre><code class="hljs css language-config"><span class="hljs-meta">#</span><span class="bash"> Jest</span>
 <span class="hljs-meta">#</span><span class="bash"></span>
 .jest/
 </code></pre>
 <p>As a checkpoint, consider committing your files into version control.</p>
-<pre><code class="hljs css languages- sh">git init
+<pre><code class="hljs css language-sh">git init
 git add .gitignore <span class="hljs-comment"># import to do this first, to ignore our files</span>
 git add .
 git commit -am <span class="hljs-string">"Initial commit."</span>
@@ -273,7 +277,7 @@ git commit -am <span class="hljs-string">"Initial commit."</span>
 <h2><a class="anchor" aria-hidden="true" id="adding-a-component"></a><a href="#adding-a-component" 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>Adding a Component</h2>
 <p>Let's add a component to our app. Let's go ahead and create a <code>Hello.tsx</code> component. It's a pedagogical component, not something that you'd actually write in an app, but something nontrivial that shows off how to use TypeScript in React Native.</p>
 <p>Create a <code>components</code> directory and add the following example.</p>
-<pre><code class="hljs css languages- ts">// components/Hello.tsx
+<pre><code class="hljs css language-ts">// components/Hello.tsx
 import React from 'react';
 import {Button, StyleSheet, Text, View} from 'react-native';
 
@@ -369,10 +373,10 @@ const styles = StyleSheet.create({
 <h2><a class="anchor" aria-hidden="true" id="adding-a-component-test"></a><a href="#adding-a-component-test" 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>Adding a Component Test</h2>
 <p>Now that we've got a component, let's try testing it.</p>
 <p>We already have Jest installed as a test runner. We're going to write snapshot tests for our components, let's add the required add-on for snapshot tests:</p>
-<pre><code class="hljs css languages- sh">yarn add --dev react-addons-test-utils
+<pre><code class="hljs css language-sh">yarn add --dev react-addons-test-utils
 </code></pre>
 <p>Now let's create a <code>__tests__</code> folder in the <code>components</code> directory and add a test for <code>Hello.tsx</code>:</p>
-<pre><code class="hljs css languages- ts"><span class="hljs-comment">// components/__tests__/Hello.tsx</span>
+<pre><code class="hljs css language-ts"><span class="hljs-comment">// components/__tests__/Hello.tsx</span>
 <span class="hljs-keyword">import</span> React <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
 <span class="hljs-keyword">import</span> renderer <span class="hljs-keyword">from</span> <span class="hljs-string">'react-test-renderer'</span>;
 
@@ -389,7 +393,7 @@ it(<span class="hljs-string">'renders correctly with defaults'</span>, <span cla
 <h2><a class="anchor" aria-hidden="true" id="next-steps"></a><a href="#next-steps" 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>Next Steps</h2>
 <p>Check out the official <a href="https://reactjs.org/tutorial/tutorial.html">React tutorial</a> and state-management library <a href="http://redux.js.org">Redux</a>. These resources can be helpful when writing React Native apps. Additionally, you may want to look at <a href="https://microsoft.github.io/reactxp/">ReactXP</a>, a component library written entirely in TypeScript that supports both React on the web as well as React Native.</p>
 <p>Have fun in a more type-safe React Native development environment!</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/04/09/build-com-app">Built with React Native - The Build.com app</a></h1><p class="post-meta">April 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener">Garrett McCullough</a>Senior Mobile Engineer</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/955503100785172486/UrMKkQXc_400x400.jpg"/></a></div></div></header><article class="post-content"><div><span><p><a href="https://www.build.com/">Build.com</a>, headquartered in Chico, California, is one of the largest online retailers for home improvement items. The team has had a strong web-centric business for 18 years and began thinking about a mobile App in 2015. Building unique iOS and Android apps wasn’t practical due to our small team and limited native experience. Instead, we decided to take a risk on the very new React Native framework. Our initial commit was on August 12, 2015 using React Native v0.8.0! We were live in both App Stores on October 15, 2016. Over the last two years, we’ve continued to upgrade and expand the app. We are currently on React Native version 0.53.0.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/04/09/build-com-app">Built with React Native - The Build.com app</a></h1><p class="post-meta">April 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener">Garrett McCullough</a>Senior Mobile Engineer</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/gwmccull" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/955503100785172486/UrMKkQXc_400x400.jpg" alt="Garrett McCullough"/></a></div></div></header><article class="post-content"><div><span><p><a href="https://www.build.com/">Build.com</a>, headquartered in Chico, California, is one of the largest online retailers for home improvement items. The team has had a strong web-centric business for 18 years and began thinking about a mobile App in 2015. Building unique iOS and Android apps wasn’t practical due to our small team and limited native experience. Instead, we decided to take a risk on the very new React Native framework. Our initial commit was on August 12, 2015 using React Native v0.8.0! We were live in both App Stores on October 15, 2016. Over the last two years, we’ve continued to upgrade and expand the app. We are currently on React Native version 0.53.0.</p>
 <p>You can check out the app at <a href="https://www.build.com/app">https://www.build.com/app</a>.</p>
 <p align="center">
   <img src="/react-native/blog/assets/build-com-blog-image.jpg" />
@@ -442,7 +446,7 @@ it(<span class="hljs-string">'renders correctly with defaults'</span>, <span cla
 <li>Improve the experience for adding native libraries and bridge modules to a project</li>
 </ul>
 <p>Companies and individuals in the React Native community have been great about volunteering their time and effort to improve the tools that we all use. If you haven’t gotten involved in open source, I hope you’ll take a look at improving the code or documentation for some of the libraries that you use. There are a lot of articles to help you get started and it may be a lot easier than you think!</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native">Building &lt;InputAccessoryView&gt; For React Native</a></h1><p class="post-meta">March 22, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener">Peter Argany</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/6011080?s=400&amp;u=028e28081107d0ab16a5cb22baca43c080f5fa50&amp;v=4"/></a></div></div></header><article class="post-content"><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/22/building-input-accessory-view-for-react-native">Building &lt;InputAccessoryView&gt; For React Native</a></h1><p class="post-meta">March 22, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener">Peter Argany</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/PeteTheHeat" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/6011080?s=400&amp;u=028e28081107d0ab16a5cb22baca43c080f5fa50&amp;v=4" alt="Peter Argany"/></a></div></div></header><article class="post-content"><div><span><h2><a class="anchor" aria-hidden="true" id="motivation"></a><a href="#motivation" 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>Motivation</h2>
 <p>Three years ago, a GitHub issue was opened to support input accessory view from React Native.</p>
 <p><img src="/react-native/blog/assets/input-accessory-1.png"/></p>
 <p>In the ensuing years, there have been countless '+1s', various workarounds, and zero concrete changes to RN on this issue - until today. Starting with iOS, <a href="http://facebook.github.io/react-native/docs/next/inputaccessoryview.html">we're exposing an API</a> for accessing the native input accessory view and we are excited to share how we built it.</p>
@@ -483,7 +487,7 @@ it(<span class="hljs-string">'renders correctly with defaults'</span>, <span cla
 <hr style="clear: both; margin-bottom: 20px"/>
 <h2><a class="anchor" aria-hidden="true" id="example-usage"></a><a href="#example-usage" 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>Example Usage</h2>
 <p>Here's an example which builds a keyboard toolbar button to reset <code>&lt;TextInput&gt;</code> state.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">TextInputAccessoryViewExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span>&lt;</span>{}, *&gt; {
+<pre><code class="hljs css language-javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">TextInputAccessoryViewExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span>&lt;</span>{}, *&gt; {
   <span class="hljs-keyword">constructor</span>(props) {
     <span class="hljs-keyword">super</span>(props);
     <span class="hljs-keyword">this</span>.state = {<span class="hljs-attr">text</span>: <span class="hljs-string">'Placeholder Text'</span>};
@@ -516,7 +520,7 @@ it(<span class="hljs-string">'renders correctly with defaults'</span>, <span cla
 <h2><a class="anchor" aria-hidden="true" id="when-will-i-be-able-to-use-this"></a><a href="#when-will-i-be-able-to-use-this" 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>When will I be able to use this?</h2>
 <p>The full commit for this feature implementation is <a href="https://github.com/facebook/react-native/commit/38197c8230657d567170cdaf8ff4bbb4aee732b8">here</a>. <a href="http://facebook.github.io/react-native/docs/next/inputaccessoryview.html"><code>&lt;InputAccessoryView&gt;</code></a> will be available in the upcoming v0.55.0 release.</p>
 <p>Happy keyboarding :)</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/05/AWS-app-sync">Using AWS with React Native</a></h1><p class="post-meta">March 5, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener">Richard Threlkeld</a>Senior Technical Product Manager at AWS Mobile</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/811239086581227520/APX1eZwF_400x400.jpg"/></a></div></div></header><article class="post-content"><div><span><p>AWS is well known in the technology industry as a provider of cloud services. These include compute, storage, and database technologies, as well as fully managed serverless offerings. The AWS Mobile team has been working closely with customers and members of the JavaScript ecosystem to make cloud-connected mobile and web applications more secure, scalable, and easier to develop and deploy. We began with a <a href="https://github.com/awslabs/aws-mobile-react-native-starter">complete starter kit</a>, but have a few more recent developments.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/03/05/AWS-app-sync">Using AWS with React Native</a></h1><p class="post-meta">March 5, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener">Richard Threlkeld</a>Senior Technical Product Manager at AWS Mobile</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/undef_obj" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/811239086581227520/APX1eZwF_400x400.jpg" alt="Richard Threlkeld"/></a></div></div></header><article class="post-content"><div><span><p>AWS is well known in the technology industry as a provider of cloud services. These include compute, storage, and database technologies, as well as fully managed serverless offerings. The AWS Mobile team has been working closely with customers and members of the JavaScript ecosystem to make cloud-connected mobile and web applications more secure, scalable, and easier to develop and deploy. We began with a <a href="https://github.com/awslabs/aws-mobile-react-native-starter">complete starter kit</a>, but have a few more recent developments.</p>
 <p>This blog post talks about some interesting things for React and React Native developers:</p>
 <ul>
 <li><a href="https://github.com/aws/aws-amplify"><strong>AWS Amplify</strong></a>, a declarative library for JavaScript applications using cloud services</li>
@@ -634,7 +638,7 @@ export <span class="hljs-keyword">default</span> withAuthenticator(<span class="
 <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/FtkVlIal_m0?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
 <h2><a class="anchor" aria-hidden="true" id="feedback"></a><a href="#feedback" 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>Feedback</h2>
 <p>The team behind the libraries is eager to hear how these libraries and services work for you. They also want to hear what else we can do to make React and React Native development with cloud services easier for you. Reach out to the AWS Mobile team on GitHub for <a href="https://github.com/aws/aws-amplify">AWS Amplify</a> or <a href="https://github.com/aws-samples/aws-mobile-appsync-events-starter-react-native">AWS AppSync</a>.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native">Implementing Twitter’s App Loading Animation in React Native</a></h1><p class="post-meta">January 18, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener">Eli White</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/249164?s=460&amp;v=4"/></a></div></div></header><article class="post-content"><div><span><p>Twitter’s iOS app has a loading animation I quite enjoy.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native">Implementing Twitter’s App Loading Animation in React Native</a></h1><p class="post-meta">January 18, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener">Eli White</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/TheSavior" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/249164?s=460&amp;v=4" alt="Eli White"/></a></div></div></header><article class="post-content"><div><span><p>Twitter’s iOS app has a loading animation I quite enjoy.</p>
 <p><img src="/react-native/blog/assets/loading-screen-01.gif" style="float: left; padding-right: 80px; padding-bottom: 20px"/></p>
 <p>Once the app is ready, the Twitter logo delightfully expands, revealing the app.</p>
 <p>I wanted to figure out how to recreate this loading animation with React Native.</p>
@@ -669,7 +673,7 @@ export <span class="hljs-keyword">default</span> withAuthenticator(<span class="
 <h2><a class="anchor" aria-hidden="true" id="now-for-the-react-native"></a><a href="#now-for-the-react-native" 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>Now, for the React Native</h2>
 <p>Alrighty. Now that we know what we are building and how the animation works, we can get down to the code — the reason you are really here.</p>
 <p>The main piece of this puzzle is <a href="https://facebook.github.io/react-native/docs/maskedviewios.html">MaskedViewIOS</a>, a core React Native component.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">import</span> {MaskedViewIOS} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">import</span> {MaskedViewIOS} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
 
 <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">MaskedViewIOS</span> <span class="hljs-attr">maskElement</span>=<span class="hljs-string">{</span>&lt;<span class="hljs-attr">Text</span>&gt;</span>Basic Mask<span class="hljs-tag">&lt;/<span class="hljs-name">Text</span>&gt;</span>}&gt;
   <span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{{backgroundColor:</span> '<span class="hljs-attr">blue</span>'}} /&gt;</span>
@@ -677,7 +681,7 @@ export <span class="hljs-keyword">default</span> withAuthenticator(<span class="
 </span></code></pre>
 <p><code>MaskedViewIOS</code> takes props <code>maskElement</code> and <code>children</code>. The children are masked by the <code>maskElement</code>. Note that the mask doesn’t need to be an image, it can be any arbitrary view. The behavior of the above example would be to render the blue view, but for it to be visible only where the words “Basic Mask” are from the <code>maskElement</code>. We just made complicated blue text.</p>
 <p>What we want to do is render our blue layer, and then on top render our masked app and white layers with the Twitter logo.</p>
-<pre><code class="hljs css languages- javascript">{
+<pre><code class="hljs css language-javascript">{
   fullScreenBlueLayer;
 }
 &lt;MaskedViewIOS
@@ -713,12 +717,12 @@ export <span class="hljs-keyword">default</span> withAuthenticator(<span class="
 <p><code>Animated.Value</code> is a wrapper around a native value that Animated uses to know the state of an animation. You typically want to only have one of these for a complete animation. Most components that use Animated will store the value in state.</p>
 <p>Since I’m thinking about this animation as steps occurring at different points in time along the complete animation, we will start our <code>Animated.Value</code> at 0, representing 0% complete, and end our value at 100, representing 100% complete.</p>
 <p>Our initial component state will be the following.</p>
-<pre><code class="hljs css languages- javascript">state = {
+<pre><code class="hljs css language-javascript">state = {
   <span class="hljs-attr">loadingProgress</span>: <span class="hljs-keyword">new</span> Animated.Value(<span class="hljs-number">0</span>),
 };
 </code></pre>
 <p>When we are ready to begin the animation, we tell Animated to animate this value to 100.</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
+<pre><code class="hljs css language-javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
   <span class="hljs-attr">toValue</span>: <span class="hljs-number">100</span>,
   <span class="hljs-attr">duration</span>: <span class="hljs-number">1000</span>,
   <span class="hljs-attr">useNativeDriver</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">// This is important!</span>
@@ -731,7 +735,7 @@ export <span class="hljs-keyword">default</span> withAuthenticator(<span class="
 <p>The app scale starts at 1.1 and scales down to its regular scale by the end of the animation.</p>
 <h2><a class="anchor" aria-hidden="true" id="and-now-in-code"></a><a href="#and-now-in-code" 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>And now, in code.</h2>
 <p>What we essentially did above is map the values from the animation progress percentage to the values for the individual pieces. We do that with Animated using <code>.interpolate</code>. We create 3 different style objects, one for each piece of the animation, using interpolated values based off of <code>this.state.loadingProgress</code>.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> loadingProgress = <span class="hljs-keyword">this</span>.state.loadingProgress;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> loadingProgress = <span class="hljs-keyword">this</span>.state.loadingProgress;
 
 <span class="hljs-keyword">const</span> opacityClearToVisible = {
   <span class="hljs-attr">opacity</span>: loadingProgress.interpolate({
@@ -765,7 +769,7 @@ export <span class="hljs-keyword">default</span> withAuthenticator(<span class="
 };
 </code></pre>
 <p>Now that we have these style objects, we can use them when rendering the snippet of the view from earlier in the post. Note that only <code>Animated.View</code>, <code>Animated.Text</code>, and <code>Animated.Image</code> are able to use style objects that use <code>Animated.Value</code>.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = &lt;View style={styles.fullScreenBlueLayer} /&gt;;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = &lt;View style={styles.fullScreenBlueLayer} /&gt;;
 const fullScreenWhiteLayer = &lt;View style={styles.fullScreenWhiteLayer} /&gt;;
 
 return (
@@ -792,7 +796,7 @@ return (
 <p><img src="/react-native/blog/assets/loading-screen-06.gif" style="float: left; padding-right: 80px; padding-bottom: 20px"/></p>
 <p>Yay! We now have the animation pieces looking like we want. Now we just have to clean up our blue and white layers which will never be seen again.</p>
 <p>To know when we can clean them up, we need to know when the animation is complete. Luckily where we call, <code>Animated.timing</code> ,<code>.start</code> takes an optional callback that runs when the animation is complete.</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
+<pre><code class="hljs css language-javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.loadingProgress, {
   <span class="hljs-attr">toValue</span>: <span class="hljs-number">100</span>,
   <span class="hljs-attr">duration</span>: <span class="hljs-number">1000</span>,
   <span class="hljs-attr">useNativeDriver</span>: <span class="hljs-literal">true</span>,
@@ -803,7 +807,7 @@ return (
 });
 </code></pre>
 <p>Now that we have a value in <code>state</code> to know whether we are done with the animation, we can modify our blue and white layers to use that.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = <span class="hljs-keyword">this</span>.state.animationDone ? <span class="hljs-literal">null</span> : (
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> fullScreenBlueLayer = <span class="hljs-keyword">this</span>.state.animationDone ? <span class="hljs-literal">null</span> : (
   &lt;View style={[styles.fullScreenBlueLayer]} /&gt;
 );
 const fullScreenWhiteLayer = this.state.animationDone ? null : (
@@ -821,7 +825,7 @@ const fullScreenWhiteLayer = this.state.animationDone ? null : (
 <li>The actual Twitter animation seems to speed up the mask reveal towards the end. Try modifying the loader to use a different easing function (or a spring!) to better match that behavior.</li>
 <li>The current end-scale of the mask is hard coded and likely won’t reveal the entire app on a tablet. Calculating the end scale based on screen size and image size would be an awesome PR.</li>
 </ol>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/09/react-native-monthly-6">React Native Monthly #6</a></h1><p class="post-meta">January 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><article class="post-content"><div><span><p>The React Native monthly meeting is still going strong! Make sure to check a note on the bottom of this post for the next sessions.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2018/01/09/react-native-monthly-6">React Native Monthly #6</a></h1><p class="post-meta">January 9, 2018</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/TomislavTenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><article class="post-content"><div><span><p>The React Native monthly meeting is still going strong! Make sure to check a note on the bottom of this post for the next sessions.</p>
 <h3><a class="anchor" aria-hidden="true" id="expo"></a><a href="#expo" 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>Expo</h3>
 <ul>
 <li>Congratulations to <a href="https://github.com/dabbott">Devin Abbott</a> and <a href="https://twitter.com/hdjirdeh">Houssein Djirdeh</a> on their pre-release of the &quot;Full Stack React Native&quot; book! It walks you through learning React Native by building several small apps. You can try those apps out on <a href="https://www.fullstackreact.com/react-native/">https://www.fullstackreact.com/react-native/</a> before buying the book.</li>

blog/page2/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="posts"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/11/06/react-native-monthly-5">React Native Monthly #5</a></h1><p class="post-meta">November 6, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><article class="post-content"><div><span><p>The React Native monthly meeting continues! Let's see what our teams are up to.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="posts"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/11/06/react-native-monthly-5">React Native Monthly #5</a></h1><p class="post-meta">November 6, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Founder at Speck</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><article class="post-content"><div><span><p>The React Native monthly meeting continues! Let's see what our teams are up to.</p>
 <h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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>Callstack</h3>
 <ul>
 <li>We’ve been working on React Native CI. Most importantly, we have migrated from Travis to Circle, leaving React Native with a single, unified CI pipeline.</li>
@@ -93,7 +97,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for Wednesday 6, December 2017. Feel free to ping me <a href="https://twitter.com/TomislavTenodi">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/09/21/react-native-monthly-4">React Native Monthly #4</a></h1><p class="post-meta">September 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg"/></a></div></div></header><article class="post-content"><div><span><p>The React Native monthly meeting continues! Here are the notes from each team:</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/09/21/react-native-monthly-4">React Native Monthly #4</a></h1><p class="post-meta">September 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg" alt="Mike Grabowski"/></a></div></div></header><article class="post-content"><div><span><p>The React Native monthly meeting continues! Here are the notes from each team:</p>
 <h3><a class="anchor" aria-hidden="true" id="callstack"></a><a href="#callstack" 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>Callstack</h3>
 <ul>
 <li><a href="https://react-native.eu">React Native EU</a> is over. More than 300 participants from 33 countries have visited Wroclaw. Talks can be found <a href="https://www.youtube.com/channel/UCUNE_g1mQPuyW975WjgjYxA/videos">on Youtube</a>.</li>
@@ -125,7 +129,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for Wednesday 10, October 2017. As this was only our fourth meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/grabbou">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/08/30/react-native-monthly-3">React Native Monthly #3</a></h1><p class="post-meta">August 30, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg"/></a></div></div></header><article class="post-content"><div><span><p>The React Native monthly meeting continues! This month's meeting was a bit shorter as most of our teams were busy shipping. Next month, we are at <a href="https://react-native.eu/">React Native EU</a> conference in Wroclaw, Poland. Make sure to grab a ticket and see you there in person! Meanwhile, let's see what our teams are up to.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/08/30/react-native-monthly-3">React Native Monthly #3</a></h1><p class="post-meta">August 30, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener">Mike Grabowski</a>CTO at Callstack</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/grabbou" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/988860423897313281/L9ErG_lr_400x400.jpg" alt="Mike Grabowski"/></a></div></div></header><article class="post-content"><div><span><p>The React Native monthly meeting continues! This month's meeting was a bit shorter as most of our teams were busy shipping. Next month, we are at <a href="https://react-native.eu/">React Native EU</a> conference in Wroclaw, Poland. Make sure to grab a ticket and see you there in person! Meanwhile, let's see what our teams are up to.</p>
 <h2><a class="anchor" aria-hidden="true" id="teams"></a><a href="#teams" 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>Teams</h2>
 <p>On this third meeting, we had 5 teams join us:</p>
 <ul>
@@ -198,7 +202,7 @@
 <p>The lesson so far has been to <em>measure, measure, measure!</em> Some wins come from moving run-time costs to build time, such as Relay Modern and <a href="https://github.com/facebook/react-native/commit/797ca6c219b2a44f88f10c61d91e8cc21e2f306e">Lazy NativeModules</a>. Other wins come from avoiding work by being smarter about parallelizing code or removing dead code. And some wins come from large architectural changes to React Native, such as cleaning up thread blockages. There is no grand solution to performance, and longer-term performance wins will come from incremental instrumentation and improvements. Do not let cognitive bias influence your decisions. Instead, carefully gather and interpret production data to guide future work.</p>
 <h2><a class="anchor" aria-hidden="true" id="future-plans"></a><a href="#future-plans" 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>Future plans</h2>
 <p>In the long term, we want Marketplace TTI to be comparable to similar products built with Native, and, in general, have React Native performance on par with native performance. Further more, although this half we drastically reduced the bridge startup cost by about 80%, we plan to bring the cost of the React Native bridge close to zero via projects like <a href="https://prepack.io/">Prepack</a> and more build time processing.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/07/28/react-native-monthly-2">React Native Monthly #2</a></h1><p class="post-meta">July 28, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><article class="post-content"><div><span><p>The React Native monthly meeting continues! On this session, we were joined by <a href="https://infinite.red/">Infinite Red</a>, great minds behind <a href="https://infinite.red/ChainReactConf">Chain React, the React Native Conference</a>. As most of the people here were presenting talks at Chain React, we pushed the meeting to a week later. Talks from the conference have been <a href="https://www.youtube.com/playlist?list=PLFHvL21g9bk3RxJ1Ut5nR_uTZFVOxu522">posted online</a> and I encourage you to check them out. So, let's see what our teams are up to.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/07/28/react-native-monthly-2">React Native Monthly #2</a></h1><p class="post-meta">July 28, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><article class="post-content"><div><span><p>The React Native monthly meeting continues! On this session, we were joined by <a href="https://infinite.red/">Infinite Red</a>, great minds behind <a href="https://infinite.red/ChainReactConf">Chain React, the React Native Conference</a>. As most of the people here were presenting talks at Chain React, we pushed the meeting to a week later. Talks from the conference have been <a href="https://www.youtube.com/playlist?list=PLFHvL21g9bk3RxJ1Ut5nR_uTZFVOxu522">posted online</a> and I encourage you to check them out. So, let's see what our teams are up to.</p>
 <h2><a class="anchor" aria-hidden="true" id="teams"></a><a href="#teams" 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>Teams</h2>
 <p>On this second meeting, we had 9 teams join us:</p>
 <ul>
@@ -291,7 +295,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>The next session is scheduled for August 16, 2017. As this was only our second meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/TomislavTenodi">on Twitter</a> if you have any suggestion on how we should improve the output of the meeting.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/06/21/react-native-monthly-1">React Native Monthly #1</a></h1><p class="post-meta">June 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg"/></a></div></div></header><article class="post-content"><div><span><p>At <a href="https://shoutem.github.io/">Shoutem</a>, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep up with the pace the community was growing and improving. That's why we decided to organize a monthly meeting where all major React Native contributors can briefly present what their efforts and plans are.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/06/21/react-native-monthly-1">React Native Monthly #1</a></h1><p class="post-meta">June 21, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener">Tomislav Tenodi</a>Product Manager at Shoutem</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tenodi" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/877237660225609729/bKFDwfAq.jpg" alt="Tomislav Tenodi"/></a></div></div></header><article class="post-content"><div><span><p>At <a href="https://shoutem.github.io/">Shoutem</a>, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep up with the pace the community was growing and improving. That's why we decided to organize a monthly meeting where all major React Native contributors can briefly present what their efforts and plans are.</p>
 <h2><a class="anchor" aria-hidden="true" id="monthly-meetings"></a><a href="#monthly-meetings" 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>Monthly meetings</h2>
 <p>We had our first session of the monthly meeting on June 14, 2017. The mission for React Native Monthly is simple and straightforward: <strong>improve the React Native community</strong>. Presenting teams' efforts eases collaboration between teams done offline.</p>
 <h2><a class="anchor" aria-hidden="true" id="teams"></a><a href="#teams" 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>Teams</h2>
@@ -367,7 +371,7 @@
 </ul>
 <h2><a class="anchor" aria-hidden="true" id="next-session"></a><a href="#next-session" 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>Next session</h2>
 <p>Meetings will be held every four weeks. The next session is scheduled for July 12, 2017. As we just started with this meeting, we'd like to know how do these notes benefit the React Native community. Feel free to ping me <a href="https://twitter.com/TomislavTenodi">on Twitter</a> if you have any suggestion on what we should cover in the following sessions, or how we should improve the output of the meeting.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/introducing-create-react-native-app">Introducing Create React Native App</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener">Adam Perry</a>Software Engineer at Expo</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6812281"/></a></div></div></header><article class="post-content"><div><span><p>Today we’re announcing <a href="https://github.com/react-community/create-react-native-app">Create React Native App</a>: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of <a href="https://github.com/facebookincubator/create-react-app">Create React App</a> and is the product of a collaboration between <a href="https://code.facebook.com">Facebook</a> and <a href="https://expo.io">Expo</a> (formerly Exponent).</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/introducing-create-react-native-app">Introducing Create React Native App</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener">Adam Perry</a>Software Engineer at Expo</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/dikaiosune" target="_blank" rel="noreferrer noopener"><img src="https://avatars2.githubusercontent.com/u/6812281" alt="Adam Perry"/></a></div></div></header><article class="post-content"><div><span><p>Today we’re announcing <a href="https://github.com/react-community/create-react-native-app">Create React Native App</a>: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of <a href="https://github.com/facebookincubator/create-react-app">Create React App</a> and is the product of a collaboration between <a href="https://code.facebook.com">Facebook</a> and <a href="https://expo.io">Expo</a> (formerly Exponent).</p>
 <p>Many developers struggle with installing and configuring React Native’s current native build dependencies, especially for Android. With Create React Native App, there’s no need to use Xcode or Android Studio, and you can develop for your iOS device using Linux or Windows. This is accomplished using the Expo app, which loads and runs CRNA projects written in pure JavaScript without compiling any native code.</p>
 <p>Try creating a new project (replace with suitable yarn commands if you have it installed):</p>
 <pre><code class="hljs">$ <span class="hljs-string">npm </span>i -g <span class="hljs-built_in">create-react-native-app</span>
@@ -381,16 +385,16 @@ $ <span class="hljs-built_in">create-react-native-app</span> <span class="hljs-s
 <p>You can run <code>npm run eject</code> to get a project very similar to what <code>react-native init</code> would generate. At that point you’ll need Xcode and/or Android Studio just as you would if you started with <code>react-native init</code> , adding libraries with <code>react-native link</code> will work, and you’ll have full control over the native code compilation process.</p>
 <h2><a class="anchor" aria-hidden="true" id="questions-feedback"></a><a href="#questions-feedback" 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>Questions? Feedback?</h2>
 <p>Create React Native App is now stable enough for general use, which means we’re very eager to hear about your experience using it! You can find me <a href="https://twitter.com/dika10sune">on Twitter</a> or open an issue on <a href="https://github.com/react-community/create-react-native-app">the GitHub repository</a>. Pull requests are very welcome!</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/idx-the-existential-function">idx: The Existential Function</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener">Timothy Yung</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/1592444107/image.jpg"/></a></div></div></header><article class="post-content"><div><span><p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/idx-the-existential-function">idx: The Existential Function</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener">Timothy Yung</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/yungsters" target="_blank" rel="noreferrer noopener"><img src="https://pbs.twimg.com/profile_images/1592444107/image.jpg" alt="Timothy Yung"/></a></div></div></header><article class="post-content"><div><span><p>At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors.</p>
 <p>Unfortunately, accessing these deeply nested values is currently tedious and verbose.</p>
-<pre><code class="hljs css languages- javascript">props.user &amp;&amp;
+<pre><code class="hljs css language-javascript">props.user &amp;&amp;
   props.user.friends &amp;&amp;
   props.user.friends[<span class="hljs-number">0</span>] &amp;&amp;
   props.user.friends[<span class="hljs-number">0</span>].friends;
 </code></pre>
 <p>There is <a href="https://github.com/claudepache/es-optional-chaining">an ECMAScript proposal to introduce the existential operator</a> which will make this much more convenient. But until a time when that proposal is finalized, we want a solution that improves our quality of life, maintains existing language semantics, and encourages type safety with Flow.</p>
 <p>We came up with an existential <em>function</em> we call <code>idx</code>.</p>
-<pre><code class="hljs css languages- javascript">idx(props, (_) =&gt; _.user.friends[<span class="hljs-number">0</span>].friends);
+<pre><code class="hljs css language-javascript">idx(props, (_) =&gt; _.user.friends[<span class="hljs-number">0</span>].friends);
 </code></pre>
 <p>The invocation in this code snippet behaves similarly to the boolean expression in the code snippet above, except with significantly less repetition. The <code>idx</code> function takes exactly two arguments:</p>
 <ul>
@@ -399,7 +403,7 @@ $ <span class="hljs-built_in">create-react-native-app</span> <span class="hljs-s
 </ul>
 <p>In theory, the <code>idx</code> function will try-catch errors that are the result of accessing properties on null or undefined. If such an error is caught, it will return either null or undefined. (And you can see how this might be implemented in <a href="https://github.com/facebookincubator/idx/blob/master/packages/idx/src/idx.js">idx.js</a>.)</p>
 <p>In practice, try-catching every nested property access is slow, and differentiating between specific kinds of TypeErrors is fragile. To deal with these shortcomings, we created a Babel plugin that transforms the above <code>idx</code> invocation into the following expression:</p>
-<pre><code class="hljs css languages- javascript">props.user == <span class="hljs-literal">null</span>
+<pre><code class="hljs css language-javascript">props.user == <span class="hljs-literal">null</span>
   ? props.user
   : props.user.friends == <span class="hljs-literal">null</span>
     ? props.user.friends
@@ -409,7 +413,7 @@ $ <span class="hljs-built_in">create-react-native-app</span> <span class="hljs-s
 </code></pre>
 <p>Finally, we added a custom Flow type declaration for <code>idx</code> that allows the traversal in the second argument to be properly type-checked while permitting nested access on nullable properties.</p>
 <p>The function, Babel plugin, and Flow declaration are now <a href="https://github.com/facebookincubator/idx">available on GitHub</a>. They are used by installing the <strong>idx</strong> and <strong>babel-plugin-idx</strong> npm packages, and adding “idx” to the list of plugins in your <code>.babelrc</code> file.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/better-list-views">Better List Views in React Native</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener">Spencer Ahrens</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/1509831"/></a></div></div></header><article class="post-content"><div><span><p>Many of you have started playing with some of our new List components already after our <a href="https://www.facebook.com/groups/react.native.community/permalink/921378591331053">teaser announcement in the community group</a>, but we are officially announcing them today! No more <code>ListView</code>s or <code>DataSource</code>s, stale rows, ignored bugs, or excessive memory consumption - with the latest React Native March 2017 release candidate (<code>0.43-rc.1</code>) you can pick from the new suite of components what best fits your use-case, with great perf and feature sets out of the box:</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/03/13/better-list-views">Better List Views in React Native</a></h1><p class="post-meta">March 13, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener">Spencer Ahrens</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/sahrens" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/1509831" alt="Spencer Ahrens"/></a></div></div></header><article class="post-content"><div><span><p>Many of you have started playing with some of our new List components already after our <a href="https://www.facebook.com/groups/react.native.community/permalink/921378591331053">teaser announcement in the community group</a>, but we are officially announcing them today! No more <code>ListView</code>s or <code>DataSource</code>s, stale rows, ignored bugs, or excessive memory consumption - with the latest React Native March 2017 release candidate (<code>0.43-rc.1</code>) you can pick from the new suite of components what best fits your use-case, with great perf and feature sets out of the box:</p>
 <h3><a class="anchor" aria-hidden="true" id="flatlist-https-facebookgithubio-react-native-releases-next-flatlistmd"></a><a href="#flatlist-https-facebookgithubio-react-native-releases-next-flatlistmd" 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><a href="https://facebook.github.io/react-native/releases/next/flatlist.md"><code>&lt;FlatList&gt;</code></a></h3>
 <p>This is the workhorse component for simple, performant lists. Provide an array of data and a <code>renderItem</code> function and you're good to go:</p>
 <pre><code class="hljs">&lt;FlatList
@@ -455,7 +459,7 @@ $ <span class="hljs-built_in">create-react-native-app</span> <span class="hljs-s
 <ul>
 <li><p>The internal state of item subtrees is not preserved when content scrolls out of the render window. Make sure all your data is captured in the item data or external stores like Flux, Redux, or Relay.</p></li>
 <li><p>These components are based on <code>PureComponent</code> which means that they will not re-render if <code>props</code> remains shallow-equal. Make sure that everything your <code>renderItem</code> function depends on directly is passed as a prop that is not <code>===</code> after updates, otherwise your UI may not update on changes. This includes the <code>data</code> prop and parent component state. For example:</p>
-<pre><code class="hljs css languages- javascript">&lt;FlatList
+<pre><code class="hljs css language-javascript">&lt;FlatList
   data={<span class="hljs-keyword">this</span>.state.data}
   renderItem={({item}) =&gt; (
     <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">MyItem</span>
@@ -500,7 +504,7 @@ $ <span class="hljs-built_in">create-react-native-app</span> <span class="hljs-s
 <li>More performance optimizations.</li>
 <li>Support functional item components with state.</li>
 </ul>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/02/14/using-native-driver-for-animated">Using Native Driver for Animated</a></h1><p class="post-meta">February 14, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener">Janic Duplessis</a>Software Engineer at App &amp; Flow</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/8d6b6c0f5b228b0a8566a69de448b9dd?s=128"/></a></div></div></header><article class="post-content"><div><span><p>For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers to create performant animations without having to worry about some of their code causing it to lag.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/02/14/using-native-driver-for-animated">Using Native Driver for Animated</a></h1><p class="post-meta">February 14, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener">Janic Duplessis</a>Software Engineer at App &amp; Flow</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/janicduplessis" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/8d6b6c0f5b228b0a8566a69de448b9dd?s=128" alt="Janic Duplessis"/></a></div></div></header><article class="post-content"><div><span><p>For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers to create performant animations without having to worry about some of their code causing it to lag.</p>
 <h2><a class="anchor" aria-hidden="true" id="what-is-this"></a><a href="#what-is-this" 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>What is this?</h2>
 <p>The Animated API was designed with a very important constraint in mind, it is serializable. This means we can send everything about the animation to native before it has even started and allows native code to perform the animation on the UI thread without having to go through the bridge on every frame. It is very useful because once the animation has started, the JS thread can be blocked and the animation will still run smoothly. In practice this can happen a lot because user code runs on the JS thread and React renders can also lock JS for a long time.</p>
 <h2><a class="anchor" aria-hidden="true" id="a-bit-of-history"></a><a href="#a-bit-of-history" 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>A bit of history...</h2>

blog/page3/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="posts"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/01/07/monthly-release-cadence">A Monthly Release Cadence: Releasing December and January RC</a></h1><p class="post-meta">January 7, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener">Eric Vicenti</a>Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/077ad5372b65567fe952a99f3b627048?s=128"/></a></div></div></header><article class="post-content"><div><span><p>Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release of our production iOS apps, so we decided to release the open source versions at the same pace. Now, many of the Facebook apps ship once per week, especially on Android. Because we ship from master weekly, we need to keep it quite stable. So the bi-weekly release cadence doesn't even benefit internal contributors anymore.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="posts"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2017/01/07/monthly-release-cadence">A Monthly Release Cadence: Releasing December and January RC</a></h1><p class="post-meta">January 7, 2017</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener">Eric Vicenti</a>Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/EricVicenti" target="_blank" rel="noreferrer noopener"><img src="https://secure.gravatar.com/avatar/077ad5372b65567fe952a99f3b627048?s=128" alt="Eric Vicenti"/></a></div></div></header><article class="post-content"><div><span><p>Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release of our production iOS apps, so we decided to release the open source versions at the same pace. Now, many of the Facebook apps ship once per week, especially on Android. Because we ship from master weekly, we need to keep it quite stable. So the bi-weekly release cadence doesn't even benefit internal contributors anymore.</p>
 <p>We frequently hear feedback from the community that the release rate is hard to keep up with. Tools like <a href="https://expo.io/">Expo</a> had to skip every other release in order to manage the rapid change in version. So it seems clear that the bi-weekly releases did not serve the community well.</p>
 <h3><a class="anchor" aria-hidden="true" id="now-releasing-monthly"></a><a href="#now-releasing-monthly" 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>Now releasing monthly</h3>
 <p>We're happy to announce the new monthly release cadence, and the December 2016 release, <code>v0.40</code>, which has been stabilizing for all last month and is ready to adopt. (Just make sure to <a href="https://github.com/facebook/react-native/releases/tag/v0.40.0">update headers in your native modules on iOS</a>).</p>
@@ -43,7 +47,7 @@ react-<span class="hljs-keyword">native</span>-git-<span class="hljs-keyword">up
 </code></pre>
 <p>We hope this simpler approach will make it easier for the community to keep track of changes in React Native, and to adopt new versions as quickly as possible!</p>
 <p>(Thanks go to <a href="https://github.com/mkonicek">Martin Konicek</a> for coming up with this plan and <a href="https://github.com/grabbou">Mike Grabowski</a> for making it happen)</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/12/05/easier-upgrades">Easier Upgrades Thanks to Git</a></h1><p class="post-meta">December 5, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener">Nicolas Cuillery</a>JavaScript consultant and trainer at Zenika</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener"><img src="https://fr.gravatar.com/userimage/78328995/184460def705a160fd8edadc04f60eaf.jpg?size=128"/></a></div></div></header><article class="post-content"><div><span><p>Upgrading to new versions of React Native has been difficult. You might have seen something like this before:</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/12/05/easier-upgrades">Easier Upgrades Thanks to Git</a></h1><p class="post-meta">December 5, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener">Nicolas Cuillery</a>JavaScript consultant and trainer at Zenika</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/ncuillery" target="_blank" rel="noreferrer noopener"><img src="https://fr.gravatar.com/userimage/78328995/184460def705a160fd8edadc04f60eaf.jpg?size=128" alt="Nicolas Cuillery"/></a></div></div></header><article class="post-content"><div><span><p>Upgrading to new versions of React Native has been difficult. You might have seen something like this before:</p>
 <p><img src="/react-native/blog/assets/git-upgrade-conflict.png" alt=""></p>
 <p>None of those options is ideal. By overwriting the file we lose our local changes. By not overwriting we don't get the latest updates.</p>
 <p>Today I am proud to introduce a new tool that helps solve this problem. The tool is called <code>react-native-git-upgrade</code> and uses Git behind the scenes to resolve conflicts automatically whenever possible.</p>
@@ -52,13 +56,13 @@ react-<span class="hljs-keyword">native</span>-git-<span class="hljs-keyword">up
 <p><strong>Requirement</strong>: Git has to be available in the <code>PATH</code>. Your project doesn't have to be managed by Git.</p>
 </blockquote>
 <p>Install <code>react-native-git-upgrade</code> globally:</p>
-<pre><code class="hljs css languages- shell"><span class="hljs-meta">$</span><span class="bash"> npm install -g react-native-git-upgrade</span>
+<pre><code class="hljs css language-shell"><span class="hljs-meta">$</span><span class="bash"> npm install -g react-native-git-upgrade</span>
 </code></pre>
 <p>or, using <a href="https://yarnpkg.com/">Yarn</a>:</p>
-<pre><code class="hljs css languages- shell"><span class="hljs-meta">$</span><span class="bash"> yarn global add react-native-git-upgrade</span>
+<pre><code class="hljs css language-shell"><span class="hljs-meta">$</span><span class="bash"> yarn global add react-native-git-upgrade</span>
 </code></pre>
 <p>Then, run it inside your project directory:</p>
-<pre><code class="hljs css languages- shell"><span class="hljs-meta">$</span><span class="bash"> <span class="hljs-built_in">cd</span> MyProject</span>
+<pre><code class="hljs css language-shell"><span class="hljs-meta">$</span><span class="bash"> <span class="hljs-built_in">cd</span> MyProject</span>
 <span class="hljs-meta">$</span><span class="bash"> react-native-git-upgrade 0.38.0</span>
 </code></pre>
 <blockquote>
@@ -121,7 +125,7 @@ index e98ebb0.<span class="hljs-number">.2</span>fb6a11 <span class="hljs-number
 <p>As a conclusion, I would say, enjoy the feature and feel free <a href="https://github.com/facebook/react-native/issues">to suggest improvements, report issues</a> and especially <a href="https://github.com/facebook/react-native/pulls">send pull requests</a>. Each environment is a bit different and each React Native project is different, and we need your feedback to make this work well for everyone.</p>
 <h3><a class="anchor" aria-hidden="true" id="thank-you"></a><a href="#thank-you" 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>Thank you!</h3>
 <p>I would like to thank the awesome companies <a href="http://www.zenika.com">Zenika</a> and <a href="http://www.groupem6.fr/le-groupe_en/activites/diversifications/m6-web.html">M6 Web</a> without whom none of this would have been possible!</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap">Introducing Button, Faster Installs with Yarn, and a Public Roadmap</a></h1><p class="post-meta">November 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><article class="post-content"><div><span><p>We have heard from many people that there is so much work happening with React Native, it can be tough to keep track of what's going on. To help communicate what work is in progress, we are now publishing a <a href="https://github.com/facebook/react-native/wiki/Roadmap">roadmap for React Native</a>. At a high level, this work can be broken down into three priorities:</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/11/08/introducing-button-yarn-and-a-public-roadmap">Introducing Button, Faster Installs with Yarn, and a Public Roadmap</a></h1><p class="post-meta">November 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><article class="post-content"><div><span><p>We have heard from many people that there is so much work happening with React Native, it can be tough to keep track of what's going on. To help communicate what work is in progress, we are now publishing a <a href="https://github.com/facebook/react-native/wiki/Roadmap">roadmap for React Native</a>. At a high level, this work can be broken down into three priorities:</p>
 <ul>
 <li><strong>Core Libraries</strong>. Adding more functionality to the most useful components and APIs.</li>
 <li><strong>Stability</strong>. Improve the underlying infrastructure to reduce bugs and improve code quality.</li>
@@ -150,21 +154,21 @@ index e98ebb0.<span class="hljs-number">.2</span>fb6a11 <span class="hljs-number
 <p>In simple local testing <code>react-native init</code> finished in <strong>about 1 minute on a good network</strong> (vs around 3 minutes when using npm 3.10.8). Installing yarn is optional but highly recommended.</p>
 <h2><a class="anchor" aria-hidden="true" id="thank-you"></a><a href="#thank-you" 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>Thank you!</h2>
 <p>We'd like to thank everyone who contributed to this release. The full <a href="https://github.com/facebook/react-native/releases/tag/v0.37.0">release notes</a> are now available on GitHub. With over two dozen bug fixes and new features, React Native just keeps getting better thanks to you.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/10/25/0.36-headless-js-the-keyboard-api-and-more">0.36: Headless JS, the Keyboard API, &amp; more</a></h1><p class="post-meta">October 25, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><article class="post-content"><div><span><p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">React Native 0.36</a>. Read on to learn more about what's new.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/10/25/0.36-headless-js-the-keyboard-api-and-more">0.36: Headless JS, the Keyboard API, &amp; more</a></h1><p class="post-meta">October 25, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><article class="post-content"><div><span><p>Today we are releasing <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">React Native 0.36</a>. Read on to learn more about what's new.</p>
 <h2><a class="anchor" aria-hidden="true" id="headless-js"></a><a href="#headless-js" 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>Headless JS</h2>
 <p>Headless JS is a way to run tasks in JavaScript while your app is in the background. It can be used, for example, to sync fresh data, handle push notifications, or play music. It is only available on Android, for now.</p>
 <p>To get started, define your async task in a dedicated file (e.g. <code>SomeTaskName.js</code>):</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-built_in">module</span>.exports = <span class="hljs-keyword">async</span> (taskData) =&gt; {
+<pre><code class="hljs css language-javascript"><span class="hljs-built_in">module</span>.exports = <span class="hljs-keyword">async</span> (taskData) =&gt; {
   <span class="hljs-comment">// Perform your task here.</span>
 };
 </code></pre>
 <p>Next, register your task in on <code>AppRegistry</code>:</p>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerHeadlessTask(<span class="hljs-string">'SomeTaskName'</span>, () =&gt; <span class="hljs-built_in">require</span>(<span class="hljs-string">'SomeTaskName'</span>));
+<pre><code class="hljs css language-javascript">AppRegistry.registerHeadlessTask(<span class="hljs-string">'SomeTaskName'</span>, () =&gt; <span class="hljs-built_in">require</span>(<span class="hljs-string">'SomeTaskName'</span>));
 </code></pre>
 <p>Using Headless JS does require some native Java code to be written in order to allow you to start up the service when needed. Take a look at our new <a href="/react-native/headless-js-android.md">Headless JS docs</a> to learn more!</p>
 <h2><a class="anchor" aria-hidden="true" id="the-keyboard-api"></a><a href="#the-keyboard-api" 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 Keyboard API</h2>
 <p>Working with the on-screen keyboard is now easier with <a href="/react-native/keyboard.md"><code>Keyboard</code></a>. You can now listen for native keyboard events and react to them. For example, to dismiss the active keyboard, simply call <code>Keyboard.dismiss()</code>:</p>
-<pre><code class="hljs css languages- js"><span class="hljs-keyword">import</span> {Keyboard} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
+<pre><code class="hljs css language-js"><span class="hljs-keyword">import</span> {Keyboard} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
 
 <span class="hljs-comment">// Hide that keyboard!</span>
 Keyboard.dismiss();
@@ -195,11 +199,11 @@ Animated.spring(a, {
 <h2><a class="anchor" aria-hidden="true" id="and-more"></a><a href="#and-more" 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>...and more</h2>
 <p>The above is just a sample of what has changed in 0.36. Check out the <a href="https://github.com/facebook/react-native/releases/tag/v0.36.0">release notes on GitHub</a> to see the full list of new features, bug fixes, and breaking changes.</p>
 <p>You can upgrade to 0.36 by running the following commands in a terminal:</p>
-<pre><code class="hljs css languages- bash">$ npm install --save react-native@0.36
+<pre><code class="hljs css language-bash">$ npm install --save react-native@0.36
 $ react-native upgrade
 </code></pre>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation">Expo Talks: Adam on Unraveling Navigation</a></h1><p class="post-meta">September 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><article class="post-content"><div><span><p><a href="https://twitter.com/skevy">Adam Miskiewicz</a> from <a href="https://expo.io/">Expo</a> talks about mobile navigation and the <a href="https://github.com/exponent/ex-navigation"><code>ex-navigation</code></a> React Native library at Expo's office hours last week.</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps">Right-to-Left Layout Support For React Native Apps</a></h1><p class="post-meta">August 19, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener">Mengjue (Mandy) Wang</a>Software Engineer Intern at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13987140?v=3&amp;s=128"/></a></div></div></header><article class="post-content"><div><span><p>After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is necessary.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/09/08/exponent-talks-unraveling-navigation">Expo Talks: Adam on Unraveling Navigation</a></h1><p class="post-meta">September 8, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><article class="post-content"><div><span><p><a href="https://twitter.com/skevy">Adam Miskiewicz</a> from <a href="https://expo.io/">Expo</a> talks about mobile navigation and the <a href="https://github.com/exponent/ex-navigation"><code>ex-navigation</code></a> React Native library at Expo's office hours last week.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps">Right-to-Left Layout Support For React Native Apps</a></h1><p class="post-meta">August 19, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener">Mengjue (Mandy) Wang</a>Software Engineer Intern at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/MengjueW" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13987140?v=3&amp;s=128" alt="Mengjue (Mandy) Wang"/></a></div></div></header><article class="post-content"><div><span><p>After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is necessary.</p>
 <p>We're glad to announce that React Native has been improved to support RTL layouts. This is now available in the <a href="https://github.com/facebook/react-native">react-native</a> master branch today, and will be available in the next RC: <a href="https://github.com/facebook/react-native/releases"><code>v0.33.0-rc</code></a>.</p>
 <p>This involved changing <a href="https://github.com/facebook/css-layout">css-layout</a>, the core layout engine used by RN, and RN core implementation, as well as specific OSS JS components to support RTL.</p>
 <p>To battle test the RTL support in production, the latest version of the <strong>Facebook Ads Manager</strong> app (the first cross-platform 100% RN app) is now available in Arabic and Hebrew with RTL layouts for both <a href="https://itunes.apple.com/app/id964397083">iOS</a> and <a href="https://play.google.com/store/apps/details?id=com.facebook.adsmanager">Android</a>. Here is how it looks like in those RTL languages:</p>
@@ -230,11 +234,11 @@ $ react-native upgrade
 </ul></li>
 <li><p>Allow RTL layout for your app by calling the <code>allowRTL()</code> function at the beginning of native code. We provided this utility to only apply to an RTL layout when your app is ready. Here is an example:</p>
 <p>iOS:</p>
-<pre><code class="hljs css languages- objc"><span class="hljs-comment">// in AppDelegate.m</span>
+<pre><code class="hljs css language-objc"><span class="hljs-comment">// in AppDelegate.m</span>
      [[RCTI18nUtil sharedInstance] allowRTL:<span class="hljs-literal">YES</span>];
 </code></pre>
 <p>Android:</p>
-<pre><code class="hljs css languages- java"><span class="hljs-comment">// in MainActivity.java</span>
+<pre><code class="hljs css language-java"><span class="hljs-comment">// in MainActivity.java</span>
      I18nUtil sharedI18nUtilInstance = I18nUtil.getInstance();
      sharedI18nUtilInstance.allowRTL(context, <span class="hljs-keyword">true</span>);
 </code></pre></li>
@@ -265,13 +269,13 @@ $ react-native upgrade
 <p>Here are two ways to flip the icon according to the direction:</p>
 <ul>
 <li><p>Adding a <code>transform</code> style to the image component:</p>
-<pre><code class="hljs css languages- javascript">&lt;Image
+<pre><code class="hljs css language-javascript">&lt;Image
   source={...}
   style={{<span class="hljs-attr">transform</span>: [{<span class="hljs-attr">scaleX</span>: I18nManager.isRTL ? <span class="hljs-number">-1</span> : <span class="hljs-number">1</span>}]}}
 /&gt;
 </code></pre></li>
 <li><p>Or, changing the image source according to the direction:</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">let</span> imageSource = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./back.png'</span>);
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">let</span> imageSource = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./back.png'</span>);
 <span class="hljs-keyword">if</span> (I18nManager.isRTL) {
   imageSource = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./forward.png'</span>);
 }
@@ -286,7 +290,7 @@ $ react-native upgrade
   <img src="/react-native/blog/assets/rtl-demo-swipe-rtl.png" width="280" style="margin:10px">
 </p>
 <h5><a class="anchor" aria-hidden="true" id="gestures-example"></a><a href="#gestures-example" 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>Gestures Example</h5>
-<pre><code class="hljs css languages- js"><span class="hljs-comment">// SwipeableRow.js</span>
+<pre><code class="hljs css language-js"><span class="hljs-comment">// SwipeableRow.js</span>
 _isSwipingExcessivelyRightFromClosedPosition(gestureState: <span class="hljs-built_in">Object</span>): boolean {
   <span class="hljs-comment">// ...</span>
   <span class="hljs-keyword">const</span> gestureStateDx = IS_RTL ? -gestureState.dx : gestureState.dx;
@@ -297,7 +301,7 @@ _isSwipingExcessivelyRightFromClosedPosition(gestureState: <span class="hljs-bui
 },
 </code></pre>
 <h5><a class="anchor" aria-hidden="true" id="animation-example"></a><a href="#animation-example" 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>Animation Example</h5>
-<pre><code class="hljs css languages- js"><span class="hljs-comment">// SwipeableRow.js</span>
+<pre><code class="hljs css language-js"><span class="hljs-comment">// SwipeableRow.js</span>
 _animateBounceBack(duration: number): <span class="hljs-keyword">void</span> {
   <span class="hljs-comment">// ...</span>
   <span class="hljs-keyword">const</span> swipeBounceBackDistance = IS_RTL ?
@@ -315,7 +319,7 @@ _animateBounceBack(duration: number): <span class="hljs-keyword">void</span> {
 <p align="center">
   <img src="/react-native/blog/assets/rtl-demo-forcertl.png" width="300">
 </p>
-<pre><code class="hljs css languages- js">&lt;RNTesterBlock title={<span class="hljs-string">'Quickly Test RTL Layout'</span>}&gt;
+<pre><code class="hljs css language-js">&lt;RNTesterBlock title={<span class="hljs-string">'Quickly Test RTL Layout'</span>}&gt;
   <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.flexDirectionRow}</span>&gt;</span>
     <span class="hljs-tag">&lt;<span class="hljs-name">Text</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.switchRowTextView}</span>&gt;</span>forceRTL<span class="hljs-tag">&lt;/<span class="hljs-name">Text</span>&gt;</span>
     <span class="hljs-tag">&lt;<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.switchRowSwitchView}</span>&gt;</span>
@@ -358,7 +362,7 @@ _onDirectionChange = <span class="hljs-function"><span class="hljs-params">()</s
 <h2><a class="anchor" aria-hidden="true" id="try-it-out"></a><a href="#try-it-out" 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>Try it Out!</h2>
 <p>Check out the <a href="https://github.com/facebook/react-native/blob/master/RNTester/js/RTLExample.js"><code>RTLExample</code></a> in the <code>RNTester</code> to understand more about RTL support, and let us know how it works for you!</p>
 <p>Finally, thank you for reading! We hope that the RTL support for React Native helps you grow your apps for international audience!</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/12/react-native-meetup-san-francisco">San Francisco Meetup Recap</a></h1><p class="post-meta">August 12, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128"/></a></div></div></header><article class="post-content"><div><span><p>Last week I had the opportunity to attend the <a href="http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854">React Native Meetup</a> at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/08/12/react-native-meetup-san-francisco">San Francisco Meetup Recap</a></h1><p class="post-meta">August 12, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener">Héctor Ramos</a>Developer Advocate at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/hectorramos" target="_blank" rel="noreferrer noopener"><img src="https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128" alt="Héctor Ramos"/></a></div></div></header><article class="post-content"><div><span><p>Last week I had the opportunity to attend the <a href="http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854">React Native Meetup</a> at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native.</p>
 <p><img src="/react-native/blog/assets/rnmsf-august-2016-hero.jpg" alt=""></p>
 <p>I was particularly interested in learning more about how React and React Native are used at companies like Zynga, Netflix, and Airbnb. The agenda for the night would be as follows:</p>
 <ul>
@@ -428,7 +432,7 @@ _onDirectionChange = <span class="hljs-function"><span class="hljs-params">()</s
 </ul>
 <p><img src="/react-native/blog/assets/rnmsf-august-2016-docs.jpg" alt=""></p>
 <p>Meetups provide a good opportunity to meet and learn from other developers in the community. I'm looking forward to attending more React Native meetups in the future. If you make it up to one of these, please look out for me and let me know how we can make React Native work better for you!</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/07/06/toward-better-documentation">Toward Better Documentation</a></h1><p class="post-meta">July 6, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener">Kevin Lacker</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener"><img src="http://www.gravatar.com/avatar/9b790592be15d4f55a5ed7abb5103304?s=128"/></a></div></div></header><article class="post-content"><div><span><p>Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better based on your feedback, and we wanted to share some of the improvements we've made.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/07/06/toward-better-documentation">Toward Better Documentation</a></h1><p class="post-meta">July 6, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener">Kevin Lacker</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/lacker" target="_blank" rel="noreferrer noopener"><img src="http://www.gravatar.com/avatar/9b790592be15d4f55a5ed7abb5103304?s=128" alt="Kevin Lacker"/></a></div></div></header><article class="post-content"><div><span><p>Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better based on your feedback, and we wanted to share some of the improvements we've made.</p>
 <h2><a class="anchor" aria-hidden="true" id="inline-examples"></a><a href="#inline-examples" 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>Inline Examples</h2>
 <p>When you learn a new library, a new programming language, or a new framework, there's a beautiful moment when you first write a bit of code, try it out, see if it works... and it <em>does</em> work. You created something real. We wanted to put that visceral experience right into our docs. Like this:</p>
 <div class="web-player"><pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { Component } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
@@ -468,7 +472,7 @@ AppRegistry.registerComponent(<span class="hljs-string">'ScratchPad'</span>, ()
 <p>If you find a mistake in the documentation, like inaccurate descriptions or code that doesn't actually work, <a href="https://github.com/facebook/react-native/issues">file an issue</a>. Tag it with &quot;Documentation&quot;, so that it's easier to route it to the right people.</p>
 <p>If there isn't a specific mistake, but something in the documentation is fundamentally confusing, it's not a great fit for a GitHub issue. Instead, post on <a href="https://react-native.canny.io/feature-requests">Canny</a> about the area of the docs that could use help. This helps us prioritize when we are doing more general work like guide-writing.</p>
 <p>Thanks for reading this far, and thanks for using React Native!</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/04/13/react-native-a-year-in-review">React Native: A year in review</a></h1><p class="post-meta">April 13, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener">Martin Konicek</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/346214?v=3&amp;s=460"/></a></div></div></header><article class="post-content"><div><span><p>It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing <a href="http://microsoft.github.io/code-push/articles/ReactNativeWindows.html">React Native to the Windows ecosystem</a>, giving developers the potential to build React Native on Windows PC, Phone, and Xbox. It will also provide open source tools and services such as a React Native extension for Visual Studio Code and CodePush to help developers create React Native apps on the Windows platform. In addition, <a href="https://www.tizen.org/blogs">Samsung</a> is building React Native for its hybrid platform, which will empower developers to build apps for millions of SmartTVs and mobile and wearable devices. We also released the <a href="https://github.com/facebook/react-native-fbsdk">Facebook SDK for React Native</a>, which makes it easier for developers to incorporate Facebook social features like Login, Sharing, App Analytics, and Graph APIs into their apps. In one year, React Native has changed the way developers build on every major platform.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/04/13/react-native-a-year-in-review">React Native: A year in review</a></h1><p class="post-meta">April 13, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener">Martin Konicek</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/mkonicek" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/346214?v=3&amp;s=460" alt="Martin Konicek"/></a></div></div></header><article class="post-content"><div><span><p>It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing <a href="http://microsoft.github.io/code-push/articles/ReactNativeWindows.html">React Native to the Windows ecosystem</a>, giving developers the potential to build React Native on Windows PC, Phone, and Xbox. It will also provide open source tools and services such as a React Native extension for Visual Studio Code and CodePush to help developers create React Native apps on the Windows platform. In addition, <a href="https://www.tizen.org/blogs">Samsung</a> is building React Native for its hybrid platform, which will empower developers to build apps for millions of SmartTVs and mobile and wearable devices. We also released the <a href="https://github.com/facebook/react-native-fbsdk">Facebook SDK for React Native</a>, which makes it easier for developers to incorporate Facebook social features like Login, Sharing, App Analytics, and Graph APIs into their apps. In one year, React Native has changed the way developers build on every major platform.</p>
 <p>It's been an epic ride — but we are only getting started. Here is a look back at how React Native has grown and evolved since we open-sourced it a year ago, some challenges we faced along the way, and what we expect as we look ahead to the future.</p>
 <footer>
   <a href="https://code.facebook.com/posts/597378980427792/react-native-a-year-in-review/" class="btn">Read more</a>
@@ -476,7 +480,7 @@ AppRegistry.registerComponent(<span class="hljs-string">'ScratchPad'</span>, ()
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/597378980427792/react-native-a-year-in-review/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/28/dive-into-react-native-performance">Dive into React Native Performance</a></h1><p class="post-meta">March 28, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener">Pieter De Baets</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/5676?v=3&amp;s=460"/></a></div></div></header><article class="post-content"><div><span><p>React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across multiple platforms. You can ship faster and focus on details that really matter, making your app look and feel fantastic. Optimizing performance is a big part of this. Here is the story of how we made React Native app startup twice as fast.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/28/dive-into-react-native-performance">Dive into React Native Performance</a></h1><p class="post-meta">March 28, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener">Pieter De Baets</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/javache" target="_blank" rel="noreferrer noopener"><img src="https://avatars1.githubusercontent.com/u/5676?v=3&amp;s=460" alt="Pieter De Baets"/></a></div></div></header><article class="post-content"><div><span><p>React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across multiple platforms. You can ship faster and focus on details that really matter, making your app look and feel fantastic. Optimizing performance is a big part of this. Here is the story of how we made React Native app startup twice as fast.</p>
 <h2><a class="anchor" aria-hidden="true" id="why-the-hurry"></a><a href="#why-the-hurry" 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>Why the hurry?</h2>
 <p>With an app that runs faster, content loads quickly, which means people get more time to interact with it, and smooth animations make the app enjoyable to use. In emerging markets, where <a href="https://code.facebook.com/posts/952628711437136/classes-performance-and-network-segmentation-on-android/">2011 class phones</a> on <a href="https://newsroom.fb.com/news/2015/10/news-feed-fyi-building-for-all-connectivity/">2G networks</a> are the majority, a focus on performance can make the difference between an app that is usable and one that isn't.</p>
 <p>Since releasing React Native on <a href="https://facebook.github.io/react/blog/2015/03/26/introducing-react-native.html">iOS</a> and on <a href="https://code.facebook.com/posts/1189117404435352/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/">Android</a>, we have been improving list view scrolling performance, memory efficiency, UI responsiveness, and app startup time. Startup sets the first impression of an app and stresses all parts of the framework, so it is the most rewarding and challenging problem to tackle.</p>

blog/page4/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -29,7 +33,7 @@
                 };
               }
             });
-        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="posts"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/24/introducing-hot-reloading">Introducing Hot Reloading</a></h1><p class="post-meta">March 24, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener">Martín Bigio</a>Software Engineer at Instagram</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/535661?v=3&amp;s=128"/></a></div></div></header><article class="post-content"><div><span><p>React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grows.</p>
+        </script></nav></div><div class="container mainContainer postContainer blogContainer"><div class="wrapper"><div class="posts"><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2016/03/24/introducing-hot-reloading">Introducing Hot Reloading</a></h1><p class="post-meta">March 24, 2016</p><div class="authorBlock"><p class="post-authorName"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener">Martín Bigio</a>Software Engineer at Instagram</p><div class="authorPhoto authorPhotoBig"><a href="https://twitter.com/martinbigio" target="_blank" rel="noreferrer noopener"><img src="https://avatars3.githubusercontent.com/u/535661?v=3&amp;s=128" alt="Martín Bigio"/></a></div></div></header><article class="post-content"><div><span><p>React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grows.</p>
 <p>We got close to this ideal via three main features:</p>
 <ul>
 <li>Use JavaScript as the language doesn't have a long compilation cycle time.</li>
@@ -168,7 +172,7 @@
 <h2><a class="anchor" aria-hidden="true" id="conclusion"></a><a href="#conclusion" 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>Conclusion</h2>
 <p>If you are interested in helping making hot reloading better, I encourage you to read <a href="https://medium.com/@dan_abramov/hot-reloading-in-react-1140438583bf#.jmivpvmz4">Dan Abramov's post around the future of hot reloading</a> and to contribute. For example, Johny Days is going to <a href="https://github.com/facebook/react-native/pull/6179">make it work with multiple connected clients</a>. We're relying on you all to maintain and improve this feature.</p>
 <p>With React Native, we have the opportunity to rethink the way we build apps in order to make it a great developer experience. Hot reloading is only one piece of the puzzle, what other crazy hacks can we do to make it better?</p>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/11/23/making-react-native-apps-accessible">Making React Native apps accessible</a></h1><p class="post-meta">November 23, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener">Georgiy Kassabli</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener"><img src="https://scontent-sea1-1.xx.fbcdn.net/v/t1.0-1/c0.0.160.160/p160x160/1978838_795592927136196_1205041943_n.jpg?_nc_log=1&amp;oh=d7a500fdece1250955a4d27b0a80fee2&amp;oe=59E8165A"/></a></div></div></header><article class="post-content"><div><span><p>With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vision loss or other disabilities. The Accessibility API for React and React Native enables you to make any React-powered experience usable by someone who may use assistive technology, like a screen reader for the blind and visually impaired.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/11/23/making-react-native-apps-accessible">Making React Native apps accessible</a></h1><p class="post-meta">November 23, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener">Georgiy Kassabli</a>Software Engineer at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://www.facebook.com/georgiy.kassabli" target="_blank" rel="noreferrer noopener"><img src="https://scontent-sea1-1.xx.fbcdn.net/v/t1.0-1/c0.0.160.160/p160x160/1978838_795592927136196_1205041943_n.jpg?_nc_log=1&amp;oh=d7a500fdece1250955a4d27b0a80fee2&amp;oe=59E8165A" alt="Georgiy Kassabli"/></a></div></div></header><article class="post-content"><div><span><p>With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vision loss or other disabilities. The Accessibility API for React and React Native enables you to make any React-powered experience usable by someone who may use assistive technology, like a screen reader for the blind and visually impaired.</p>
 <p>For this post, we're going to focus on React Native apps. We've designed the React Accessibility API to look and feel similar to the iOS and Android APIs. If you've developed accessible applications for the web, iOS, or Android before, you should feel comfortable with the framework and nomenclature of the React AX API. For instance, you can make a UI element <em>accessible</em> (therefore exposed to assistive technology) and use <em>accessibilityLabel</em> to provide a string description for the element:</p>
 <pre><code class="hljs">&lt;View accessible={<span class="hljs-literal">true</span>} <span class="hljs-attribute">accessibilityLabel</span>=”This is<span class="hljs-built_in"> simple </span>view”&gt;
 </code></pre>
@@ -187,7 +191,7 @@
 <blockquote>
 <p>This is an excerpt. Read the rest of the post on <a href="https://code.facebook.com/posts/1189117404435352/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/">Facebook Code</a>.</p>
 </blockquote>
-</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile">React Native: Bringing modern web techniques to mobile</a></h1><p class="post-meta">March 26, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener">Tom Occhino</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13947?v=3&amp;s=460"/></a></div></div></header><article class="post-content"><div><span><p>We introduced <a href="https://code.facebook.com/projects/176988925806765/react/">React</a> to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web projects at Facebook are commonly built using React in one form or another, and it's being broadly adopted across the industry. Engineers are choosing to use React every day because it enables them to spend more time focusing on their products and less time fighting with their framework. It wasn't until we'd been building with React for a while, though, that we started to understand what makes it so powerful.</p>
+</span></div></article></div><div class="post"><header class="postHeader"><h1 class="postHeaderTitle"><a href="/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile">React Native: Bringing modern web techniques to mobile</a></h1><p class="post-meta">March 26, 2015</p><div class="authorBlock"><p class="post-authorName"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener">Tom Occhino</a>Engineering Manager at Facebook</p><div class="authorPhoto authorPhotoBig"><a href="https://github.com/tomocchino" target="_blank" rel="noreferrer noopener"><img src="https://avatars0.githubusercontent.com/u/13947?v=3&amp;s=460" alt="Tom Occhino"/></a></div></div></header><article class="post-content"><div><span><p>We introduced <a href="https://code.facebook.com/projects/176988925806765/react/">React</a> to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web projects at Facebook are commonly built using React in one form or another, and it's being broadly adopted across the industry. Engineers are choosing to use React every day because it enables them to spend more time focusing on their products and less time fighting with their framework. It wasn't until we'd been building with React for a while, though, that we started to understand what makes it so powerful.</p>
 <p>React forces us to break our applications down into discrete components, each representing a single view. These components make it easier to iterate on our products, since we don't need to keep the entire system in our head in order to make changes to one part of it. More important, though, React wraps the DOM's mutative, imperative API with a declarative one, which raises the level of abstraction and simplifies the programming model. What we've found is that when we build with React, our code is a lot more predictable. This predictability makes it so we can iterate more quickly with confidence, and our applications are a lot more reliable as a result. Additionally, it's not only easier to scale our applications when they're built with React, but we've found it's also easier to scale the size of our teams themselves.</p>
 <p>Together with the rapid iteration cycle of the web, we've been able to build some awesome products with React, including many components of Facebook.com. Additionally, we've built amazing frameworks in JavaScript on top of React, like <a href="https://facebook.github.io/react/blog/2015/02/20/introducing-relay-and-graphql.html">Relay</a>, which allows us to greatly simplify our data fetching at scale. Of course, web is only part of the story. Facebook also has widely used Android and iOS apps, which are built on top of disjointed, proprietary technology stacks. Having to build our apps on top of multiple platforms has bifurcated our engineering organization, but that's only one of the things that makes native mobile application development hard.</p>
 <footer>

css/prism.css

@@ -1,14 +1,11 @@
 /**
- * prism.js default theme for JavaScript, CSS and HTML
+ * Modified prism.js default theme for JavaScript, CSS and HTML
  * Based on dabblet (http://dabblet.com)
  * @author Lea Verou
  */
 
 code[class*="language-"],
 pre[class*="language-"] {
-  color: black;
-  background: none;
-  text-shadow: 0 1px white;
   font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
   text-align: left;
   white-space: pre;
@@ -27,23 +24,6 @@ pre[class*="language-"] {
   hyphens: none;
 }
 
-pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
-code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
-  text-shadow: none;
-}
-
-pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
-code[class*="language-"]::selection, code[class*="language-"] ::selection {
-  text-shadow: none;
-}
-
-@media print {
-  code[class*="language-"],
-  pre[class*="language-"] {
-    text-shadow: none;
-  }
-}
-
 /* Code blocks */
 pre[class*="language-"] {
   padding: 1em;

docs/0.10/accessibility.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -37,7 +41,7 @@
 <h4><a class="anchor" aria-hidden="true" id="accessible-ios-android"></a><a href="#accessible-ios-android" 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>accessible (iOS, Android)</h4>
 <p>When <code>true</code>, indicates that the view is an accessibility element. When a view is an accessibility element, it groups its children into a single selectable component. By default, all touchable elements are accessible.</p>
 <p>On Android, <code>accessible={true}</code> property for a react-native View will be translated into native <code>focusable={true}</code>.</p>
-<pre><code class="hljs css languages- javascript">&lt;View accessible={true}&gt;
+<pre><code class="hljs css language-javascript">&lt;View accessible={true}&gt;
   &lt;Text&gt;text one&lt;/Text&gt;
   &lt;Text&gt;text two&lt;/Text&gt;
 &lt;/View&gt;
@@ -46,7 +50,7 @@
 <h4><a class="anchor" aria-hidden="true" id="accessibilitylabel-ios-android"></a><a href="#accessibilitylabel-ios-android" 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>accessibilityLabel (iOS, Android)</h4>
 <p>When a view is marked as accessible, it is a good practice to set an accessibilityLabel on the view, so that people who use VoiceOver know what element they have selected. VoiceOver will read this string when a user selects the associated element.</p>
 <p>To use, set the <code>accessibilityLabel</code> property to a custom string on your View:</p>
-<pre><code class="hljs css languages- javascript">&lt;TouchableOpacity
+<pre><code class="hljs css language-javascript">&lt;TouchableOpacity
   accessible={true}
   accessibilityLabel={'Tap me!'}
   onPress={this._onPress}&gt;
@@ -90,7 +94,7 @@
 <p>Assign this property to a custom function which will be called when someone performs the &quot;magic tap&quot; gesture, which is a double-tap with two fingers. A magic tap function should perform the most relevant action a user could take on a component. In the Phone app on iPhone, a magic tap answers a phone call, or ends the current one. If the selected element does not have an <code>onMagicTap</code> function, the system will traverse up the view hierarchy until it finds a view that does.</p>
 <h4><a class="anchor" aria-hidden="true" id="accessibilitycomponenttype-android"></a><a href="#accessibilitycomponenttype-android" 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>accessibilityComponentType (Android)</h4>
 <p>In some cases, we also want to alert the end user of the type of selected component (i.e., that it is a “button”). If we were using native buttons, this would work automatically. Since we are using javascript, we need to provide a bit more context for TalkBack. To do so, you must specify the ‘accessibilityComponentType’ property for any UI component. We support 'none', ‘button’, ‘radiobutton_checked’ and ‘radiobutton_unchecked’.</p>
-<pre><code class="hljs css languages- javascript">&lt;TouchableWithoutFeedback accessibilityComponentType=”button”
+<pre><code class="hljs css language-javascript">&lt;TouchableWithoutFeedback accessibilityComponentType=”button”
   onPress={this._onPress}&gt;
   &lt;View style={styles.button}&gt;
     &lt;Text style={styles.buttonText}&gt;Press me!&lt;/Text&gt;
@@ -105,7 +109,7 @@
 <li><strong>polite</strong> Accessibility services should announce changes to this view.</li>
 <li><strong>assertive</strong> Accessibility services should interrupt ongoing speech to immediately announce changes to this view.</li>
 </ul>
-<pre><code class="hljs css languages- javascript">&lt;TouchableWithoutFeedback onPress={this._addOne}&gt;
+<pre><code class="hljs css language-javascript">&lt;TouchableWithoutFeedback onPress={this._addOne}&gt;
   &lt;View style={styles.embedded}&gt;
     &lt;Text&gt;Click me&lt;/Text&gt;
   &lt;/View&gt;
@@ -117,7 +121,7 @@
 <p>In the above example method _addOne changes the state.count variable. As soon as an end user clicks the TouchableWithoutFeedback, TalkBack reads text in the Text view because of its 'accessibilityLiveRegion=”polite”' property.</p>
 <h4><a class="anchor" aria-hidden="true" id="importantforaccessibility-android"></a><a href="#importantforaccessibility-android" 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>importantForAccessibility (Android)</h4>
 <p>In the case of two overlapping UI components with the same parent, default accessibility focus can have unpredictable behavior. The ‘importantForAccessibility’ property will resolve this by controlling if a view fires accessibility events and if it is reported to accessibility services. It can be set to ‘auto’, ‘yes’, ‘no’ and ‘no-hide-descendants’ (the last value will force accessibility services to ignore the component and all of its children).</p>
-<pre><code class="hljs css languages- javascript">&lt;View style={styles.container}&gt;
+<pre><code class="hljs css language-javascript">&lt;View style={styles.container}&gt;
   &lt;View style={{position: 'absolute', left: 10, top: 10, right: 10, height: 100,
     backgroundColor: 'green'}} importantForAccessibility=”yes”&gt;
     &lt;Text&gt; First layout &lt;/Text&gt;
@@ -133,7 +137,7 @@
 <p>The <code>AccessibilityInfo</code> API allows you to determine whether or not a screen reader is currently active. See the <a href="/react-native/docs/0.10/accessibilityinfo">AccessibilityInfo documentation</a> for details.</p>
 <h3><a class="anchor" aria-hidden="true" id="sending-accessibility-events-android"></a><a href="#sending-accessibility-events-android" 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>Sending Accessibility Events (Android)</h3>
 <p>Sometimes it is useful to trigger an accessibility event on a UI component (i.e. when a custom view appears on a screen or a custom radio button has been selected). Native UIManager module exposes a method ‘sendAccessibilityEvent’ for this purpose. It takes two arguments: view tag and a type of an event.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">import</span> { UIManager, findNodeHandle } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">import</span> { UIManager, findNodeHandle } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
 
 _onPress: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>) </span>{
   <span class="hljs-keyword">const</span> radioButton = <span class="hljs-keyword">this</span>.state.radioButton === <span class="hljs-string">'radiobutton_checked'</span> ?

docs/0.10/accessibility/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -37,7 +41,7 @@
 <h4><a class="anchor" aria-hidden="true" id="accessible-ios-android"></a><a href="#accessible-ios-android" 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>accessible (iOS, Android)</h4>
 <p>When <code>true</code>, indicates that the view is an accessibility element. When a view is an accessibility element, it groups its children into a single selectable component. By default, all touchable elements are accessible.</p>
 <p>On Android, <code>accessible={true}</code> property for a react-native View will be translated into native <code>focusable={true}</code>.</p>
-<pre><code class="hljs css languages- javascript">&lt;View accessible={true}&gt;
+<pre><code class="hljs css language-javascript">&lt;View accessible={true}&gt;
   &lt;Text&gt;text one&lt;/Text&gt;
   &lt;Text&gt;text two&lt;/Text&gt;
 &lt;/View&gt;
@@ -46,7 +50,7 @@
 <h4><a class="anchor" aria-hidden="true" id="accessibilitylabel-ios-android"></a><a href="#accessibilitylabel-ios-android" 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>accessibilityLabel (iOS, Android)</h4>
 <p>When a view is marked as accessible, it is a good practice to set an accessibilityLabel on the view, so that people who use VoiceOver know what element they have selected. VoiceOver will read this string when a user selects the associated element.</p>
 <p>To use, set the <code>accessibilityLabel</code> property to a custom string on your View:</p>
-<pre><code class="hljs css languages- javascript">&lt;TouchableOpacity
+<pre><code class="hljs css language-javascript">&lt;TouchableOpacity
   accessible={true}
   accessibilityLabel={'Tap me!'}
   onPress={this._onPress}&gt;
@@ -90,7 +94,7 @@
 <p>Assign this property to a custom function which will be called when someone performs the &quot;magic tap&quot; gesture, which is a double-tap with two fingers. A magic tap function should perform the most relevant action a user could take on a component. In the Phone app on iPhone, a magic tap answers a phone call, or ends the current one. If the selected element does not have an <code>onMagicTap</code> function, the system will traverse up the view hierarchy until it finds a view that does.</p>
 <h4><a class="anchor" aria-hidden="true" id="accessibilitycomponenttype-android"></a><a href="#accessibilitycomponenttype-android" 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>accessibilityComponentType (Android)</h4>
 <p>In some cases, we also want to alert the end user of the type of selected component (i.e., that it is a “button”). If we were using native buttons, this would work automatically. Since we are using javascript, we need to provide a bit more context for TalkBack. To do so, you must specify the ‘accessibilityComponentType’ property for any UI component. We support 'none', ‘button’, ‘radiobutton_checked’ and ‘radiobutton_unchecked’.</p>
-<pre><code class="hljs css languages- javascript">&lt;TouchableWithoutFeedback accessibilityComponentType=”button”
+<pre><code class="hljs css language-javascript">&lt;TouchableWithoutFeedback accessibilityComponentType=”button”
   onPress={this._onPress}&gt;
   &lt;View style={styles.button}&gt;
     &lt;Text style={styles.buttonText}&gt;Press me!&lt;/Text&gt;
@@ -105,7 +109,7 @@
 <li><strong>polite</strong> Accessibility services should announce changes to this view.</li>
 <li><strong>assertive</strong> Accessibility services should interrupt ongoing speech to immediately announce changes to this view.</li>
 </ul>
-<pre><code class="hljs css languages- javascript">&lt;TouchableWithoutFeedback onPress={this._addOne}&gt;
+<pre><code class="hljs css language-javascript">&lt;TouchableWithoutFeedback onPress={this._addOne}&gt;
   &lt;View style={styles.embedded}&gt;
     &lt;Text&gt;Click me&lt;/Text&gt;
   &lt;/View&gt;
@@ -117,7 +121,7 @@
 <p>In the above example method _addOne changes the state.count variable. As soon as an end user clicks the TouchableWithoutFeedback, TalkBack reads text in the Text view because of its 'accessibilityLiveRegion=”polite”' property.</p>
 <h4><a class="anchor" aria-hidden="true" id="importantforaccessibility-android"></a><a href="#importantforaccessibility-android" 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>importantForAccessibility (Android)</h4>
 <p>In the case of two overlapping UI components with the same parent, default accessibility focus can have unpredictable behavior. The ‘importantForAccessibility’ property will resolve this by controlling if a view fires accessibility events and if it is reported to accessibility services. It can be set to ‘auto’, ‘yes’, ‘no’ and ‘no-hide-descendants’ (the last value will force accessibility services to ignore the component and all of its children).</p>
-<pre><code class="hljs css languages- javascript">&lt;View style={styles.container}&gt;
+<pre><code class="hljs css language-javascript">&lt;View style={styles.container}&gt;
   &lt;View style={{position: 'absolute', left: 10, top: 10, right: 10, height: 100,
     backgroundColor: 'green'}} importantForAccessibility=”yes”&gt;
     &lt;Text&gt; First layout &lt;/Text&gt;
@@ -133,7 +137,7 @@
 <p>The <code>AccessibilityInfo</code> API allows you to determine whether or not a screen reader is currently active. See the <a href="/react-native/docs/0.10/accessibilityinfo">AccessibilityInfo documentation</a> for details.</p>
 <h3><a class="anchor" aria-hidden="true" id="sending-accessibility-events-android"></a><a href="#sending-accessibility-events-android" 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>Sending Accessibility Events (Android)</h3>
 <p>Sometimes it is useful to trigger an accessibility event on a UI component (i.e. when a custom view appears on a screen or a custom radio button has been selected). Native UIManager module exposes a method ‘sendAccessibilityEvent’ for this purpose. It takes two arguments: view tag and a type of an event.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">import</span> { UIManager, findNodeHandle } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">import</span> { UIManager, findNodeHandle } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
 
 _onPress: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>) </span>{
   <span class="hljs-keyword">const</span> radioButton = <span class="hljs-keyword">this</span>.state.radioButton === <span class="hljs-string">'radiobutton_checked'</span> ?

docs/0.10/accessibilityinfo.html

@@ -8,7 +8,7 @@
               ga('send', 'pageview');
             </script><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png" alt="React Native"/><h2 class="headerTitleWithLogo">React Native</h2></a><a href="/react-native/versions"><h3>0.10</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/react-native/docs/0.10/getting-started" target="_self">Docs</a></li><li class=""><a href="/react-native/en/help" target="_self">Community</a></li><li class=""><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li><li class=""><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li class=""><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/docs/accessibilityinfo.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">AccessibilityInfo</h1></header><article><div><span><p>Sometimes it's useful to know whether or not the device has a screen reader that is currently active. The <code>AccessibilityInfo</code> API is designed for this purpose. You can use it to query the current state of the screen reader as well as to register to be notified when the state of the screen reader changes.</p>
 <p>Here's a small example illustrating how to use <code>AccessibilityInfo</code>:</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">ScreenReaderStatusExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span> </span>{
+<pre><code class="hljs css language-javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">ScreenReaderStatusExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span> </span>{
   state = {
     <span class="hljs-attr">screenReaderEnabled</span>: <span class="hljs-literal">false</span>,
   };
@@ -62,12 +62,12 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="fetch"></a><a href="#fetch" 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><code>fetch()</code></h3>
-<pre><code class="hljs css languages- javascript">AccessibilityInfo.fetch();
+<pre><code class="hljs css language-javascript">AccessibilityInfo.fetch();
 </code></pre>
 <p>Query whether a screen reader is currently enabled. Returns a promise which resolves to a boolean. The result is <code>true</code> when a screen reader is enabled and <code>false</code> otherwise.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="addeventlistener"></a><a href="#addeventlistener" 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><code>addEventListener()</code></h3>
-<pre><code class="hljs css languages- javascript">AccessibilityInfo.addEventListener(eventName, handler);
+<pre><code class="hljs css language-javascript">AccessibilityInfo.addEventListener(eventName, handler);
 </code></pre>
 <p>Add an event handler.</p>
 <table>
@@ -90,7 +90,7 @@
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="setaccessibilityfocus"></a><a href="#setaccessibilityfocus" 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><code>setAccessibilityFocus()</code></h3>
-<pre><code class="hljs css languages- javascript">AccessibilityInfo.setAccessibilityFocus(reactTag);
+<pre><code class="hljs css language-javascript">AccessibilityInfo.setAccessibilityFocus(reactTag);
 </code></pre>
 <p>Set accessibility focus to a React component.</p>
 <table>
@@ -111,7 +111,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="announceforaccessibility"></a><a href="#announceforaccessibility" 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><code>announceForAccessibility()</code></h3>
-<pre><code class="hljs css languages- javascript">AccessibilityInfo.announceForAccessibility(announcement);
+<pre><code class="hljs css language-javascript">AccessibilityInfo.announceForAccessibility(announcement);
 </code></pre>
 <p>Post a string to be announced by the screen reader.</p>
 <table>
@@ -132,7 +132,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removeeventlistener"></a><a href="#removeeventlistener" 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><code>removeEventListener()</code></h3>
-<pre><code class="hljs css languages- javascript">AccessibilityInfo.removeEventListener(eventName, handler);
+<pre><code class="hljs css language-javascript">AccessibilityInfo.removeEventListener(eventName, handler);
 </code></pre>
 <p>Remove an event handler.</p>
 <table>

docs/0.10/accessibilityinfo/index.html

@@ -8,7 +8,7 @@
               ga('send', 'pageview');
             </script><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png" alt="React Native"/><h2 class="headerTitleWithLogo">React Native</h2></a><a href="/react-native/versions"><h3>0.10</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/react-native/docs/0.10/getting-started" target="_self">Docs</a></li><li class=""><a href="/react-native/en/help" target="_self">Community</a></li><li class=""><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li><li class=""><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li class=""><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/docs/accessibilityinfo.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">AccessibilityInfo</h1></header><article><div><span><p>Sometimes it's useful to know whether or not the device has a screen reader that is currently active. The <code>AccessibilityInfo</code> API is designed for this purpose. You can use it to query the current state of the screen reader as well as to register to be notified when the state of the screen reader changes.</p>
 <p>Here's a small example illustrating how to use <code>AccessibilityInfo</code>:</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">ScreenReaderStatusExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span> </span>{
+<pre><code class="hljs css language-javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">ScreenReaderStatusExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span> </span>{
   state = {
     <span class="hljs-attr">screenReaderEnabled</span>: <span class="hljs-literal">false</span>,
   };
@@ -62,12 +62,12 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="fetch"></a><a href="#fetch" 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><code>fetch()</code></h3>
-<pre><code class="hljs css languages- javascript">AccessibilityInfo.fetch();
+<pre><code class="hljs css language-javascript">AccessibilityInfo.fetch();
 </code></pre>
 <p>Query whether a screen reader is currently enabled. Returns a promise which resolves to a boolean. The result is <code>true</code> when a screen reader is enabled and <code>false</code> otherwise.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="addeventlistener"></a><a href="#addeventlistener" 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><code>addEventListener()</code></h3>
-<pre><code class="hljs css languages- javascript">AccessibilityInfo.addEventListener(eventName, handler);
+<pre><code class="hljs css language-javascript">AccessibilityInfo.addEventListener(eventName, handler);
 </code></pre>
 <p>Add an event handler.</p>
 <table>
@@ -90,7 +90,7 @@
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="setaccessibilityfocus"></a><a href="#setaccessibilityfocus" 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><code>setAccessibilityFocus()</code></h3>
-<pre><code class="hljs css languages- javascript">AccessibilityInfo.setAccessibilityFocus(reactTag);
+<pre><code class="hljs css language-javascript">AccessibilityInfo.setAccessibilityFocus(reactTag);
 </code></pre>
 <p>Set accessibility focus to a React component.</p>
 <table>
@@ -111,7 +111,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="announceforaccessibility"></a><a href="#announceforaccessibility" 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><code>announceForAccessibility()</code></h3>
-<pre><code class="hljs css languages- javascript">AccessibilityInfo.announceForAccessibility(announcement);
+<pre><code class="hljs css language-javascript">AccessibilityInfo.announceForAccessibility(announcement);
 </code></pre>
 <p>Post a string to be announced by the screen reader.</p>
 <table>
@@ -132,7 +132,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removeeventlistener"></a><a href="#removeeventlistener" 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><code>removeEventListener()</code></h3>
-<pre><code class="hljs css languages- javascript">AccessibilityInfo.removeEventListener(eventName, handler);
+<pre><code class="hljs css language-javascript">AccessibilityInfo.removeEventListener(eventName, handler);
 </code></pre>
 <p>Remove an event handler.</p>
 <table>

docs/0.10/actionsheetios.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -38,11 +42,11 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="showactionsheetwithoptions"></a><a href="#showactionsheetwithoptions" 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><code>showActionSheetWithOptions()</code></h3>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">static</span> showActionSheetWithOptions(options, callback)
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">static</span> showActionSheetWithOptions(options, callback)
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="showshareactionsheetwithoptions"></a><a href="#showshareactionsheetwithoptions" 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><code>showShareActionSheetWithOptions()</code></h3>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">static</span> showShareActionSheetWithOptions(options, failureCallback, successCallback)
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">static</span> showShareActionSheetWithOptions(options, failureCallback, successCallback)
 </code></pre>
 </span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/react-native/docs/0.10/webview">← WebView</a><a class="docs-next button" href="/react-native/docs/0.10/cameraroll">CameraRoll →</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>

docs/0.10/actionsheetios/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -38,11 +42,11 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="showactionsheetwithoptions"></a><a href="#showactionsheetwithoptions" 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><code>showActionSheetWithOptions()</code></h3>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">static</span> showActionSheetWithOptions(options, callback)
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">static</span> showActionSheetWithOptions(options, callback)
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="showshareactionsheetwithoptions"></a><a href="#showshareactionsheetwithoptions" 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><code>showShareActionSheetWithOptions()</code></h3>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">static</span> showShareActionSheetWithOptions(options, failureCallback, successCallback)
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">static</span> showShareActionSheetWithOptions(options, failureCallback, successCallback)
 </code></pre>
 </span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/react-native/docs/0.10/webview">← WebView</a><a class="docs-next button" href="/react-native/docs/0.10/cameraroll">CameraRoll →</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>

docs/0.10/alert.html

@@ -39,7 +39,7 @@ Alert.alert(
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="alert"></a><a href="#alert" 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><code>alert()</code></h3>
-<pre><code class="hljs css languages- javascript">Alert.alert(title, [message], [buttons], [options]);
+<pre><code class="hljs css language-javascript">Alert.alert(title, [message], [buttons], [options]);
 </code></pre>
 <p>Launches an alert dialog with the specified title, and optionally a message.</p>
 <table>

docs/0.10/alert/index.html

@@ -39,7 +39,7 @@ Alert.alert(
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="alert"></a><a href="#alert" 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><code>alert()</code></h3>
-<pre><code class="hljs css languages- javascript">Alert.alert(title, [message], [buttons], [options]);
+<pre><code class="hljs css language-javascript">Alert.alert(title, [message], [buttons], [options]);
 </code></pre>
 <p>Launches an alert dialog with the specified title, and optionally a message.</p>
 <table>

docs/0.10/alertios.html

@@ -22,7 +22,7 @@
 );
 </code></pre>
 <p>Example with custom buttons:</p>
-<pre><code class="hljs css languages- javascript">AlertIOS.alert(
+<pre><code class="hljs css language-javascript">AlertIOS.alert(
   <span class="hljs-string">'Update available'</span>,
   <span class="hljs-string">'Keep your app up to date to enjoy the latest features'</span>,
   [
@@ -39,7 +39,7 @@
 );
 </code></pre>
 <p>Example with custom buttons:</p>
-<pre><code class="hljs css languages- javascript">AlertIOS.prompt(
+<pre><code class="hljs css language-javascript">AlertIOS.prompt(
   <span class="hljs-string">'Enter password'</span>,
   <span class="hljs-string">'Enter your password to claim your $1.5B in lottery winnings'</span>,
   [
@@ -57,7 +57,7 @@
 );
 </code></pre>
 <p>Example with the default button and a custom callback:</p>
-<pre><code class="hljs css languages- javascript">AlertIOS.prompt(
+<pre><code class="hljs css language-javascript">AlertIOS.prompt(
   <span class="hljs-string">'Update username'</span>,
   <span class="hljs-literal">null</span>,
   (text) =&gt; <span class="hljs-built_in">console</span>.log(<span class="hljs-string">'Your username is '</span> + text),
@@ -80,7 +80,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="alert"></a><a href="#alert" 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><code>alert()</code></h3>
-<pre><code class="hljs css languages- javascript">AlertIOS.alert(title, [message], [callbackOrButtons]);
+<pre><code class="hljs css language-javascript">AlertIOS.alert(title, [message], [callbackOrButtons]);
 </code></pre>
 <p>Create and display a popup alert with a title and an optional message.</p>
 <p>If passed a function in the <code>callbackOrButtons</code> param, it will be called when the user taps 'OK'. If passed an array of button configurations, each button should include a <code>text</code> key, as well as optional <code>onPress</code> and <code>style</code> keys. <code>style</code> should be one of 'default', 'cancel' or 'destructive'. See <a href="/react-native/docs/0.10/alertios#buttonsarray">ButtonsArray</a></p>
@@ -97,7 +97,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="prompt"></a><a href="#prompt" 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><code>prompt()</code></h3>
-<pre><code class="hljs css languages- javascript">AlertIOS.prompt(
+<pre><code class="hljs css language-javascript">AlertIOS.prompt(
   title,
   [message],
   [callbackOrButtons],

docs/0.10/alertios/index.html

@@ -22,7 +22,7 @@
 );
 </code></pre>
 <p>Example with custom buttons:</p>
-<pre><code class="hljs css languages- javascript">AlertIOS.alert(
+<pre><code class="hljs css language-javascript">AlertIOS.alert(
   <span class="hljs-string">'Update available'</span>,
   <span class="hljs-string">'Keep your app up to date to enjoy the latest features'</span>,
   [
@@ -39,7 +39,7 @@
 );
 </code></pre>
 <p>Example with custom buttons:</p>
-<pre><code class="hljs css languages- javascript">AlertIOS.prompt(
+<pre><code class="hljs css language-javascript">AlertIOS.prompt(
   <span class="hljs-string">'Enter password'</span>,
   <span class="hljs-string">'Enter your password to claim your $1.5B in lottery winnings'</span>,
   [
@@ -57,7 +57,7 @@
 );
 </code></pre>
 <p>Example with the default button and a custom callback:</p>
-<pre><code class="hljs css languages- javascript">AlertIOS.prompt(
+<pre><code class="hljs css language-javascript">AlertIOS.prompt(
   <span class="hljs-string">'Update username'</span>,
   <span class="hljs-literal">null</span>,
   (text) =&gt; <span class="hljs-built_in">console</span>.log(<span class="hljs-string">'Your username is '</span> + text),
@@ -80,7 +80,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="alert"></a><a href="#alert" 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><code>alert()</code></h3>
-<pre><code class="hljs css languages- javascript">AlertIOS.alert(title, [message], [callbackOrButtons]);
+<pre><code class="hljs css language-javascript">AlertIOS.alert(title, [message], [callbackOrButtons]);
 </code></pre>
 <p>Create and display a popup alert with a title and an optional message.</p>
 <p>If passed a function in the <code>callbackOrButtons</code> param, it will be called when the user taps 'OK'. If passed an array of button configurations, each button should include a <code>text</code> key, as well as optional <code>onPress</code> and <code>style</code> keys. <code>style</code> should be one of 'default', 'cancel' or 'destructive'. See <a href="/react-native/docs/0.10/alertios#buttonsarray">ButtonsArray</a></p>
@@ -97,7 +97,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="prompt"></a><a href="#prompt" 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><code>prompt()</code></h3>
-<pre><code class="hljs css languages- javascript">AlertIOS.prompt(
+<pre><code class="hljs css language-javascript">AlertIOS.prompt(
   title,
   [message],
   [callbackOrButtons],

docs/0.10/animated.html

@@ -8,7 +8,7 @@
               ga('send', 'pageview');
             </script><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png" alt="React Native"/><h2 class="headerTitleWithLogo">React Native</h2></a><a href="/react-native/versions"><h3>0.10</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/react-native/docs/0.10/getting-started" target="_self">Docs</a></li><li class=""><a href="/react-native/en/help" target="_self">Community</a></li><li class=""><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li><li class=""><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li class=""><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/docs/animated.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">Animated</h1></header><article><div><span><p>The <code>Animated</code> library is designed to make animations fluid, powerful, and easy to build and maintain. <code>Animated</code> focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and simple <code>start</code>/<code>stop</code> methods to control time-based animation execution.</p>
 <p>The simplest workflow for creating an animation is to create an <code>Animated.Value</code>, hook it up to one or more style attributes of an animated component, and then drive updates via animations using <code>Animated.timing()</code>:</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(
+<pre><code class="hljs css language-javascript">Animated.timing(
   <span class="hljs-comment">// Animate value over time</span>
   <span class="hljs-keyword">this</span>.state.fadeAnim, <span class="hljs-comment">// The value to drive</span>
   {
@@ -34,7 +34,7 @@
 <p>In most cases, you will be using <code>timing()</code>. By default, it uses a symmetric easeInOut curve that conveys the gradual acceleration of an object to full speed and concludes by gradually decelerating to a stop.</p>
 <h3><a class="anchor" aria-hidden="true" id="working-with-animations"></a><a href="#working-with-animations" 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>Working with animations</h3>
 <p>Animations are started by calling <code>start()</code> on your animation. <code>start()</code> takes a completion callback that will be called when the animation is done. If the animation finished running normally, the completion callback will be invoked with <code>{finished: true}</code>. If the animation is done because <code>stop()</code> was called on it before it could finish (e.g. because it was interrupted by a gesture or another animation), then it will receive <code>{finished: false}</code>.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">this</span>.animateValue.spring({}).start(<span class="hljs-function">(<span class="hljs-params">{finished}</span>) =&gt;</span> {
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">this</span>.animateValue.spring({}).start(<span class="hljs-function">(<span class="hljs-params">{finished}</span>) =&gt;</span> {
   <span class="hljs-keyword">if</span> (finished) {
     <span class="hljs-built_in">console</span>.log(<span class="hljs-string">'Animation was completed'</span>);
   } <span class="hljs-keyword">else</span> {
@@ -87,7 +87,7 @@
 <li><a href="/react-native/docs/0.10/animated#event"><code>Animated.event()</code></a></li>
 </ul>
 <p>For example, when working with horizontal scrolling gestures, you would do the following in order to map <code>event.nativeEvent.contentOffset.x</code> to <code>scrollX</code> (an <code>Animated.Value</code>):</p>
-<pre><code class="hljs css languages- javascript"> onScroll={Animated.event(
+<pre><code class="hljs css language-javascript"> onScroll={Animated.event(
    <span class="hljs-comment">// scrollX = e.nativeEvent.contentOffset.x</span>
    [{ <span class="hljs-attr">nativeEvent</span>: {
         <span class="hljs-attr">contentOffset</span>: {
@@ -142,7 +142,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="decay"></a><a href="#decay" 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><code>decay()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.decay(value, config);
+<pre><code class="hljs css language-javascript">Animated.decay(value, config);
 </code></pre>
 <p>Animates a value from an initial velocity to zero based on a decay coefficient.</p>
 <p><strong>Parameters:</strong></p>
@@ -164,7 +164,7 @@
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="timing"></a><a href="#timing" 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><code>timing()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.timing(value, config);
+<pre><code class="hljs css language-javascript">Animated.timing(value, config);
 </code></pre>
 <p>Animates a value along a timed easing curve. The <a href="/react-native/docs/0.10/easing"><code>Easing</code></a> module has tons of predefined curves, or you can use your own function.</p>
 <p><strong>Parameters:</strong></p>
@@ -187,7 +187,7 @@
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="spring"></a><a href="#spring" 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><code>spring()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.spring(value, config);
+<pre><code class="hljs css language-javascript">Animated.spring(value, config);
 </code></pre>
 <p>Animates a value according to an analytical spring model based on <a href="https://en.wikipedia.org/wiki/Harmonic_oscillator#Damped_harmonic_oscillator">damped harmonic oscillation</a>. Tracks velocity state to create fluid motions as the <code>toValue</code> updates, and can be chained together.</p>
 <p><strong>Parameters:</strong></p>
@@ -227,7 +227,7 @@
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="add"></a><a href="#add" 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><code>add()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.add(a, b);
+<pre><code class="hljs css language-javascript">Animated.add(a, b);
 </code></pre>
 <p>Creates a new Animated value composed from two Animated values added together.</p>
 <p><strong>Parameters:</strong></p>
@@ -242,7 +242,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="divide"></a><a href="#divide" 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><code>divide()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.divide(a, b);
+<pre><code class="hljs css language-javascript">Animated.divide(a, b);
 </code></pre>
 <p>Creates a new Animated value composed by dividing the first Animated value by the second Animated value.</p>
 <p><strong>Parameters:</strong></p>
@@ -257,7 +257,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="multiply"></a><a href="#multiply" 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><code>multiply()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.multiply(a, b);
+<pre><code class="hljs css language-javascript">Animated.multiply(a, b);
 </code></pre>
 <p>Creates a new Animated value composed from two Animated values multiplied together.</p>
 <p><strong>Parameters:</strong></p>
@@ -272,7 +272,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="modulo"></a><a href="#modulo" 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><code>modulo()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.modulo(a, modulus);
+<pre><code class="hljs css language-javascript">Animated.modulo(a, modulus);
 </code></pre>
 <p>Creates a new Animated value that is the (non-negative) modulo of the provided Animated value.</p>
 <p><strong>Parameters:</strong></p>
@@ -287,7 +287,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="diffclamp"></a><a href="#diffclamp" 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><code>diffClamp()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.diffClamp(a, min, max);
+<pre><code class="hljs css language-javascript">Animated.diffClamp(a, min, max);
 </code></pre>
 <p>Create a new Animated value that is limited between 2 values. It uses the difference between the last value so even if the value is far from the bounds it will start changing when the value starts getting closer again. (<code>value = clamp(value + diff, min, max)</code>).</p>
 <p>This is useful with scroll events, for example, to show the navbar when scrolling up and to hide it when scrolling down.</p>
@@ -304,7 +304,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="delay"></a><a href="#delay" 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><code>delay()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.delay(time);
+<pre><code class="hljs css language-javascript">Animated.delay(time);
 </code></pre>
 <p>Starts an animation after the given delay.</p>
 <p><strong>Parameters:</strong></p>
@@ -318,7 +318,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="sequence"></a><a href="#sequence" 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><code>sequence()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.sequence(animations);
+<pre><code class="hljs css language-javascript">Animated.sequence(animations);
 </code></pre>
 <p>Starts an array of animations in order, waiting for each to complete before starting the next. If the current running animation is stopped, no following animations will be started.</p>
 <p><strong>Parameters:</strong></p>
@@ -332,7 +332,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="parallel"></a><a href="#parallel" 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><code>parallel()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.parallel(animations, [config]);
+<pre><code class="hljs css language-javascript">Animated.parallel(animations, [config]);
 </code></pre>
 <p>Starts an array of animations all at the same time. By default, if one of the animations is stopped, they will all be stopped. You can override this with the <code>stopTogether</code> flag through <code>config</code>.</p>
 <p><strong>Parameters:</strong></p>
@@ -347,7 +347,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="stagger"></a><a href="#stagger" 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><code>stagger()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.stagger(time, animations);
+<pre><code class="hljs css language-javascript">Animated.stagger(time, animations);
 </code></pre>
 <p>Array of animations may run in parallel (overlap), but are started in sequence with successive delays. Nice for doing trailing effects.</p>
 <p><strong>Parameters:</strong></p>
@@ -362,7 +362,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="loop"></a><a href="#loop" 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><code>loop()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.loop(animation);
+<pre><code class="hljs css language-javascript">Animated.loop(animation);
 </code></pre>
 <p>Loops a given animation continuously, so that each time it reaches the end, it resets and begins again from the start. Can specify number of times to loop using the key <code>iterations</code> in the config. Will loop without blocking the UI thread if the child animation is set to <code>useNativeDriver: true</code>. In addition, loops can prevent <code>VirtualizedList</code>-based components from rendering more rows while the animation is running. You can pass <code>isInteraction: false</code> in the child animation config to fix this.</p>
 <p><strong>Parameters:</strong></p>
@@ -376,10 +376,10 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="event"></a><a href="#event" 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><code>event()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.event(argMapping, [config]);
+<pre><code class="hljs css language-javascript">Animated.event(argMapping, [config]);
 </code></pre>
 <p>Takes an array of mappings and extracts values from each arg accordingly, then calls <code>setValue</code> on the mapped outputs. e.g.</p>
-<pre><code class="hljs css languages- javascript">onScroll={Animated.event(
+<pre><code class="hljs css language-javascript">onScroll={Animated.event(
   [{<span class="hljs-attr">nativeEvent</span>: {<span class="hljs-attr">contentOffset</span>: {<span class="hljs-attr">x</span>: <span class="hljs-keyword">this</span>._scrollX}}}],
   {<span class="hljs-attr">listener</span>: <span class="hljs-function">(<span class="hljs-params">event</span>) =&gt;</span> <span class="hljs-built_in">console</span>.log(event)}, <span class="hljs-comment">// Optional async listener</span>
 )}
@@ -407,7 +407,7 @@ onPanResponderMove: Animated.event([
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="createanimatedcomponent"></a><a href="#createanimatedcomponent" 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><code>createAnimatedComponent()</code></h3>
-<pre><code class="hljs css languages- javascript">createAnimatedComponent(component);
+<pre><code class="hljs css language-javascript">createAnimatedComponent(component);
 </code></pre>
 <p>Make any React component Animatable. Used to create <code>Animated.View</code>, etc.</p>
 <p><strong>Parameters:</strong></p>
@@ -421,7 +421,7 @@ onPanResponderMove: Animated.event([
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="attachnativeevent"></a><a href="#attachnativeevent" 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><code>attachNativeEvent()</code></h3>
-<pre><code class="hljs css languages- javascript">attachNativeEvent(viewRef, eventName, argMapping);
+<pre><code class="hljs css language-javascript">attachNativeEvent(viewRef, eventName, argMapping);
 </code></pre>
 <p>Imperative API to attach an animated value to an event on a view. Prefer using <code>Animated.event</code> with <code>useNativeDrive: true</code> if possible.</p>
 <p><strong>Parameters:</strong></p>
@@ -437,7 +437,7 @@ onPanResponderMove: Animated.event([
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="forkevent"></a><a href="#forkevent" 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><code>forkEvent()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.forkEvent(event, listener);
+<pre><code class="hljs css language-javascript">Animated.forkEvent(event, listener);
 </code></pre>
 <p>Advanced imperative API for snooping on animated events that are passed in through props. Use values directly where possible.</p>
 <p><strong>Parameters:</strong></p>
@@ -452,7 +452,7 @@ onPanResponderMove: Animated.event([
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="unforkevent"></a><a href="#unforkevent" 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><code>unforkEvent()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.unforkEvent(event, listener);
+<pre><code class="hljs css language-javascript">Animated.unforkEvent(event, listener);
 </code></pre>
 <p>Advanced imperative API for snooping on animated events that are passed in through props. Use values directly where possible.</p>
 <p><strong>Parameters:</strong></p>

docs/0.10/animated/index.html

@@ -8,7 +8,7 @@
               ga('send', 'pageview');
             </script><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png" alt="React Native"/><h2 class="headerTitleWithLogo">React Native</h2></a><a href="/react-native/versions"><h3>0.10</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/react-native/docs/0.10/getting-started" target="_self">Docs</a></li><li class=""><a href="/react-native/en/help" target="_self">Community</a></li><li class=""><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li><li class=""><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li class=""><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/docs/animated.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">Animated</h1></header><article><div><span><p>The <code>Animated</code> library is designed to make animations fluid, powerful, and easy to build and maintain. <code>Animated</code> focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and simple <code>start</code>/<code>stop</code> methods to control time-based animation execution.</p>
 <p>The simplest workflow for creating an animation is to create an <code>Animated.Value</code>, hook it up to one or more style attributes of an animated component, and then drive updates via animations using <code>Animated.timing()</code>:</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(
+<pre><code class="hljs css language-javascript">Animated.timing(
   <span class="hljs-comment">// Animate value over time</span>
   <span class="hljs-keyword">this</span>.state.fadeAnim, <span class="hljs-comment">// The value to drive</span>
   {
@@ -34,7 +34,7 @@
 <p>In most cases, you will be using <code>timing()</code>. By default, it uses a symmetric easeInOut curve that conveys the gradual acceleration of an object to full speed and concludes by gradually decelerating to a stop.</p>
 <h3><a class="anchor" aria-hidden="true" id="working-with-animations"></a><a href="#working-with-animations" 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>Working with animations</h3>
 <p>Animations are started by calling <code>start()</code> on your animation. <code>start()</code> takes a completion callback that will be called when the animation is done. If the animation finished running normally, the completion callback will be invoked with <code>{finished: true}</code>. If the animation is done because <code>stop()</code> was called on it before it could finish (e.g. because it was interrupted by a gesture or another animation), then it will receive <code>{finished: false}</code>.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">this</span>.animateValue.spring({}).start(<span class="hljs-function">(<span class="hljs-params">{finished}</span>) =&gt;</span> {
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">this</span>.animateValue.spring({}).start(<span class="hljs-function">(<span class="hljs-params">{finished}</span>) =&gt;</span> {
   <span class="hljs-keyword">if</span> (finished) {
     <span class="hljs-built_in">console</span>.log(<span class="hljs-string">'Animation was completed'</span>);
   } <span class="hljs-keyword">else</span> {
@@ -87,7 +87,7 @@
 <li><a href="/react-native/docs/0.10/animated#event"><code>Animated.event()</code></a></li>
 </ul>
 <p>For example, when working with horizontal scrolling gestures, you would do the following in order to map <code>event.nativeEvent.contentOffset.x</code> to <code>scrollX</code> (an <code>Animated.Value</code>):</p>
-<pre><code class="hljs css languages- javascript"> onScroll={Animated.event(
+<pre><code class="hljs css language-javascript"> onScroll={Animated.event(
    <span class="hljs-comment">// scrollX = e.nativeEvent.contentOffset.x</span>
    [{ <span class="hljs-attr">nativeEvent</span>: {
         <span class="hljs-attr">contentOffset</span>: {
@@ -142,7 +142,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="decay"></a><a href="#decay" 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><code>decay()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.decay(value, config);
+<pre><code class="hljs css language-javascript">Animated.decay(value, config);
 </code></pre>
 <p>Animates a value from an initial velocity to zero based on a decay coefficient.</p>
 <p><strong>Parameters:</strong></p>
@@ -164,7 +164,7 @@
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="timing"></a><a href="#timing" 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><code>timing()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.timing(value, config);
+<pre><code class="hljs css language-javascript">Animated.timing(value, config);
 </code></pre>
 <p>Animates a value along a timed easing curve. The <a href="/react-native/docs/0.10/easing"><code>Easing</code></a> module has tons of predefined curves, or you can use your own function.</p>
 <p><strong>Parameters:</strong></p>
@@ -187,7 +187,7 @@
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="spring"></a><a href="#spring" 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><code>spring()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.spring(value, config);
+<pre><code class="hljs css language-javascript">Animated.spring(value, config);
 </code></pre>
 <p>Animates a value according to an analytical spring model based on <a href="https://en.wikipedia.org/wiki/Harmonic_oscillator#Damped_harmonic_oscillator">damped harmonic oscillation</a>. Tracks velocity state to create fluid motions as the <code>toValue</code> updates, and can be chained together.</p>
 <p><strong>Parameters:</strong></p>
@@ -227,7 +227,7 @@
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="add"></a><a href="#add" 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><code>add()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.add(a, b);
+<pre><code class="hljs css language-javascript">Animated.add(a, b);
 </code></pre>
 <p>Creates a new Animated value composed from two Animated values added together.</p>
 <p><strong>Parameters:</strong></p>
@@ -242,7 +242,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="divide"></a><a href="#divide" 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><code>divide()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.divide(a, b);
+<pre><code class="hljs css language-javascript">Animated.divide(a, b);
 </code></pre>
 <p>Creates a new Animated value composed by dividing the first Animated value by the second Animated value.</p>
 <p><strong>Parameters:</strong></p>
@@ -257,7 +257,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="multiply"></a><a href="#multiply" 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><code>multiply()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.multiply(a, b);
+<pre><code class="hljs css language-javascript">Animated.multiply(a, b);
 </code></pre>
 <p>Creates a new Animated value composed from two Animated values multiplied together.</p>
 <p><strong>Parameters:</strong></p>
@@ -272,7 +272,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="modulo"></a><a href="#modulo" 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><code>modulo()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.modulo(a, modulus);
+<pre><code class="hljs css language-javascript">Animated.modulo(a, modulus);
 </code></pre>
 <p>Creates a new Animated value that is the (non-negative) modulo of the provided Animated value.</p>
 <p><strong>Parameters:</strong></p>
@@ -287,7 +287,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="diffclamp"></a><a href="#diffclamp" 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><code>diffClamp()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.diffClamp(a, min, max);
+<pre><code class="hljs css language-javascript">Animated.diffClamp(a, min, max);
 </code></pre>
 <p>Create a new Animated value that is limited between 2 values. It uses the difference between the last value so even if the value is far from the bounds it will start changing when the value starts getting closer again. (<code>value = clamp(value + diff, min, max)</code>).</p>
 <p>This is useful with scroll events, for example, to show the navbar when scrolling up and to hide it when scrolling down.</p>
@@ -304,7 +304,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="delay"></a><a href="#delay" 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><code>delay()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.delay(time);
+<pre><code class="hljs css language-javascript">Animated.delay(time);
 </code></pre>
 <p>Starts an animation after the given delay.</p>
 <p><strong>Parameters:</strong></p>
@@ -318,7 +318,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="sequence"></a><a href="#sequence" 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><code>sequence()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.sequence(animations);
+<pre><code class="hljs css language-javascript">Animated.sequence(animations);
 </code></pre>
 <p>Starts an array of animations in order, waiting for each to complete before starting the next. If the current running animation is stopped, no following animations will be started.</p>
 <p><strong>Parameters:</strong></p>
@@ -332,7 +332,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="parallel"></a><a href="#parallel" 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><code>parallel()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.parallel(animations, [config]);
+<pre><code class="hljs css language-javascript">Animated.parallel(animations, [config]);
 </code></pre>
 <p>Starts an array of animations all at the same time. By default, if one of the animations is stopped, they will all be stopped. You can override this with the <code>stopTogether</code> flag through <code>config</code>.</p>
 <p><strong>Parameters:</strong></p>
@@ -347,7 +347,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="stagger"></a><a href="#stagger" 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><code>stagger()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.stagger(time, animations);
+<pre><code class="hljs css language-javascript">Animated.stagger(time, animations);
 </code></pre>
 <p>Array of animations may run in parallel (overlap), but are started in sequence with successive delays. Nice for doing trailing effects.</p>
 <p><strong>Parameters:</strong></p>
@@ -362,7 +362,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="loop"></a><a href="#loop" 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><code>loop()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.loop(animation);
+<pre><code class="hljs css language-javascript">Animated.loop(animation);
 </code></pre>
 <p>Loops a given animation continuously, so that each time it reaches the end, it resets and begins again from the start. Can specify number of times to loop using the key <code>iterations</code> in the config. Will loop without blocking the UI thread if the child animation is set to <code>useNativeDriver: true</code>. In addition, loops can prevent <code>VirtualizedList</code>-based components from rendering more rows while the animation is running. You can pass <code>isInteraction: false</code> in the child animation config to fix this.</p>
 <p><strong>Parameters:</strong></p>
@@ -376,10 +376,10 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="event"></a><a href="#event" 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><code>event()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.event(argMapping, [config]);
+<pre><code class="hljs css language-javascript">Animated.event(argMapping, [config]);
 </code></pre>
 <p>Takes an array of mappings and extracts values from each arg accordingly, then calls <code>setValue</code> on the mapped outputs. e.g.</p>
-<pre><code class="hljs css languages- javascript">onScroll={Animated.event(
+<pre><code class="hljs css language-javascript">onScroll={Animated.event(
   [{<span class="hljs-attr">nativeEvent</span>: {<span class="hljs-attr">contentOffset</span>: {<span class="hljs-attr">x</span>: <span class="hljs-keyword">this</span>._scrollX}}}],
   {<span class="hljs-attr">listener</span>: <span class="hljs-function">(<span class="hljs-params">event</span>) =&gt;</span> <span class="hljs-built_in">console</span>.log(event)}, <span class="hljs-comment">// Optional async listener</span>
 )}
@@ -407,7 +407,7 @@ onPanResponderMove: Animated.event([
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="createanimatedcomponent"></a><a href="#createanimatedcomponent" 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><code>createAnimatedComponent()</code></h3>
-<pre><code class="hljs css languages- javascript">createAnimatedComponent(component);
+<pre><code class="hljs css language-javascript">createAnimatedComponent(component);
 </code></pre>
 <p>Make any React component Animatable. Used to create <code>Animated.View</code>, etc.</p>
 <p><strong>Parameters:</strong></p>
@@ -421,7 +421,7 @@ onPanResponderMove: Animated.event([
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="attachnativeevent"></a><a href="#attachnativeevent" 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><code>attachNativeEvent()</code></h3>
-<pre><code class="hljs css languages- javascript">attachNativeEvent(viewRef, eventName, argMapping);
+<pre><code class="hljs css language-javascript">attachNativeEvent(viewRef, eventName, argMapping);
 </code></pre>
 <p>Imperative API to attach an animated value to an event on a view. Prefer using <code>Animated.event</code> with <code>useNativeDrive: true</code> if possible.</p>
 <p><strong>Parameters:</strong></p>
@@ -437,7 +437,7 @@ onPanResponderMove: Animated.event([
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="forkevent"></a><a href="#forkevent" 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><code>forkEvent()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.forkEvent(event, listener);
+<pre><code class="hljs css language-javascript">Animated.forkEvent(event, listener);
 </code></pre>
 <p>Advanced imperative API for snooping on animated events that are passed in through props. Use values directly where possible.</p>
 <p><strong>Parameters:</strong></p>
@@ -452,7 +452,7 @@ onPanResponderMove: Animated.event([
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="unforkevent"></a><a href="#unforkevent" 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><code>unforkEvent()</code></h3>
-<pre><code class="hljs css languages- javascript">Animated.unforkEvent(event, listener);
+<pre><code class="hljs css language-javascript">Animated.unforkEvent(event, listener);
 </code></pre>
 <p>Advanced imperative API for snooping on animated events that are passed in through props. Use values directly where possible.</p>
 <p><strong>Parameters:</strong></p>

docs/0.10/animatedvalue.html

@@ -29,7 +29,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="setvalue"></a><a href="#setvalue" 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><code>setValue()</code></h3>
-<pre><code class="hljs css languages- javascript">setValue(value);
+<pre><code class="hljs css language-javascript">setValue(value);
 </code></pre>
 <p>Directly set the value. This will stop any animations running on the value and update all the bound properties.</p>
 <p><strong>Parameters:</strong></p>
@@ -43,7 +43,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="setoffset"></a><a href="#setoffset" 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><code>setOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">setOffset(offset);
+<pre><code class="hljs css language-javascript">setOffset(offset);
 </code></pre>
 <p>Sets an offset that is applied on top of whatever value is set, whether via <code>setValue</code>, an animation, or <code>Animated.event</code>. Useful for compensating things like the start of a pan gesture.</p>
 <p><strong>Parameters:</strong></p>
@@ -57,17 +57,17 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="flattenoffset"></a><a href="#flattenoffset" 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><code>flattenOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">flattenOffset();
+<pre><code class="hljs css language-javascript">flattenOffset();
 </code></pre>
 <p>Merges the offset value into the base value and resets the offset to zero. The final output of the value is unchanged.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="extractoffset"></a><a href="#extractoffset" 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><code>extractOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">extractOffset();
+<pre><code class="hljs css language-javascript">extractOffset();
 </code></pre>
 <p>Sets the offset value to the base value, and resets the base value to zero. The final output of the value is unchanged.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="addlistener"></a><a href="#addlistener" 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><code>addListener()</code></h3>
-<pre><code class="hljs css languages- javascript">addListener(callback);
+<pre><code class="hljs css language-javascript">addListener(callback);
 </code></pre>
 <p>Adds an asynchronous listener to the value so you can observe updates from animations. This is useful because there is no way to synchronously read the value because it might be driven natively.</p>
 <p>Returns a string that serves as an identifier for the listener.</p>
@@ -82,7 +82,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removelistener"></a><a href="#removelistener" 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><code>removeListener()</code></h3>
-<pre><code class="hljs css languages- javascript">removeListener(id);
+<pre><code class="hljs css language-javascript">removeListener(id);
 </code></pre>
 <p>Unregister a listener. The <code>id</code> param shall match the identifier previously returned by <code>addListener()</code>.</p>
 <p><strong>Parameters:</strong></p>
@@ -96,12 +96,12 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removealllisteners"></a><a href="#removealllisteners" 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><code>removeAllListeners()</code></h3>
-<pre><code class="hljs css languages- javascript">removeAllListeners();
+<pre><code class="hljs css language-javascript">removeAllListeners();
 </code></pre>
 <p>Remove all registered listeners.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="stopanimation"></a><a href="#stopanimation" 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><code>stopAnimation()</code></h3>
-<pre><code class="hljs css languages- javascript">stopAnimation([callback]);
+<pre><code class="hljs css language-javascript">stopAnimation([callback]);
 </code></pre>
 <p>Stops any running animation or tracking. <code>callback</code> is invoked with the final value after stopping the animation, which is useful for updating state to match the animation position with layout.</p>
 <p><strong>Parameters:</strong></p>
@@ -115,7 +115,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="resetanimation"></a><a href="#resetanimation" 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><code>resetAnimation()</code></h3>
-<pre><code class="hljs css languages- javascript">resetAnimation([callback]);
+<pre><code class="hljs css language-javascript">resetAnimation([callback]);
 </code></pre>
 <p>Stops any animation and resets the value to its original.</p>
 <p><strong>Parameters:</strong></p>
@@ -129,7 +129,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="interpolate"></a><a href="#interpolate" 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><code>interpolate()</code></h3>
-<pre><code class="hljs css languages- javascript">interpolate(config);
+<pre><code class="hljs css language-javascript">interpolate(config);
 </code></pre>
 <p>Interpolates the value before updating the property, e.g. mapping 0-1 to 0-10.</p>
 <p>See <code>AnimatedInterpolation.js</code></p>
@@ -153,7 +153,7 @@
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="animate"></a><a href="#animate" 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><code>animate()</code></h3>
-<pre><code class="hljs css languages- javascript">animate(animation, callback);
+<pre><code class="hljs css language-javascript">animate(animation, callback);
 </code></pre>
 <p>Typically only used internally, but could be used by a custom Animation class.</p>
 <p><strong>Parameters:</strong></p>
@@ -168,12 +168,12 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="stoptracking"></a><a href="#stoptracking" 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><code>stopTracking()</code></h3>
-<pre><code class="hljs css languages- javascript">stopTracking();
+<pre><code class="hljs css language-javascript">stopTracking();
 </code></pre>
 <p>Typically only used internally.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="track"></a><a href="#track" 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><code>track()</code></h3>
-<pre><code class="hljs css languages- javascript">track(tracking);
+<pre><code class="hljs css language-javascript">track(tracking);
 </code></pre>
 <p>Typically only used internally.</p>
 <p><strong>Parameters:</strong></p>

docs/0.10/animatedvalue/index.html

@@ -29,7 +29,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="setvalue"></a><a href="#setvalue" 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><code>setValue()</code></h3>
-<pre><code class="hljs css languages- javascript">setValue(value);
+<pre><code class="hljs css language-javascript">setValue(value);
 </code></pre>
 <p>Directly set the value. This will stop any animations running on the value and update all the bound properties.</p>
 <p><strong>Parameters:</strong></p>
@@ -43,7 +43,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="setoffset"></a><a href="#setoffset" 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><code>setOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">setOffset(offset);
+<pre><code class="hljs css language-javascript">setOffset(offset);
 </code></pre>
 <p>Sets an offset that is applied on top of whatever value is set, whether via <code>setValue</code>, an animation, or <code>Animated.event</code>. Useful for compensating things like the start of a pan gesture.</p>
 <p><strong>Parameters:</strong></p>
@@ -57,17 +57,17 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="flattenoffset"></a><a href="#flattenoffset" 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><code>flattenOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">flattenOffset();
+<pre><code class="hljs css language-javascript">flattenOffset();
 </code></pre>
 <p>Merges the offset value into the base value and resets the offset to zero. The final output of the value is unchanged.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="extractoffset"></a><a href="#extractoffset" 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><code>extractOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">extractOffset();
+<pre><code class="hljs css language-javascript">extractOffset();
 </code></pre>
 <p>Sets the offset value to the base value, and resets the base value to zero. The final output of the value is unchanged.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="addlistener"></a><a href="#addlistener" 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><code>addListener()</code></h3>
-<pre><code class="hljs css languages- javascript">addListener(callback);
+<pre><code class="hljs css language-javascript">addListener(callback);
 </code></pre>
 <p>Adds an asynchronous listener to the value so you can observe updates from animations. This is useful because there is no way to synchronously read the value because it might be driven natively.</p>
 <p>Returns a string that serves as an identifier for the listener.</p>
@@ -82,7 +82,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removelistener"></a><a href="#removelistener" 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><code>removeListener()</code></h3>
-<pre><code class="hljs css languages- javascript">removeListener(id);
+<pre><code class="hljs css language-javascript">removeListener(id);
 </code></pre>
 <p>Unregister a listener. The <code>id</code> param shall match the identifier previously returned by <code>addListener()</code>.</p>
 <p><strong>Parameters:</strong></p>
@@ -96,12 +96,12 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removealllisteners"></a><a href="#removealllisteners" 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><code>removeAllListeners()</code></h3>
-<pre><code class="hljs css languages- javascript">removeAllListeners();
+<pre><code class="hljs css language-javascript">removeAllListeners();
 </code></pre>
 <p>Remove all registered listeners.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="stopanimation"></a><a href="#stopanimation" 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><code>stopAnimation()</code></h3>
-<pre><code class="hljs css languages- javascript">stopAnimation([callback]);
+<pre><code class="hljs css language-javascript">stopAnimation([callback]);
 </code></pre>
 <p>Stops any running animation or tracking. <code>callback</code> is invoked with the final value after stopping the animation, which is useful for updating state to match the animation position with layout.</p>
 <p><strong>Parameters:</strong></p>
@@ -115,7 +115,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="resetanimation"></a><a href="#resetanimation" 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><code>resetAnimation()</code></h3>
-<pre><code class="hljs css languages- javascript">resetAnimation([callback]);
+<pre><code class="hljs css language-javascript">resetAnimation([callback]);
 </code></pre>
 <p>Stops any animation and resets the value to its original.</p>
 <p><strong>Parameters:</strong></p>
@@ -129,7 +129,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="interpolate"></a><a href="#interpolate" 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><code>interpolate()</code></h3>
-<pre><code class="hljs css languages- javascript">interpolate(config);
+<pre><code class="hljs css language-javascript">interpolate(config);
 </code></pre>
 <p>Interpolates the value before updating the property, e.g. mapping 0-1 to 0-10.</p>
 <p>See <code>AnimatedInterpolation.js</code></p>
@@ -153,7 +153,7 @@
 </ul>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="animate"></a><a href="#animate" 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><code>animate()</code></h3>
-<pre><code class="hljs css languages- javascript">animate(animation, callback);
+<pre><code class="hljs css language-javascript">animate(animation, callback);
 </code></pre>
 <p>Typically only used internally, but could be used by a custom Animation class.</p>
 <p><strong>Parameters:</strong></p>
@@ -168,12 +168,12 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="stoptracking"></a><a href="#stoptracking" 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><code>stopTracking()</code></h3>
-<pre><code class="hljs css languages- javascript">stopTracking();
+<pre><code class="hljs css language-javascript">stopTracking();
 </code></pre>
 <p>Typically only used internally.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="track"></a><a href="#track" 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><code>track()</code></h3>
-<pre><code class="hljs css languages- javascript">track(tracking);
+<pre><code class="hljs css language-javascript">track(tracking);
 </code></pre>
 <p>Typically only used internally.</p>
 <p><strong>Parameters:</strong></p>

docs/0.10/animatedvaluexy.html

@@ -9,7 +9,7 @@
             </script><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png" alt="React Native"/><h2 class="headerTitleWithLogo">React Native</h2></a><a href="/react-native/versions"><h3>0.10</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/react-native/docs/0.10/getting-started" target="_self">Docs</a></li><li class=""><a href="/react-native/en/help" target="_self">Community</a></li><li class=""><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li><li class=""><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li class=""><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/docs/animatedvaluexy.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">AnimatedValueXY</h1></header><article><div><span><p>2D Value for driving 2D animations, such as pan gestures. Almost identical API to normal <a href="/react-native/docs/0.10/animatedvalue"><code>Animated.Value</code></a>, but multiplexed. Contains two regular <code>Animated.Value</code>s under the hood.</p>
 <p>See also <a href="/react-native/docs/0.10/animated"><code>Animated</code></a>.</p>
 <h2><a class="anchor" aria-hidden="true" id="example"></a><a href="#example" 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>Example</h2>
-<pre><code class="hljs css languages- javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">DraggableView</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span> </span>{
+<pre><code class="hljs css language-javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">DraggableView</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span> </span>{
   <span class="hljs-keyword">constructor</span>(props) {
     <span class="hljs-keyword">super</span>(props);
     <span class="hljs-keyword">this</span>.state = {
@@ -61,7 +61,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="setvalue"></a><a href="#setvalue" 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><code>setValue()</code></h3>
-<pre><code class="hljs css languages- javascript">setValue(value);
+<pre><code class="hljs css language-javascript">setValue(value);
 </code></pre>
 <p>Directly set the value. This will stop any animations running on the value and update all the bound properties.</p>
 <p><strong>Parameters:</strong></p>
@@ -75,7 +75,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="setoffset"></a><a href="#setoffset" 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><code>setOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">setOffset(offset);
+<pre><code class="hljs css language-javascript">setOffset(offset);
 </code></pre>
 <p>Sets an offset that is applied on top of whatever value is set, whether via <code>setValue</code>, an animation, or <code>Animated.event</code>. Useful for compensating things like the start of a pan gesture.</p>
 <p><strong>Parameters:</strong></p>
@@ -89,17 +89,17 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="flattenoffset"></a><a href="#flattenoffset" 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><code>flattenOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">flattenOffset();
+<pre><code class="hljs css language-javascript">flattenOffset();
 </code></pre>
 <p>Merges the offset value into the base value and resets the offset to zero. The final output of the value is unchanged.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="extractoffset"></a><a href="#extractoffset" 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><code>extractOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">extractOffset();
+<pre><code class="hljs css language-javascript">extractOffset();
 </code></pre>
 <p>Sets the offset value to the base value, and resets the base value to zero. The final output of the value is unchanged.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="addlistener"></a><a href="#addlistener" 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><code>addListener()</code></h3>
-<pre><code class="hljs css languages- javascript">addListener(callback);
+<pre><code class="hljs css language-javascript">addListener(callback);
 </code></pre>
 <p>Adds an asynchronous listener to the value so you can observe updates from animations. This is useful because there is no way to synchronously read the value because it might be driven natively.</p>
 <p>Returns a string that serves as an identifier for the listener.</p>
@@ -114,7 +114,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removelistener"></a><a href="#removelistener" 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><code>removeListener()</code></h3>
-<pre><code class="hljs css languages- javascript">removeListener(id);
+<pre><code class="hljs css language-javascript">removeListener(id);
 </code></pre>
 <p>Unregister a listener. The <code>id</code> param shall match the identifier previously returned by <code>addListener()</code>.</p>
 <p><strong>Parameters:</strong></p>
@@ -128,12 +128,12 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removealllisteners"></a><a href="#removealllisteners" 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><code>removeAllListeners()</code></h3>
-<pre><code class="hljs css languages- javascript">removeAllListeners();
+<pre><code class="hljs css language-javascript">removeAllListeners();
 </code></pre>
 <p>Remove all registered listeners.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="stopanimation"></a><a href="#stopanimation" 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><code>stopAnimation()</code></h3>
-<pre><code class="hljs css languages- javascript">stopAnimation([callback]);
+<pre><code class="hljs css language-javascript">stopAnimation([callback]);
 </code></pre>
 <p>Stops any running animation or tracking. <code>callback</code> is invoked with the final value after stopping the animation, which is useful for updating state to match the animation position with layout.</p>
 <p><strong>Parameters:</strong></p>
@@ -147,7 +147,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="resetanimation"></a><a href="#resetanimation" 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><code>resetAnimation()</code></h3>
-<pre><code class="hljs css languages- javascript">resetAnimation([callback]);
+<pre><code class="hljs css language-javascript">resetAnimation([callback]);
 </code></pre>
 <p>Stops any animation and resets the value to its original.</p>
 <p><strong>Parameters:</strong></p>
@@ -161,17 +161,17 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getlayout"></a><a href="#getlayout" 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><code>getLayout()</code></h3>
-<pre><code class="hljs css languages- javascript">getLayout();
+<pre><code class="hljs css language-javascript">getLayout();
 </code></pre>
 <p>Converts <code>{x, y}</code> into <code>{left, top}</code> for use in style, e.g.</p>
-<pre><code class="hljs css languages- javascript">style={<span class="hljs-keyword">this</span>.state.anim.getLayout()}
+<pre><code class="hljs css language-javascript">style={<span class="hljs-keyword">this</span>.state.anim.getLayout()}
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="gettranslatetransform"></a><a href="#gettranslatetransform" 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><code>getTranslateTransform()</code></h3>
-<pre><code class="hljs css languages- javascript">getTranslateTransform();
+<pre><code class="hljs css language-javascript">getTranslateTransform();
 </code></pre>
 <p>Converts <code>{x, y}</code> into a useable translation transform, e.g.</p>
-<pre><code class="hljs css languages- javascript">style={{
+<pre><code class="hljs css language-javascript">style={{
   <span class="hljs-attr">transform</span>: <span class="hljs-keyword">this</span>.state.anim.getTranslateTransform()
 }}
 </code></pre>

docs/0.10/animatedvaluexy/index.html

@@ -9,7 +9,7 @@
             </script><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png" alt="React Native"/><h2 class="headerTitleWithLogo">React Native</h2></a><a href="/react-native/versions"><h3>0.10</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/react-native/docs/0.10/getting-started" target="_self">Docs</a></li><li class=""><a href="/react-native/en/help" target="_self">Community</a></li><li class=""><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li><li class=""><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li class=""><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/docs/animatedvaluexy.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">AnimatedValueXY</h1></header><article><div><span><p>2D Value for driving 2D animations, such as pan gestures. Almost identical API to normal <a href="/react-native/docs/0.10/animatedvalue"><code>Animated.Value</code></a>, but multiplexed. Contains two regular <code>Animated.Value</code>s under the hood.</p>
 <p>See also <a href="/react-native/docs/0.10/animated"><code>Animated</code></a>.</p>
 <h2><a class="anchor" aria-hidden="true" id="example"></a><a href="#example" 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>Example</h2>
-<pre><code class="hljs css languages- javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">DraggableView</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span> </span>{
+<pre><code class="hljs css language-javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">DraggableView</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span> </span>{
   <span class="hljs-keyword">constructor</span>(props) {
     <span class="hljs-keyword">super</span>(props);
     <span class="hljs-keyword">this</span>.state = {
@@ -61,7 +61,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="setvalue"></a><a href="#setvalue" 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><code>setValue()</code></h3>
-<pre><code class="hljs css languages- javascript">setValue(value);
+<pre><code class="hljs css language-javascript">setValue(value);
 </code></pre>
 <p>Directly set the value. This will stop any animations running on the value and update all the bound properties.</p>
 <p><strong>Parameters:</strong></p>
@@ -75,7 +75,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="setoffset"></a><a href="#setoffset" 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><code>setOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">setOffset(offset);
+<pre><code class="hljs css language-javascript">setOffset(offset);
 </code></pre>
 <p>Sets an offset that is applied on top of whatever value is set, whether via <code>setValue</code>, an animation, or <code>Animated.event</code>. Useful for compensating things like the start of a pan gesture.</p>
 <p><strong>Parameters:</strong></p>
@@ -89,17 +89,17 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="flattenoffset"></a><a href="#flattenoffset" 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><code>flattenOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">flattenOffset();
+<pre><code class="hljs css language-javascript">flattenOffset();
 </code></pre>
 <p>Merges the offset value into the base value and resets the offset to zero. The final output of the value is unchanged.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="extractoffset"></a><a href="#extractoffset" 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><code>extractOffset()</code></h3>
-<pre><code class="hljs css languages- javascript">extractOffset();
+<pre><code class="hljs css language-javascript">extractOffset();
 </code></pre>
 <p>Sets the offset value to the base value, and resets the base value to zero. The final output of the value is unchanged.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="addlistener"></a><a href="#addlistener" 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><code>addListener()</code></h3>
-<pre><code class="hljs css languages- javascript">addListener(callback);
+<pre><code class="hljs css language-javascript">addListener(callback);
 </code></pre>
 <p>Adds an asynchronous listener to the value so you can observe updates from animations. This is useful because there is no way to synchronously read the value because it might be driven natively.</p>
 <p>Returns a string that serves as an identifier for the listener.</p>
@@ -114,7 +114,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removelistener"></a><a href="#removelistener" 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><code>removeListener()</code></h3>
-<pre><code class="hljs css languages- javascript">removeListener(id);
+<pre><code class="hljs css language-javascript">removeListener(id);
 </code></pre>
 <p>Unregister a listener. The <code>id</code> param shall match the identifier previously returned by <code>addListener()</code>.</p>
 <p><strong>Parameters:</strong></p>
@@ -128,12 +128,12 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removealllisteners"></a><a href="#removealllisteners" 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><code>removeAllListeners()</code></h3>
-<pre><code class="hljs css languages- javascript">removeAllListeners();
+<pre><code class="hljs css language-javascript">removeAllListeners();
 </code></pre>
 <p>Remove all registered listeners.</p>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="stopanimation"></a><a href="#stopanimation" 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><code>stopAnimation()</code></h3>
-<pre><code class="hljs css languages- javascript">stopAnimation([callback]);
+<pre><code class="hljs css language-javascript">stopAnimation([callback]);
 </code></pre>
 <p>Stops any running animation or tracking. <code>callback</code> is invoked with the final value after stopping the animation, which is useful for updating state to match the animation position with layout.</p>
 <p><strong>Parameters:</strong></p>
@@ -147,7 +147,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="resetanimation"></a><a href="#resetanimation" 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><code>resetAnimation()</code></h3>
-<pre><code class="hljs css languages- javascript">resetAnimation([callback]);
+<pre><code class="hljs css language-javascript">resetAnimation([callback]);
 </code></pre>
 <p>Stops any animation and resets the value to its original.</p>
 <p><strong>Parameters:</strong></p>
@@ -161,17 +161,17 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getlayout"></a><a href="#getlayout" 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><code>getLayout()</code></h3>
-<pre><code class="hljs css languages- javascript">getLayout();
+<pre><code class="hljs css language-javascript">getLayout();
 </code></pre>
 <p>Converts <code>{x, y}</code> into <code>{left, top}</code> for use in style, e.g.</p>
-<pre><code class="hljs css languages- javascript">style={<span class="hljs-keyword">this</span>.state.anim.getLayout()}
+<pre><code class="hljs css language-javascript">style={<span class="hljs-keyword">this</span>.state.anim.getLayout()}
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="gettranslatetransform"></a><a href="#gettranslatetransform" 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><code>getTranslateTransform()</code></h3>
-<pre><code class="hljs css languages- javascript">getTranslateTransform();
+<pre><code class="hljs css language-javascript">getTranslateTransform();
 </code></pre>
 <p>Converts <code>{x, y}</code> into a useable translation transform, e.g.</p>
-<pre><code class="hljs css languages- javascript">style={{
+<pre><code class="hljs css language-javascript">style={{
   <span class="hljs-attr">transform</span>: <span class="hljs-keyword">this</span>.state.anim.getTranslateTransform()
 }}
 </code></pre>

docs/0.10/animations.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -105,7 +109,7 @@ Because the entire configuration is declarative, we will be able to implement fu
 <p><code>Animated</code> provides several animation types, the most commonly used one being <a href="/react-native/docs/0.10/animated#timing"><code>Animated.timing()</code></a>. It supports animating a value over time using one of various predefined easing functions, or you can use your own. Easing functions are typically used in animation to convey gradual acceleration and deceleration of objects.</p>
 <p>By default, <code>timing</code> will use a easeInOut curve that conveys gradual acceleration to full speed and concludes by gradually decelerating to a stop. You can specify a different easing function by passing a <code>easing</code> parameter. Custom <code>duration</code> or even a <code>delay</code> before the animation starts is also supported.</p>
 <p>For example, if we want to create a 2-second long animation of an object that slightly backs up before moving to its final position:</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.xPosition, {
+<pre><code class="hljs css language-javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.xPosition, {
   <span class="hljs-attr">toValue</span>: <span class="hljs-number">100</span>,
   <span class="hljs-attr">easing</span>: Easing.back(),
   <span class="hljs-attr">duration</span>: <span class="hljs-number">2000</span>,
@@ -115,7 +119,7 @@ Because the entire configuration is declarative, we will be able to implement fu
 <h3><a class="anchor" aria-hidden="true" id="composing-animations"></a><a href="#composing-animations" 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>Composing animations</h3>
 <p>Animations can be combined and played in sequence or in parallel. Sequential animations can play immediately after the previous animation has finished, or they can start after a specified delay. The <code>Animated</code> API provides several methods, such as <code>sequence()</code> and <code>delay()</code>, each of which simply take an array of animations to execute and automatically calls <code>start()</code>/<code>stop()</code> as needed.</p>
 <p>For example, the following animation coasts to a stop, then it springs back while twirling in parallel:</p>
-<pre><code class="hljs css languages- javascript">Animated.sequence([
+<pre><code class="hljs css language-javascript">Animated.sequence([
   <span class="hljs-comment">// decay, then spring to start and twirl</span>
   Animated.decay(position, {
     <span class="hljs-comment">// coast to a stop</span>
@@ -139,7 +143,7 @@ Because the entire configuration is declarative, we will be able to implement fu
 <h3><a class="anchor" aria-hidden="true" id="combining-animated-values"></a><a href="#combining-animated-values" 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>Combining animated values</h3>
 <p>You can <a href="/react-native/docs/0.10/animated#combining-animated-values">combine two animated values</a> via addition, multiplication, division, or modulo to make a new animated value.</p>
 <p>There are some cases where an animated value needs to invert another animated value for calculation. An example is inverting a scale (2x --&gt; 0.5x):</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> a = <span class="hljs-keyword">new</span> Animated.Value(<span class="hljs-number">1</span>);
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> a = <span class="hljs-keyword">new</span> Animated.Value(<span class="hljs-number">1</span>);
 <span class="hljs-keyword">const</span> b = Animated.divide(<span class="hljs-number">1</span>, a);
 
 Animated.spring(a, {
@@ -149,13 +153,13 @@ Animated.spring(a, {
 <h3><a class="anchor" aria-hidden="true" id="interpolation"></a><a href="#interpolation" 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>Interpolation</h3>
 <p>Each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.</p>
 <p>A simple mapping to convert a 0-1 range to a 0-100 range would be:</p>
-<pre><code class="hljs css languages- javascript">value.interpolate({
+<pre><code class="hljs css language-javascript">value.interpolate({
   <span class="hljs-attr">inputRange</span>: [<span class="hljs-number">0</span>, <span class="hljs-number">1</span>],
   <span class="hljs-attr">outputRange</span>: [<span class="hljs-number">0</span>, <span class="hljs-number">100</span>],
 });
 </code></pre>
 <p>For example, you may want to think about your <code>Animated.Value</code> as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to 1. This can easily be done by modifying <code>style</code> from the example above like so:</p>
-<pre><code class="hljs css languages- javascript">  style={{
+<pre><code class="hljs css language-javascript">  style={{
     <span class="hljs-attr">opacity</span>: <span class="hljs-keyword">this</span>.state.fadeAnim, <span class="hljs-comment">// Binds directly</span>
     transform: [{
       <span class="hljs-attr">translateY</span>: <span class="hljs-keyword">this</span>.state.fadeAnim.interpolate({
@@ -166,7 +170,7 @@ Animated.spring(a, {
   }}
 </code></pre>
 <p><a href="/react-native/docs/0.10/animated#interpolate"><code>interpolate()</code></a> supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get an negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do:</p>
-<pre><code class="hljs css languages- javascript">value.interpolate({
+<pre><code class="hljs css language-javascript">value.interpolate({
   <span class="hljs-attr">inputRange</span>: [<span class="hljs-number">-300</span>, <span class="hljs-number">-100</span>, <span class="hljs-number">0</span>, <span class="hljs-number">100</span>, <span class="hljs-number">101</span>],
   <span class="hljs-attr">outputRange</span>: [<span class="hljs-number">300</span>, <span class="hljs-number">0</span>, <span class="hljs-number">1</span>, <span class="hljs-number">0</span>, <span class="hljs-number">0</span>],
 });
@@ -186,7 +190,7 @@ Animated.spring(a, {
    <span class="hljs-number">200</span>|      <span class="hljs-number">0</span>
 </code></pre>
 <p><code>interpolate()</code> also supports mapping to strings, allowing you to animate colors as well as values with units. For example, if you wanted to animate a rotation you could do:</p>
-<pre><code class="hljs css languages- javascript">value.interpolate({
+<pre><code class="hljs css language-javascript">value.interpolate({
   <span class="hljs-attr">inputRange</span>: [<span class="hljs-number">0</span>, <span class="hljs-number">360</span>],
   <span class="hljs-attr">outputRange</span>: [<span class="hljs-string">'0deg'</span>, <span class="hljs-string">'360deg'</span>],
 });
@@ -194,7 +198,7 @@ Animated.spring(a, {
 <p><code>interpolate()</code> also supports arbitrary easing functions, many of which are already implemented in the <a href="/react-native/docs/0.10/easing"><code>Easing</code></a> module. <code>interpolate()</code> also has configurable behavior for extrapolating the <code>outputRange</code>. You can set the extrapolation by setting the <code>extrapolate</code>, <code>extrapolateLeft</code>, or <code>extrapolateRight</code> options. The default value is <code>extend</code> but you can use <code>clamp</code> to prevent the output value from exceeding <code>outputRange</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="tracking-dynamic-values"></a><a href="#tracking-dynamic-values" 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>Tracking dynamic values</h3>
 <p>Animated values can also track other values. Just set the <code>toValue</code> of an animation to another animated value instead of a plain number. For example, a &quot;Chat Heads&quot; animation like the one used by Messenger on Android could be implemented with a <code>spring()</code> pinned on another animated value, or with <code>timing()</code> and a <code>duration</code> of 0 for rigid tracking. They can also be composed with interpolations:</p>
-<pre><code class="hljs css languages- javascript">Animated.spring(follower, {<span class="hljs-attr">toValue</span>: leader}).start();
+<pre><code class="hljs css language-javascript">Animated.spring(follower, {<span class="hljs-attr">toValue</span>: leader}).start();
 Animated.timing(opacity, {
   <span class="hljs-attr">toValue</span>: pan.x.interpolate({
     <span class="hljs-attr">inputRange</span>: [<span class="hljs-number">0</span>, <span class="hljs-number">300</span>],
@@ -206,7 +210,7 @@ Animated.timing(opacity, {
 <h3><a class="anchor" aria-hidden="true" id="tracking-gestures"></a><a href="#tracking-gestures" 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>Tracking gestures</h3>
 <p>Gestures, like panning or scrolling, and other events can map directly to animated values using <a href="/react-native/docs/0.10/animated#event"><code>Animated.event</code></a>. This is done with a structured map syntax so that values can be extracted from complex event objects. The first level is an array to allow mapping across multiple args, and that array contains nested objects.</p>
 <p>For example, when working with horizontal scrolling gestures, you would do the following in order to map <code>event.nativeEvent.contentOffset.x</code> to <code>scrollX</code> (an <code>Animated.Value</code>):</p>
-<pre><code class="hljs css languages- javascript"> onScroll={Animated.event(
+<pre><code class="hljs css language-javascript"> onScroll={Animated.event(
    <span class="hljs-comment">// scrollX = e.nativeEvent.contentOffset.x</span>
    [{ <span class="hljs-attr">nativeEvent</span>: {
         <span class="hljs-attr">contentOffset</span>: {
@@ -217,7 +221,7 @@ Animated.timing(opacity, {
  )}
 </code></pre>
 <p>When using <code>PanResponder</code>, you could use the following code to extract the x and y positions from <code>gestureState.dx</code> and <code>gestureState.dy</code>. We use a <code>null</code> in the first position of the array, as we are only interested in the second argument passed to the <code>PanResponder</code> handler, which is the <code>gestureState</code>.</p>
-<pre><code class="hljs css languages- javascript">onPanResponderMove={Animated.event(
+<pre><code class="hljs css language-javascript">onPanResponderMove={Animated.event(
   [<span class="hljs-literal">null</span>, <span class="hljs-comment">// ignore the native event</span>
   <span class="hljs-comment">// extract dx and dy from gestureState</span>
   <span class="hljs-comment">// like 'pan.x = gestureState.dx, pan.y = gestureState.dy'</span>
@@ -234,7 +238,7 @@ Animated.timing(opacity, {
 <h3><a class="anchor" aria-hidden="true" id="using-the-native-driver"></a><a href="#using-the-native-driver" 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>Using the native driver</h3>
 <p>The <code>Animated</code> API is designed to be serializable. By using the <a href="http://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated.html">native driver</a>, we send everything about the animation to native before starting the animation, allowing native code to perform the animation on the UI thread without having to go through the bridge on every frame. Once the animation has started, the JS thread can be blocked without affecting the animation.</p>
 <p>Using the native driver for normal animations is quite simple. Just add <code>useNativeDriver: true</code> to the animation config when starting it.</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.animatedValue, {
+<pre><code class="hljs css language-javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.animatedValue, {
   <span class="hljs-attr">toValue</span>: <span class="hljs-number">1</span>,
   <span class="hljs-attr">duration</span>: <span class="hljs-number">500</span>,
   <span class="hljs-attr">useNativeDriver</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">// &lt;-- Add this</span>
@@ -242,7 +246,7 @@ Animated.timing(opacity, {
 </code></pre>
 <p>Animated values are only compatible with one driver so if you use native driver when starting an animation on a value, make sure every animation on that value also uses the native driver.</p>
 <p>The native driver also works with <code>Animated.event</code>. This is specially useful for animations that follow the scroll position as without the native driver, the animation will always run a frame behind the gesture due to the async nature of React Native.</p>
-<pre><code class="hljs css languages- javascript">&lt;Animated.ScrollView // &lt;-- Use the Animated ScrollView wrapper
+<pre><code class="hljs css language-javascript">&lt;Animated.ScrollView // &lt;-- Use the Animated ScrollView wrapper
   scrollEventThrottle={1} // &lt;-- Use 1 here to make sure no events are ever missed
   onScroll={Animated.event(
     [
@@ -263,7 +267,7 @@ Animated.timing(opacity, {
 <p>When an animation is running, it can prevent <code>VirtualizedList</code> components from rendering more rows. If you need to run a long or looping animation while the user is scrolling through a list, you can use <code>isInteraction: false</code> in your animation's config to prevent this issue.</p>
 <h3><a class="anchor" aria-hidden="true" id="bear-in-mind"></a><a href="#bear-in-mind" 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>Bear in mind</h3>
 <p>While using transform styles such as <code>rotateY</code>, <code>rotateX</code>, and others ensure the transform style <code>perspective</code> is in place. At this time some animations may not render on Android without it. Example below.</p>
-<pre><code class="hljs css languages- javascript">&lt;Animated.View
+<pre><code class="hljs css language-javascript">&lt;Animated.View
   style={{
     <span class="hljs-attr">transform</span>: [
       {<span class="hljs-attr">scale</span>: <span class="hljs-keyword">this</span>.state.scale},
@@ -283,7 +287,7 @@ Animated.timing(opacity, {
 <p><code>LayoutAnimation</code> allows you to globally configure <code>create</code> and <code>update</code> animations that will be used for all views in the next render/layout cycle. This is useful for doing flexbox layout updates without bothering to measure or calculate specific properties in order to animate them directly, and is especially useful when layout changes may affect ancestors, for example a &quot;see more&quot; expansion that also increases the size of the parent and pushes down the row below which would otherwise require explicit coordination between the components in order to animate them all in sync.</p>
 <p>Note that although <code>LayoutAnimation</code> is very powerful and can be quite useful, it provides much less control than <code>Animated</code> and other animation libraries, so you may need to use another approach if you can't get <code>LayoutAnimation</code> to do what you want.</p>
 <p>Note that in order to get this to work on <strong>Android</strong> you need to set the following flags via <code>UIManager</code>:</p>
-<pre><code class="hljs css languages- javascript">UIManager.setLayoutAnimationEnabledExperimental &amp;&amp;
+<pre><code class="hljs css language-javascript">UIManager.setLayoutAnimationEnabledExperimental &amp;&amp;
   UIManager.setLayoutAnimationEnabledExperimental(<span class="hljs-literal">true</span>);
 </code></pre>
 <div class="snack-player"><div class="mobile-friendly-snack" style="display: none"><pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;

docs/0.10/animations/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 
@@ -105,7 +109,7 @@ Because the entire configuration is declarative, we will be able to implement fu
 <p><code>Animated</code> provides several animation types, the most commonly used one being <a href="/react-native/docs/0.10/animated#timing"><code>Animated.timing()</code></a>. It supports animating a value over time using one of various predefined easing functions, or you can use your own. Easing functions are typically used in animation to convey gradual acceleration and deceleration of objects.</p>
 <p>By default, <code>timing</code> will use a easeInOut curve that conveys gradual acceleration to full speed and concludes by gradually decelerating to a stop. You can specify a different easing function by passing a <code>easing</code> parameter. Custom <code>duration</code> or even a <code>delay</code> before the animation starts is also supported.</p>
 <p>For example, if we want to create a 2-second long animation of an object that slightly backs up before moving to its final position:</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.xPosition, {
+<pre><code class="hljs css language-javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.xPosition, {
   <span class="hljs-attr">toValue</span>: <span class="hljs-number">100</span>,
   <span class="hljs-attr">easing</span>: Easing.back(),
   <span class="hljs-attr">duration</span>: <span class="hljs-number">2000</span>,
@@ -115,7 +119,7 @@ Because the entire configuration is declarative, we will be able to implement fu
 <h3><a class="anchor" aria-hidden="true" id="composing-animations"></a><a href="#composing-animations" 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>Composing animations</h3>
 <p>Animations can be combined and played in sequence or in parallel. Sequential animations can play immediately after the previous animation has finished, or they can start after a specified delay. The <code>Animated</code> API provides several methods, such as <code>sequence()</code> and <code>delay()</code>, each of which simply take an array of animations to execute and automatically calls <code>start()</code>/<code>stop()</code> as needed.</p>
 <p>For example, the following animation coasts to a stop, then it springs back while twirling in parallel:</p>
-<pre><code class="hljs css languages- javascript">Animated.sequence([
+<pre><code class="hljs css language-javascript">Animated.sequence([
   <span class="hljs-comment">// decay, then spring to start and twirl</span>
   Animated.decay(position, {
     <span class="hljs-comment">// coast to a stop</span>
@@ -139,7 +143,7 @@ Because the entire configuration is declarative, we will be able to implement fu
 <h3><a class="anchor" aria-hidden="true" id="combining-animated-values"></a><a href="#combining-animated-values" 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>Combining animated values</h3>
 <p>You can <a href="/react-native/docs/0.10/animated#combining-animated-values">combine two animated values</a> via addition, multiplication, division, or modulo to make a new animated value.</p>
 <p>There are some cases where an animated value needs to invert another animated value for calculation. An example is inverting a scale (2x --&gt; 0.5x):</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">const</span> a = <span class="hljs-keyword">new</span> Animated.Value(<span class="hljs-number">1</span>);
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> a = <span class="hljs-keyword">new</span> Animated.Value(<span class="hljs-number">1</span>);
 <span class="hljs-keyword">const</span> b = Animated.divide(<span class="hljs-number">1</span>, a);
 
 Animated.spring(a, {
@@ -149,13 +153,13 @@ Animated.spring(a, {
 <h3><a class="anchor" aria-hidden="true" id="interpolation"></a><a href="#interpolation" 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>Interpolation</h3>
 <p>Each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.</p>
 <p>A simple mapping to convert a 0-1 range to a 0-100 range would be:</p>
-<pre><code class="hljs css languages- javascript">value.interpolate({
+<pre><code class="hljs css language-javascript">value.interpolate({
   <span class="hljs-attr">inputRange</span>: [<span class="hljs-number">0</span>, <span class="hljs-number">1</span>],
   <span class="hljs-attr">outputRange</span>: [<span class="hljs-number">0</span>, <span class="hljs-number">100</span>],
 });
 </code></pre>
 <p>For example, you may want to think about your <code>Animated.Value</code> as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to 1. This can easily be done by modifying <code>style</code> from the example above like so:</p>
-<pre><code class="hljs css languages- javascript">  style={{
+<pre><code class="hljs css language-javascript">  style={{
     <span class="hljs-attr">opacity</span>: <span class="hljs-keyword">this</span>.state.fadeAnim, <span class="hljs-comment">// Binds directly</span>
     transform: [{
       <span class="hljs-attr">translateY</span>: <span class="hljs-keyword">this</span>.state.fadeAnim.interpolate({
@@ -166,7 +170,7 @@ Animated.spring(a, {
   }}
 </code></pre>
 <p><a href="/react-native/docs/0.10/animated#interpolate"><code>interpolate()</code></a> supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get an negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do:</p>
-<pre><code class="hljs css languages- javascript">value.interpolate({
+<pre><code class="hljs css language-javascript">value.interpolate({
   <span class="hljs-attr">inputRange</span>: [<span class="hljs-number">-300</span>, <span class="hljs-number">-100</span>, <span class="hljs-number">0</span>, <span class="hljs-number">100</span>, <span class="hljs-number">101</span>],
   <span class="hljs-attr">outputRange</span>: [<span class="hljs-number">300</span>, <span class="hljs-number">0</span>, <span class="hljs-number">1</span>, <span class="hljs-number">0</span>, <span class="hljs-number">0</span>],
 });
@@ -186,7 +190,7 @@ Animated.spring(a, {
    <span class="hljs-number">200</span>|      <span class="hljs-number">0</span>
 </code></pre>
 <p><code>interpolate()</code> also supports mapping to strings, allowing you to animate colors as well as values with units. For example, if you wanted to animate a rotation you could do:</p>
-<pre><code class="hljs css languages- javascript">value.interpolate({
+<pre><code class="hljs css language-javascript">value.interpolate({
   <span class="hljs-attr">inputRange</span>: [<span class="hljs-number">0</span>, <span class="hljs-number">360</span>],
   <span class="hljs-attr">outputRange</span>: [<span class="hljs-string">'0deg'</span>, <span class="hljs-string">'360deg'</span>],
 });
@@ -194,7 +198,7 @@ Animated.spring(a, {
 <p><code>interpolate()</code> also supports arbitrary easing functions, many of which are already implemented in the <a href="/react-native/docs/0.10/easing"><code>Easing</code></a> module. <code>interpolate()</code> also has configurable behavior for extrapolating the <code>outputRange</code>. You can set the extrapolation by setting the <code>extrapolate</code>, <code>extrapolateLeft</code>, or <code>extrapolateRight</code> options. The default value is <code>extend</code> but you can use <code>clamp</code> to prevent the output value from exceeding <code>outputRange</code>.</p>
 <h3><a class="anchor" aria-hidden="true" id="tracking-dynamic-values"></a><a href="#tracking-dynamic-values" 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>Tracking dynamic values</h3>
 <p>Animated values can also track other values. Just set the <code>toValue</code> of an animation to another animated value instead of a plain number. For example, a &quot;Chat Heads&quot; animation like the one used by Messenger on Android could be implemented with a <code>spring()</code> pinned on another animated value, or with <code>timing()</code> and a <code>duration</code> of 0 for rigid tracking. They can also be composed with interpolations:</p>
-<pre><code class="hljs css languages- javascript">Animated.spring(follower, {<span class="hljs-attr">toValue</span>: leader}).start();
+<pre><code class="hljs css language-javascript">Animated.spring(follower, {<span class="hljs-attr">toValue</span>: leader}).start();
 Animated.timing(opacity, {
   <span class="hljs-attr">toValue</span>: pan.x.interpolate({
     <span class="hljs-attr">inputRange</span>: [<span class="hljs-number">0</span>, <span class="hljs-number">300</span>],
@@ -206,7 +210,7 @@ Animated.timing(opacity, {
 <h3><a class="anchor" aria-hidden="true" id="tracking-gestures"></a><a href="#tracking-gestures" 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>Tracking gestures</h3>
 <p>Gestures, like panning or scrolling, and other events can map directly to animated values using <a href="/react-native/docs/0.10/animated#event"><code>Animated.event</code></a>. This is done with a structured map syntax so that values can be extracted from complex event objects. The first level is an array to allow mapping across multiple args, and that array contains nested objects.</p>
 <p>For example, when working with horizontal scrolling gestures, you would do the following in order to map <code>event.nativeEvent.contentOffset.x</code> to <code>scrollX</code> (an <code>Animated.Value</code>):</p>
-<pre><code class="hljs css languages- javascript"> onScroll={Animated.event(
+<pre><code class="hljs css language-javascript"> onScroll={Animated.event(
    <span class="hljs-comment">// scrollX = e.nativeEvent.contentOffset.x</span>
    [{ <span class="hljs-attr">nativeEvent</span>: {
         <span class="hljs-attr">contentOffset</span>: {
@@ -217,7 +221,7 @@ Animated.timing(opacity, {
  )}
 </code></pre>
 <p>When using <code>PanResponder</code>, you could use the following code to extract the x and y positions from <code>gestureState.dx</code> and <code>gestureState.dy</code>. We use a <code>null</code> in the first position of the array, as we are only interested in the second argument passed to the <code>PanResponder</code> handler, which is the <code>gestureState</code>.</p>
-<pre><code class="hljs css languages- javascript">onPanResponderMove={Animated.event(
+<pre><code class="hljs css language-javascript">onPanResponderMove={Animated.event(
   [<span class="hljs-literal">null</span>, <span class="hljs-comment">// ignore the native event</span>
   <span class="hljs-comment">// extract dx and dy from gestureState</span>
   <span class="hljs-comment">// like 'pan.x = gestureState.dx, pan.y = gestureState.dy'</span>
@@ -234,7 +238,7 @@ Animated.timing(opacity, {
 <h3><a class="anchor" aria-hidden="true" id="using-the-native-driver"></a><a href="#using-the-native-driver" 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>Using the native driver</h3>
 <p>The <code>Animated</code> API is designed to be serializable. By using the <a href="http://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated.html">native driver</a>, we send everything about the animation to native before starting the animation, allowing native code to perform the animation on the UI thread without having to go through the bridge on every frame. Once the animation has started, the JS thread can be blocked without affecting the animation.</p>
 <p>Using the native driver for normal animations is quite simple. Just add <code>useNativeDriver: true</code> to the animation config when starting it.</p>
-<pre><code class="hljs css languages- javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.animatedValue, {
+<pre><code class="hljs css language-javascript">Animated.timing(<span class="hljs-keyword">this</span>.state.animatedValue, {
   <span class="hljs-attr">toValue</span>: <span class="hljs-number">1</span>,
   <span class="hljs-attr">duration</span>: <span class="hljs-number">500</span>,
   <span class="hljs-attr">useNativeDriver</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">// &lt;-- Add this</span>
@@ -242,7 +246,7 @@ Animated.timing(opacity, {
 </code></pre>
 <p>Animated values are only compatible with one driver so if you use native driver when starting an animation on a value, make sure every animation on that value also uses the native driver.</p>
 <p>The native driver also works with <code>Animated.event</code>. This is specially useful for animations that follow the scroll position as without the native driver, the animation will always run a frame behind the gesture due to the async nature of React Native.</p>
-<pre><code class="hljs css languages- javascript">&lt;Animated.ScrollView // &lt;-- Use the Animated ScrollView wrapper
+<pre><code class="hljs css language-javascript">&lt;Animated.ScrollView // &lt;-- Use the Animated ScrollView wrapper
   scrollEventThrottle={1} // &lt;-- Use 1 here to make sure no events are ever missed
   onScroll={Animated.event(
     [
@@ -263,7 +267,7 @@ Animated.timing(opacity, {
 <p>When an animation is running, it can prevent <code>VirtualizedList</code> components from rendering more rows. If you need to run a long or looping animation while the user is scrolling through a list, you can use <code>isInteraction: false</code> in your animation's config to prevent this issue.</p>
 <h3><a class="anchor" aria-hidden="true" id="bear-in-mind"></a><a href="#bear-in-mind" 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>Bear in mind</h3>
 <p>While using transform styles such as <code>rotateY</code>, <code>rotateX</code>, and others ensure the transform style <code>perspective</code> is in place. At this time some animations may not render on Android without it. Example below.</p>
-<pre><code class="hljs css languages- javascript">&lt;Animated.View
+<pre><code class="hljs css language-javascript">&lt;Animated.View
   style={{
     <span class="hljs-attr">transform</span>: [
       {<span class="hljs-attr">scale</span>: <span class="hljs-keyword">this</span>.state.scale},
@@ -283,7 +287,7 @@ Animated.timing(opacity, {
 <p><code>LayoutAnimation</code> allows you to globally configure <code>create</code> and <code>update</code> animations that will be used for all views in the next render/layout cycle. This is useful for doing flexbox layout updates without bothering to measure or calculate specific properties in order to animate them directly, and is especially useful when layout changes may affect ancestors, for example a &quot;see more&quot; expansion that also increases the size of the parent and pushes down the row below which would otherwise require explicit coordination between the components in order to animate them all in sync.</p>
 <p>Note that although <code>LayoutAnimation</code> is very powerful and can be quite useful, it provides much less control than <code>Animated</code> and other animation libraries, so you may need to use another approach if you can't get <code>LayoutAnimation</code> to do what you want.</p>
 <p>Note that in order to get this to work on <strong>Android</strong> you need to set the following flags via <code>UIManager</code>:</p>
-<pre><code class="hljs css languages- javascript">UIManager.setLayoutAnimationEnabledExperimental &amp;&amp;
+<pre><code class="hljs css language-javascript">UIManager.setLayoutAnimationEnabledExperimental &amp;&amp;
   UIManager.setLayoutAnimationEnabledExperimental(<span class="hljs-literal">true</span>);
 </code></pre>
 <div class="snack-player"><div class="mobile-friendly-snack" style="display: none"><pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;

docs/0.10/app-extensions.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 

docs/0.10/app-extensions/index.html

@@ -22,6 +22,10 @@
                 var toggler = document.querySelector(togglerSelector);
                 var target = document.querySelector(targetSelector);
 
+                if (!toggler) {
+                  return;
+                }
+
                 toggler.onclick = function(event) {
                   event.preventDefault();
 

docs/0.10/appregistry.html

@@ -37,7 +37,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="registercomponent"></a><a href="#registercomponent" 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><code>registerComponent()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerComponent(appKey, componentProvider, [section]);
+<pre><code class="hljs css language-javascript">AppRegistry.registerComponent(appKey, componentProvider, [section]);
 </code></pre>
 <p>Registers an app's root component.</p>
 <p><strong>Parameters:</strong></p>
@@ -53,7 +53,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="runapplication"></a><a href="#runapplication" 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><code>runApplication()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.runApplication(appKey, appParameters);
+<pre><code class="hljs css language-javascript">AppRegistry.runApplication(appKey, appParameters);
 </code></pre>
 <p>Loads the JavaScript bundle and runs the app.</p>
 <p><strong>Parameters:</strong></p>
@@ -68,7 +68,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="unmountapplicationcomponentatroottag"></a><a href="#unmountapplicationcomponentatroottag" 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><code>unmountApplicationComponentAtRootTag()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.unmountApplicationComponentAtRootTag(rootTag);
+<pre><code class="hljs css language-javascript">AppRegistry.unmountApplicationComponentAtRootTag(rootTag);
 </code></pre>
 <p>Stops an application when a view should be destroyed. The <code>rootTag</code> should match the tag that was passed into <code>runApplication()</code>. These should always be used as a pair.</p>
 <p><strong>Parameters:</strong></p>
@@ -82,7 +82,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="registerheadlesstask"></a><a href="#registerheadlesstask" 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><code>registerHeadlessTask()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerHeadlessTask(taskKey, task);
+<pre><code class="hljs css language-javascript">AppRegistry.registerHeadlessTask(taskKey, task);
 </code></pre>
 <p>Register a headless task. A headless task is a bit of code that runs without a UI.</p>
 <p><strong>Parameters:</strong></p>
@@ -97,7 +97,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="startheadlesstask"></a><a href="#startheadlesstask" 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><code>startHeadlessTask()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.startHeadlessTask(taskId, taskKey, data);
+<pre><code class="hljs css language-javascript">AppRegistry.startHeadlessTask(taskId, taskKey, data);
 </code></pre>
 <p>Only called from native code. Starts a headless task.</p>
 <p><strong>Parameters:</strong></p>
@@ -113,43 +113,43 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="setwrappercomponentprovider"></a><a href="#setwrappercomponentprovider" 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><code>setWrapperComponentProvider()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.setWrapperComponentProvider(provider);
+<pre><code class="hljs css language-javascript">AppRegistry.setWrapperComponentProvider(provider);
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="registerconfig"></a><a href="#registerconfig" 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><code>registerConfig()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerConfig(config);
+<pre><code class="hljs css language-javascript">AppRegistry.registerConfig(config);
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="registerrunnable"></a><a href="#registerrunnable" 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><code>registerRunnable()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerRunnable(appKey, run);
+<pre><code class="hljs css language-javascript">AppRegistry.registerRunnable(appKey, run);
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="registersection"></a><a href="#registersection" 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><code>registerSection()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerSection(appKey, component);
+<pre><code class="hljs css language-javascript">AppRegistry.registerSection(appKey, component);
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getappkeys"></a><a href="#getappkeys" 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><code>getAppKeys()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.getAppKeys();
+<pre><code class="hljs css language-javascript">AppRegistry.getAppKeys();
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getsectionkeys"></a><a href="#getsectionkeys" 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><code>getSectionKeys()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.getSectionKeys();
+<pre><code class="hljs css language-javascript">AppRegistry.getSectionKeys();
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getsections"></a><a href="#getsections" 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><code>getSections()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.getSections();
+<pre><code class="hljs css language-javascript">AppRegistry.getSections();
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getrunnable"></a><a href="#getrunnable" 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><code>getRunnable()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.getRunnable(appKey);
+<pre><code class="hljs css language-javascript">AppRegistry.getRunnable(appKey);
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getregistry"></a><a href="#getregistry" 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><code>getRegistry()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.getRegistry();
+<pre><code class="hljs css language-javascript">AppRegistry.getRegistry();
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="setcomponentproviderinstrumentationhook"></a><a href="#setcomponentproviderinstrumentationhook" 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><code>setComponentProviderInstrumentationHook()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.setComponentProviderInstrumentationHook(hook);
+<pre><code class="hljs css language-javascript">AppRegistry.setComponentProviderInstrumentationHook(hook);
 </code></pre>
 </span></div></article></div><div class="docs-prevnext"></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>

docs/0.10/appregistry/index.html

@@ -37,7 +37,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="registercomponent"></a><a href="#registercomponent" 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><code>registerComponent()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerComponent(appKey, componentProvider, [section]);
+<pre><code class="hljs css language-javascript">AppRegistry.registerComponent(appKey, componentProvider, [section]);
 </code></pre>
 <p>Registers an app's root component.</p>
 <p><strong>Parameters:</strong></p>
@@ -53,7 +53,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="runapplication"></a><a href="#runapplication" 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><code>runApplication()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.runApplication(appKey, appParameters);
+<pre><code class="hljs css language-javascript">AppRegistry.runApplication(appKey, appParameters);
 </code></pre>
 <p>Loads the JavaScript bundle and runs the app.</p>
 <p><strong>Parameters:</strong></p>
@@ -68,7 +68,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="unmountapplicationcomponentatroottag"></a><a href="#unmountapplicationcomponentatroottag" 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><code>unmountApplicationComponentAtRootTag()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.unmountApplicationComponentAtRootTag(rootTag);
+<pre><code class="hljs css language-javascript">AppRegistry.unmountApplicationComponentAtRootTag(rootTag);
 </code></pre>
 <p>Stops an application when a view should be destroyed. The <code>rootTag</code> should match the tag that was passed into <code>runApplication()</code>. These should always be used as a pair.</p>
 <p><strong>Parameters:</strong></p>
@@ -82,7 +82,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="registerheadlesstask"></a><a href="#registerheadlesstask" 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><code>registerHeadlessTask()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerHeadlessTask(taskKey, task);
+<pre><code class="hljs css language-javascript">AppRegistry.registerHeadlessTask(taskKey, task);
 </code></pre>
 <p>Register a headless task. A headless task is a bit of code that runs without a UI.</p>
 <p><strong>Parameters:</strong></p>
@@ -97,7 +97,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="startheadlesstask"></a><a href="#startheadlesstask" 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><code>startHeadlessTask()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.startHeadlessTask(taskId, taskKey, data);
+<pre><code class="hljs css language-javascript">AppRegistry.startHeadlessTask(taskId, taskKey, data);
 </code></pre>
 <p>Only called from native code. Starts a headless task.</p>
 <p><strong>Parameters:</strong></p>
@@ -113,43 +113,43 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="setwrappercomponentprovider"></a><a href="#setwrappercomponentprovider" 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><code>setWrapperComponentProvider()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.setWrapperComponentProvider(provider);
+<pre><code class="hljs css language-javascript">AppRegistry.setWrapperComponentProvider(provider);
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="registerconfig"></a><a href="#registerconfig" 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><code>registerConfig()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerConfig(config);
+<pre><code class="hljs css language-javascript">AppRegistry.registerConfig(config);
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="registerrunnable"></a><a href="#registerrunnable" 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><code>registerRunnable()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerRunnable(appKey, run);
+<pre><code class="hljs css language-javascript">AppRegistry.registerRunnable(appKey, run);
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="registersection"></a><a href="#registersection" 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><code>registerSection()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.registerSection(appKey, component);
+<pre><code class="hljs css language-javascript">AppRegistry.registerSection(appKey, component);
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getappkeys"></a><a href="#getappkeys" 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><code>getAppKeys()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.getAppKeys();
+<pre><code class="hljs css language-javascript">AppRegistry.getAppKeys();
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getsectionkeys"></a><a href="#getsectionkeys" 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><code>getSectionKeys()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.getSectionKeys();
+<pre><code class="hljs css language-javascript">AppRegistry.getSectionKeys();
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getsections"></a><a href="#getsections" 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><code>getSections()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.getSections();
+<pre><code class="hljs css language-javascript">AppRegistry.getSections();
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getrunnable"></a><a href="#getrunnable" 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><code>getRunnable()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.getRunnable(appKey);
+<pre><code class="hljs css language-javascript">AppRegistry.getRunnable(appKey);
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="getregistry"></a><a href="#getregistry" 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><code>getRegistry()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.getRegistry();
+<pre><code class="hljs css language-javascript">AppRegistry.getRegistry();
 </code></pre>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="setcomponentproviderinstrumentationhook"></a><a href="#setcomponentproviderinstrumentationhook" 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><code>setComponentProviderInstrumentationHook()</code></h3>
-<pre><code class="hljs css languages- javascript">AppRegistry.setComponentProviderInstrumentationHook(hook);
+<pre><code class="hljs css language-javascript">AppRegistry.setComponentProviderInstrumentationHook(hook);
 </code></pre>
 </span></div></article></div><div class="docs-prevnext"></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>

docs/0.10/appstate.html

@@ -17,7 +17,7 @@
 <p>For more information, see <a href="https://developer.apple.com/library/ios/documentation/iPhone/Conceptual/iPhoneOSProgrammingGuide/TheAppLifeCycle/TheAppLifeCycle.html">Apple's documentation</a>.</p>
 <h3><a class="anchor" aria-hidden="true" id="basic-usage"></a><a href="#basic-usage" 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>Basic Usage</h3>
 <p>To see the current state, you can check <code>AppState.currentState</code>, which will be kept up-to-date. However, <code>currentState</code> will be null at launch while <code>AppState</code> retrieves it over the bridge.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">import</span> React, {Component} <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">import</span> React, {Component} <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
 <span class="hljs-keyword">import</span> {AppState, Text} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
 
 <span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">AppStateExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">Component</span> </span>{
@@ -62,7 +62,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="addeventlistener"></a><a href="#addeventlistener" 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><code>addEventListener()</code></h3>
-<pre><code class="hljs css languages- javascript">addEventListener(type, handler);
+<pre><code class="hljs css language-javascript">addEventListener(type, handler);
 </code></pre>
 <p>Add a handler to AppState changes by listening to the <code>change</code> event type and providing the handler.</p>
 <p><strong>Parameters:</strong></p>
@@ -77,7 +77,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removeeventlistener"></a><a href="#removeeventlistener" 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><code>removeEventListener()</code></h3>
-<pre><code class="hljs css languages- javascript">removeEventListener(type, handler);
+<pre><code class="hljs css language-javascript">removeEventListener(type, handler);
 </code></pre>
 <p>Remove a handler by passing the <code>change</code> event type and the handler.</p>
 <p><strong>Parameters:</strong></p>
@@ -92,7 +92,7 @@
 </table>
 <h2><a class="anchor" aria-hidden="true" id="properties-1"></a><a href="#properties-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>Properties</h2>
 <h3><a class="anchor" aria-hidden="true" id="currentstate"></a><a href="#currentstate" 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><code>currentState</code></h3>
-<pre><code class="hljs css languages- javascript">AppState.currentState;
+<pre><code class="hljs css language-javascript">AppState.currentState;
 </code></pre>
 </span></div></article></div><div class="docs-prevnext"></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>

docs/0.10/appstate/index.html

@@ -17,7 +17,7 @@
 <p>For more information, see <a href="https://developer.apple.com/library/ios/documentation/iPhone/Conceptual/iPhoneOSProgrammingGuide/TheAppLifeCycle/TheAppLifeCycle.html">Apple's documentation</a>.</p>
 <h3><a class="anchor" aria-hidden="true" id="basic-usage"></a><a href="#basic-usage" 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>Basic Usage</h3>
 <p>To see the current state, you can check <code>AppState.currentState</code>, which will be kept up-to-date. However, <code>currentState</code> will be null at launch while <code>AppState</code> retrieves it over the bridge.</p>
-<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">import</span> React, {Component} <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
+<pre><code class="hljs css language-javascript"><span class="hljs-keyword">import</span> React, {Component} <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
 <span class="hljs-keyword">import</span> {AppState, Text} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
 
 <span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">AppStateExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">Component</span> </span>{
@@ -62,7 +62,7 @@
 <h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" 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>Reference</h1>
 <h2><a class="anchor" aria-hidden="true" id="methods-1"></a><a href="#methods-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>Methods</h2>
 <h3><a class="anchor" aria-hidden="true" id="addeventlistener"></a><a href="#addeventlistener" 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><code>addEventListener()</code></h3>
-<pre><code class="hljs css languages- javascript">addEventListener(type, handler);
+<pre><code class="hljs css language-javascript">addEventListener(type, handler);
 </code></pre>
 <p>Add a handler to AppState changes by listening to the <code>change</code> event type and providing the handler.</p>
 <p><strong>Parameters:</strong></p>
@@ -77,7 +77,7 @@
 </table>
 <hr>
 <h3><a class="anchor" aria-hidden="true" id="removeeventlistener"></a><a href="#removeeventlistener" 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><code>removeEventListener()</code></h3>
-<pre><code class="hljs css languages- javascript">removeEventListener(type, handler);
+<pre><code class="hljs css language-javascript">removeEventListener(type, handler);
 </code></pre>
 <p>Remove a handler by passing the <code>change</code> event type and the handler.</p>
 <p><strong>Parameters:</strong></p>
@@ -92,7 +92,7 @@
 </table>
 <h2><a class="anchor" aria-hidden="true" id="properties-1"></a><a href="#properties-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>Properties</h2>
 <h3><a class="anchor" aria-hidden="true" id="currentstate"></a><a href="#currentstate" 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><code>currentState</code></h3>
-<pre><code class="hljs css languages- javascript">AppState.currentState;
+<pre><code class="hljs css language-javascript">AppState.currentState;
 </code></pre>
 </span></div></article></div><div class="docs-prevnext"></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/react-native/" class="nav-home"><img src="/react-native/img/header_logo.png" alt="React Native" width="66" height="58"/></a><div><h5><a href="/react-native/docs/getting-started.html">Docs</a></h5><a href="/react-native/docs/getting-started.html">Getting Started</a><a href="/react-native/docs/tutorial.html">Tutorial</a><a href="/react-native/docs/components-and-apis.html">Components and APIs</a><a href="/react-native/docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/help.html">Community</a></h5><a href="/react-native/showcase.html">Who&#x27;s using React Native?</a><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discuss.reactjs.org" target="_blank">Discussion Forum</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><a href="http://reactjs.org" target="_blank">React</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/react-native/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2018 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'1677033832619985',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
                 </script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>