Created
April 23, 2015 17:51
-
-
Save brentvatne/ebc4d9bd24299a74c518 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div style='-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;color:#565656;font-family:"Helvetica Neue", "Helvetica", "Helvetica", "Arial", sans-serif;font-style:normal;font-weight:300;min-width:100%;margin:25px 0;padding:0;width:94% !important'> | |
| <table class="body" border="0" cellpadding="0" cellspacing="0" style='-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;color:#565656;font-family:"Helvetica Neue", "Helvetica", "Helvetica", "Arial", sans-serif;font-style:normal;font-weight:300;min-width:100%;margin:25px 0;padding:0;width:94% !important'> | |
| <tr> | |
| <td class="center" align="center" valign="top"> | |
| <center> | |
| <!-- content --> | |
| <table class="container" border="0" cellpadding="0" cellspacing="0" style="margin:0 auto;width:580px"> | |
| <tr> | |
| <td> | |
| <!-- title --> | |
| <table class="row" border="0" cellpadding="0" cellspacing="0" style="width:100% !important"> | |
| <tr> | |
| <td> | |
| <table border="0" cellpadding="0" cellspacing="0"> | |
| <tr> | |
| <td> | |
| <h1 style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:28px;font-weight:300;margin-bottom:15px">Issue 1</h1> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- description --> | |
| <table class="row" border="0" cellpadding="0" cellspacing="0" style="width:100% !important"> | |
| <tr> | |
| <td> | |
| <table align="left" border="0" cellpadding="0" cellspacing="0"> | |
| <tr> | |
| <td class="description"> | |
| <p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">Hi all! The torrid pace of development in react-native and the surrounding community has continued this past week and I've done my best to summarize what I remember to be the most interesting developments during that time. If you enjoy it, do me a favour and help someone out in an issue or submit a pull request to the react-native repo!</p> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- links / content --> | |
| <table class="row section-content" border="0" cellpadding="0" cellspacing="0" style="width:100% !important"> | |
| <tr> | |
| <td> | |
| <table class="full-width" align="left" border="0" cellpadding="0" cellspacing="0" style="width:100%"> | |
| <tr> | |
| <td> | |
| <h2 class="section-title" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:22px;font-weight:300;margin-bottom:15px;border-bottom:1px solid #e3e3e3;margin-top:30px;padding-bottom:3px">In the news</h2> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="http://techcrunch.com/2015/04/20/how-facebooks-react-native-will-change-mobile-apps/#.pfrvwy:Lkwl" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1974177/Screen_Shot_2015-04-22_at_5.18.00_PM.png" alt="How Facebook’s React Native Will Change Mobile Apps - TechCrunch article" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="http://techcrunch.com/2015/04/20/how-facebooks-react-native-will-change-mobile-apps/#.pfrvwy:Lkwl" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">How Facebook’s React Native Will Change Mobile Apps - TechCrunch article</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">A TechCrunch article that explains in simple terms what React Native is and why it matters. Share the link with your boss or co-workers to get it on their radar, or your spouse so they can understand why your text editor is suddenly white looking and you have a little iPhone on your screen all of the time these days.</p> | |
| <p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">Joe Stanton wrote a similar but more technical article <a href="http://red-badger.com/blog/2015/04/23/react-native-when-the-mobile-web-isnt-enough/" style="color:#1c7fee !important">"React Native – When the Mobile Web Isn’t Enough"</a> that is also well worth a perusal.</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://egghead.io/series/react-native-fundamentals" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1988155/265egghead-60bb7dd8a6ec65924d586d5ede3905e8.png" alt="React Native Screencasts - Egghead" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://egghead.io/series/react-native-fundamentals" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">React Native Screencasts - Egghead</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">Free for this week! @tylermcginnis33 walks you through the fundamentals of react-native to create a Github Note Taker app - the price is right, why not try it or pass the link on to a friend?</p> | |
| <p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">(Note: I have no affiliation with Egghead and have nothing to gain from you using this, this is not an advertisement)</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table class="row section-content" border="0" cellpadding="0" cellspacing="0" style="width:100% !important"> | |
| <tr> | |
| <td> | |
| <table class="full-width" align="left" border="0" cellpadding="0" cellspacing="0" style="width:100%"> | |
| <tr> | |
| <td> | |
| <h2 class="section-title" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:22px;font-weight:300;margin-bottom:15px;border-bottom:1px solid #e3e3e3;margin-top:30px;padding-bottom:3px">Highlights from Issues and Pull Requests</h2> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://facebook.github.io/react-native/docs/nativecomponentsios.html#content" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1981275/Screen_Shot_2015-04-21_at_6.23.53_PM.png" alt="@sahrens adds Native UI Component Docs" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://facebook.github.io/react-native/docs/nativecomponentsios.html#content" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">@sahrens adds Native UI Component Docs</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">I wrote my own blog posts about native UI components last week (you can them at <a href="http://brentvatne.ca" style="color:#1c7fee !important">http://brentvatne.ca</a>), but @sahrens has a lot more experience and is better suited to the job - he adds depth and breadth to the topic in this easy-to-read article - don't miss it! <code style="color:#666666;font-size:12px;font-weight:normal;margin:0;padding:3px 3px 2px">requireNativeComponent</code> also landed as a replacement for <code style="color:#666666;font-size:12px;font-weight:normal;margin:0;padding:3px 3px 2px">createReactIOSNativeComponentClass</code> and @sahrens updated the docs <a href="https://github.com/facebook/react-native/commit/1fa55c23ce2371cc9b65659f6fb61c32aa91a114" style="color:#1c7fee !important">to reflect that here</a>.</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/facebook/react-native/issues/207" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1988151/Screen_Shot_2015-04-22_at_5.16.44_PM.png" alt="@robertjpayne, @nicklockwood, and @ide make progress towards Swift compatibility" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/facebook/react-native/issues/207" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">@robertjpayne, @nicklockwood, and @ide make progress towards Swift compatibility</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">@robertjpayne takes the initiative and shows off an example of integrating a simple native component written in Swift into react-native! Check out the surrounding discussion and pitch in if this interests you! Subsequent pull request can be found <a href="https://github.com/facebook/react-native/pull/982/" style="color:#1c7fee !important">here</a>.</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/facebook/react-native/issues/934" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1974176/Screen_Shot_2015-04-23_at_9.56.53_AM.png" alt="Show requests made using the `fetch` api in chrome dev tools" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/facebook/react-native/issues/934" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">Show requests made using the `fetch` api in chrome dev tools</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">@vjeux points out a nifty trick that allows you to see your apps XHR requests in the the Network tab of Chrome when developing your app</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/facebook/react-native/pull/576#issuecomment-94962156" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1981154/72954.jpg" alt="Using data-uris with <Image />" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/facebook/react-native/pull/576#issuecomment-94962156" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">Using data-uris with <Image /></a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">@colinramsay implemented it and @rt2zz shared the following snippet to ensure we all know how it works:</p> | |
| <pre style="white-space:pre-wrap"><code style="color:#666666;font-size:12px;font-weight:normal;margin:0;padding:3px 3px 2px"><Image source={{uri: 'data:image/jpeg;base64,'+ base64ImageString, isStatic: true}} /> | |
| </code></pre> | |
| <hr> | |
| <p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">With this, you can display base64 encoded images easily! Or if you refactor for es6 interpolation:</p> | |
| <pre style="white-space:pre-wrap"><code style="color:#666666;font-size:12px;font-weight:normal;margin:0;padding:3px 3px 2px"><Image source={{uri: `data:image/jpeg;base64,${imageString}`, isStatic: true}} /> | |
| </code></pre> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/facebook/react-native/issues/871" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1992003/287288.png" alt="View shifts down and breaks when StatusBar changes size" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/facebook/react-native/issues/871" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">View shifts down and breaks when StatusBar changes size</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">A related issue originally led to me creating <a href="https://github.com/brentvatne/react-native-status-bar-size" style="color:#1c7fee !important">react-native-status-bar-size</a>, but @soheil pointed out an alternate solution - wrap your views in this:</p> | |
| <pre style="white-space:pre-wrap"><code style="color:#666666;font-size:12px;font-weight:normal;margin:0;padding:3px 3px 2px"><View style={{flex: 0, height: require('Dimensions').get('window').height}}> | |
| </code></pre> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/facebook/react-native/pull/851" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1992004/1904616.jpg" alt="Bundle script instead of curl by @arthuralee" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/facebook/react-native/pull/851" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">Bundle script instead of curl by @arthuralee</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">This merged PR changes the bundle command from:</p> | |
| <pre style="white-space:pre-wrap"><code style="color:#666666;font-size:12px;font-weight:normal;margin:0;padding:3px 3px 2px">curl 'http://localhost:8081/Examples/SampleApp/index.ios.bundle?dev=false&minify=true' -o iOS/main.jsbundle | |
| </code></pre> | |
| <p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">to</p> | |
| <pre style="white-space:pre-wrap"><code style="color:#666666;font-size:12px;font-weight:normal;margin:0;padding:3px 3px 2px">react-native bundle --minify | |
| </code></pre> | |
| <p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">Expect it to land soon!</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/facebook/react-native/pull/977#issuecomment-95380419" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1992210/Screen_Shot_2015-04-23_at_10.32.15_AM.png" alt="@tadeuzagallo takes me to school" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/facebook/react-native/pull/977#issuecomment-95380419" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">@tadeuzagallo takes me to school</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">@tadeuzagallo sure knows his way around react-native - here I built out this unnecessarily complicated bridge module to grab the current opacity of a child element asynchronously (this is how the bridge works), when all I needed to do was grab its opacity out of the <code style="color:#666666;font-size:12px;font-weight:normal;margin:0;padding:3px 3px 2px">StyleSheetRegistry</code> - neat little trick, albeit of limited usefulness generally, but ideal for this situation. If you're into this kind of information, also check out <a href="https://github.com/facebook/react-native/issues/953" style="color:#1c7fee !important">this discussion</a> where I explain how you can get the layout properties for a given element by ref. Also, check out @tadeuzagallo's <a href="https://github.com/tadeuzagallo/GithubPulse" style="color:#1c7fee !important">GithubPulse</a> OSX app - it's a great way to keep your Github commit streaks going! I've been on a 33 day tear since I started using it.</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/facebook/react-native/issues/247#issuecomment-86770413" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1992202/yosemite_intro_2.png" alt="Target OSX with react-native?" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/facebook/react-native/issues/247#issuecomment-86770413" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">Target OSX with react-native?</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">@sahrens says in this issue "An engineer here at Facebook actually hacked up a prototype a while back - shouldn't be hugely difficult for someone to make it happen if you want to give it a go :)" - nobody has stepped up and volunteered to lead the charge yet, if you're willing then please chime in! I'd love to see this happen.</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table class="row section-content" border="0" cellpadding="0" cellspacing="0" style="width:100% !important"> | |
| <tr> | |
| <td> | |
| <table class="full-width" align="left" border="0" cellpadding="0" cellspacing="0" style="width:100%"> | |
| <tr> | |
| <td> | |
| <h2 class="section-title" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:22px;font-weight:300;margin-bottom:15px;border-bottom:1px solid #e3e3e3;margin-top:30px;padding-bottom:3px">Highlights from react-native-community</h2> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/geniuxconsulting/react-native-ibeacon" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1992011/ibeacon.png" alt="react-native-ibeacon by @frostney" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/geniuxconsulting/react-native-ibeacon" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">react-native-ibeacon by @frostney</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">iBeacon support for React Native. The API is very similar to the CoreLocation Objective-C one with the only major difference that regions are plain JavaScript objects.</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/pwmckenna/react-native-motion-manager" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1992013/device_axes.jpg" alt="react-native-motion-manager by @pwmckenna" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/pwmckenna/react-native-motion-manager" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">react-native-motion-manager by @pwmckenna</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">CMMotionManager wrapper for react-native, exposing Accelerometer, Gyroscope, and Magnetometer.</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/johanneslumpe/react-native-selectablesectionlistview" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1992115/select.gif" alt="react-native-selectablesectionlistview by johanneslumpe" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/johanneslumpe/react-native-selectablesectionlistview" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">react-native-selectablesectionlistview by johanneslumpe</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">A ListView with a sidebar to directly jump to sections - for example you could have the alphabet on the right side and sort items in the ListView alphabetically, then jump to a certain letter by just tapping it.</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <table width="100%" border="0" cellpadding="0" cellspacing="0" class="w100percent"> | |
| <tr> | |
| <td class="align-top link-content" style="vertical-align:top;padding-bottom:20px"> | |
| <!-- left column --> | |
| <table width="140" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <a href="https://github.com/ericvicenti/react-native-community#metrics" style="color:#1c7fee !important"><img class="thumbnail" src="https://goodbits-production.s3.amazonaws.com/uploads/link/thumbnail/1992203/mobile-ab-test-best-pratices.jpg" alt="react-native-ab & google-analytics by @lwansbrough" style="float:none;max-width:120px;max-height:120px;padding-right:10px;margin-bottom:10px"></a> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end left column --> | |
| <!-- right column --> | |
| <table width="440" border="0" cellspacing="0" cellpadding="0" align="left" class="w270"> | |
| <tr> | |
| <td> | |
| <h3 class="title seriously-break-word" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:18px;line-height:26px;margin-bottom:10px;word-wrap:break-word;word-break:break-word;white-space:normal;margin-top:0;margin-bottom:0;color:#1c7fee !important"><a href="https://github.com/ericvicenti/react-native-community#metrics" style="color:#328EF5;text-decoration:none;color:#1c7fee !important;color:#1c7fee !important">react-native-ab & google-analytics by @lwansbrough</a></h3> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td> | |
| <span class="link-description seriously-break-word" style="word-wrap:break-word;word-break:break-word;white-space:normal"><p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">A new "Metrics" section has been added to the community repo - the ab library helps you run UI experiments and the complementary google-analytics library helps you to report on the results of those experiments.</p> | |
| </span> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end right column --> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- footer --> | |
| <table class="row" border="0" cellpadding="0" cellspacing="0" style="width:100% !important"> | |
| <tr> | |
| <td> | |
| <table align="left"> | |
| <tr> | |
| <td> | |
| <p style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px">That's it for now! Ping me on Twitter @notbrent if you have anything that you would like me to share next week.</p> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </table> | |
| <br> | |
| <br> | |
| <br> | |
| <table class="row built-with-goodbits" border="0" cellpadding="0" cellspacing="0" style="width:100% !important"> | |
| <tr> | |
| <td> | |
| <table align="left" border="0" cellpadding="0" cellspacing="0"> | |
| <tr> | |
| <td> | |
| <p class="built-by-goodbits-text" style="color:#565656;font-family:'Roboto', Helvetica, Helvetica, Arial, sans-serif;font-style:normal;font-weight:300;letter-spacing:0.04em;font-size:15px;line-height:26px;margin-top:4px;margin-bottom:21px;font-size:14px"> | |
| Collect and curate content easily for brilliant newsletters. Try <a href="https://goodbits.io/?utm_source=builtwith-try&utm_medium=email&utm_campaign=react-native-newsletter" style="color:#1c7fee !important">Goodbits</a> for free! | |
| </p> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- end content --> | |
| </center> | |
| </td> | |
| </tr> | |
| </table> | |
| <style type="text/css"> | |
| @media only screen and (max-width: 580px) { | |
| table[class="body"] table[class="container"] { | |
| width: 90% !important; | |
| } | |
| table[class="w100percent"] { | |
| width: 100% !important; | |
| } | |
| table[class="w270"] { | |
| float: none; | |
| padding-left: 0 !important; | |
| padding-right: 0 !important; | |
| width: 270px !important; | |
| } | |
| } | |
| </style> | |
| </div> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment