Issue #11

Logo for React Native Newsletter

Another beautiful week in the world of React - ReactEurope, React v0.14 Beta, @brentvatne's 29th birthday, all equally super important milestones to the entire community!

Top News

ReactEurope is complete!
ReactEurope is complete!

At the time of writing, @vjeux's keynote, @leeb's GraphQL overview, @dan_abramov's redux/hot reloading talk and @chantastic's dive into inline-css are all up for your viewing pleasure. The rest will be trickling in as they become available.

Check out a summary of the highlights of the conference on the ModusCreate blog!

React v0.14 Beta 1 Released!
React v0.14 Beta 1 Released!

The most salient change in 0.14 with respect to React Native is that the React library itself has been divorced from its DOM roots, and all of that logic has now been pulled out into react-dom. Check your privilege, DOM, React platform-equality is on the way.

React Rally speakers and schedule announced!
React Rally speakers and schedule announced!

"A community React conference August 24 - 25 2015 in Salt Lake City, UT" - get your tickets now while you still can! Don't feel down if your proposals weren't accepted, neither were mine- rather, I invite you to feel relieved that you can now enjoy your summer rather than ruminate over what could go wrong and procrastinate preparing your talk! Instead, show up to the conference well-rested to watch tired, nervous but brilliant folks do their best to distill and share the knowledge they have.

A quick shout out to React Native community stars @vjeux and @ccheever (@exponentjs wizard), who will be speaking at the conference!

React Native Playground 1.2.0 released
React Native Playground 1.2.0 released

"This app was built against React Native 0.6.0. Development mode is now enabled. New native modules available in your apps: react-native-activity-view and react-native-userdefaults-ios.

Now you can load any React Native application via a direct URL. For example, work against a local development packager, or load a static javascript bundle.

Loading apps via the custom rnplay:// scheme is possible."

Also, congrats to @jsierles for winning the prize for top lightning talk at ReactEurope with an impressive demo of React Native Playground!

Code examples and slides from @sahrens2012's ReactEurope Animations talk
Code examples and slides from @sahrens2012's ReactEurope Animations talk

“#reactnative: Animated slides and example code from #reacteurope 2015 https://t.co/jbHfcbYM3yhttps://t.co/10ouoQnnra”

Check this out to see what the future of animations in React Native will be! The demo is super impressive, I can't wait to get my hands on this!

Facebook Ads Manager on Google Play
Facebook Ads Manager on Google Play

That's right, the first React Native app for Android has hit the app store! This is a big milestone because Facebook does not release any open source until they use it in production and are confident in the quality of the software. In @vjeux's keynote he mentions that the team was able to achieve 87% code re-use between the iOS and Android version of the app - a truly impressive figure!

Highlights from Issues and Pull Requests

0.8.0-rc tracking issue
0.8.0-rc tracking issue

We are waiting on a couple of commits to be sync'd before we can land the 0.8.0-rc release, big thanks to @ide for taking lead on this one. The two-week release cycle hasn't quite panned out but we're doing our best to get back on track!

Create whitelist internal modules that need to be exposed publicly
Create whitelist internal modules that need to be exposed publicly

Have you ever done require('NativeModules') or require('Dimensions') inside of your React Native app? My bet is that yes, you have. The problem here is that this should not have been possible - those modules are internal to React Native and should be require'd via the public interface like this: var { NativeModules, Dimensions } = require('react-native');

Requiring internal modules will not be possible soon, so please have a look at your apps and make sure to pitch in on this issue if there is any internal library that you need to have exposed - it would help us a lot and prevent you from some future headaches!

Text - add textDecoration style attributes by pcottle and KJlmfe
Text - add textDecoration style attributes by pcottle and KJlmfe

Original work by @KJlmfe, @pcottle went ahead and rebased and re-open this pull request to push it forward. We could see this as early as 0.8.0-rc!

Contributions welcome!
Contributions welcome!

I mentioned this in a previous newsletter but I want to bring it up again in case some of you want to help but don't know where to start. If you're looking for a way to contribute back to the community, take a look at the "Sorted by unique commenters" list and see if you can't solve any of the most popular issues.

Highlights from the community

chenglou/react-animation
chenglou/react-animation

"A spring that solves your animation problems."

@chenglou reveals what he has been working on as a replacement for ReactCSSTransitionGroup. I haven't had a chance to play with it yet, but as the author of react-tween-state and someone who thinks deeply about animations, I have no doubt that this will be a welcome addition to the React animation ecosystem.

paramaggarwal/react-native-youtube
paramaggarwal/react-native-youtube

"Uses Google's official youtube-ios-player-helper and exposes much of the API into React Native."

If you're going to show a YouTube video in your app, this seems like the obvious choice instead of embedding a WebView!

realtime-framework/RCTRealtimeCloudStorage
realtime-framework/RCTRealtimeCloudStorage

You know, I have no idea what this really is. It appears to be some kind of Parse/Firebase type service. Maybe you will be into it. Worth checking out if you're into that kind of thing!

este/native
este/native

An opinionated React Native development stack that was announced at ReactEurope by @grabbou, worth checking out even if you don't plan on using it, you might find something to bring back to your projects.

ps: don't kill grabbou

kkjdaniel/react-native-device-display
kkjdaniel/react-native-device-display

"A simple way to create dynamic views through device and display detection, allowing the creation of adaptable and universal apps."

In other words, it's a pleasant api for determining view-related properties of your device - is it a tablet or a phone? is it in landscape or portrait mode? what percentage of the width is x? etc.

xudafeng/autoresponsive-react
xudafeng/autoresponsive-react

This looks like a cool library for building grid and Pinterest style layouts - it's available both for React Web and Native. Click through here if only for the pretty site that @xudafeng put together for this library - I wish more open source projects built sites like this to explain and demo the library. Bravo!

christopherdro/RN-Arduino-Blink
christopherdro/RN-Arduino-Blink

"Basic Blink Example using React Native and Johnny Five" - check out a quick video of it in action here. Uses react-native-swift-socketio to communicate with the Arduino. Check out the server directory for the bit that runs on the board itself.

exponentjs/react-native-responsive-image
exponentjs/react-native-responsive-image

"A responsive Image component that chooses the best-resolution image for the current screen."

An important missing piece, this component allows you to specify different sources for images depending on the PixelRatio - mixing and matching between bundled assets and remote resources and any other valid Image source!

Friends of the newsletter

charity:water
charity:water

As I mentioned in the headline, it was my birthday last week - July 5th to be exact. I donated my birthday to charity:water, and have come just short of the $500 fundraising goal - so if you appreciate the time I spent on this newsletter and would like to thank me and wish me a happy birthday while also helping to rid the world of thirst (three-for-one), a donation of any amount would be much appreciated! 100% of public donations to charity:water go directly to water projects.

Appetize.io
Appetize.io

I love these guys. They make rnplay.org possible and in doing so support the React Native community in a big way. They recently added api access to device logs so you can now see all log messages at the bottom of the editor on rnplay.org! I am not paid to advertise for them, I love to advocate for products that I believe in (see: this newsletter about React Native) - so check them out if you have any need for an in-browser simulator for iOS or Android! Go and upload an app, the first 100 minutes of simulator use are free!

That's it for now! Ping me on Twitter @notbrent if you have anything that you would like me to share next week.

If you're reading this on the web, you can subscribe to get this delivered weekly to your email here!

Goodbits

Collect and curate content easily for brilliant newsletters. Try Goodbits for free!