Issue #23

Logo for React Native Newsletter

Winners for last weeks contest have been declared, thanks for voting! @kenwheeler took first place and opted for a hand-signed and framed portrait of @vjeux himself. @kureev took second place and will be attending Reactive Conference. See this twitter conversation for links to the repos. Thanks @browniefed and @dzannotti for entering too, you win a free beer from me! But to get it you have to find me in person somewhere. Good luck!

Top News

Reactiflux is moving to Discord!
Reactiflux is moving to Discord!

"A few weeks ago, Reactiflux reached 7,500 members on Slack. Shortly after, Slack decided we were too big and disabled invites....."

".... We reached out to Slack several times, but their decision was firm. Our large community caused performance issues. Slack wants to focus on building a great product for teams, not necessarily large open communities."

Discord is working great so far, the web app is made in React and the iOS app is React Native, so it seems like a natural move for us! Come join in!

Bridging in React Native
Bridging in React Native

"An in-depth look into React Native's core" by @tadeuzagallo, probably the man most familiar with how the iOS React Native bridge works because he built a lot of it. If you want more posts like this from Tadeu then ping him on Twitter (also @tadeuzagallo) with hashtag #mais-postagens-por-favor or something.

Routing and Navigation in React Native (Blog post)
Routing and Navigation in React Native (Blog post)

If you've ever been on github.com/facebook/react-native you know who James (@ide) is. What you don't know is that he has put a lot of thought into his ExNavigator library and built it around real-world needs that we've run into while building a fairly complicated app.

I strongly urge you to read this article and give ExNavigator a try in your own app!

Let James know what you think on Twitter, where is handle is actually @JI because some A-class weirdo already has @ide (seriously, check @ide out on Twitter, I don't even know what to think).

Learn GraphQL
Learn GraphQL

An interactive guide through GraphQL! I haven't gone through it yet but I have to soon because I recently made a total fool of myself while doing a workshop on React Native -- I tried to demonstrate GraphQL through the swapi and couldn't even write a single valid query. Go me!

Reindex, as I mentioned last week, is a nice hosted GraphQL server which also has a useful walkthrough to get you started with GraphQL/Relay. Sign up for the beta to try it out.

Build Web Apps with React JS and Flux - Udemy
Build Web Apps with React JS and Flux - Udemy

Tiffany from Udemy reached out to me to offer free access to some of the newsletter readers to their React Web Apps course: "Master the fundamentals of React as you develop applications supported by Flux, React Router, Gulp, and Browserify."

If you're still new to React, check it out! Or just pass it along to a friend who isn't drinking the kool-aid yet. The coupon code is: Brent

Building fully Reactive User Interfaces using RxJS .... (Presentation slides)
Building fully Reactive User Interfaces using RxJS .... (Presentation slides)

Infamous rick @garbles did a great presentation on his experimental library yolk which is like a RXJS version of React with a minimal API. Check his slides out for an intro to Rx concepts and Yolk.

Easy Overlay Modal with Navigator (Blog post)
Easy Overlay Modal with Navigator (Blog post)

Does it keep you up at night knowing that you wouldn't be able to make a modal in React Native if you had to? @browniefed has your sleepy-time pills in the form of a blogpost.

Morphing SVG Paths with React Art (Blog post)
Morphing SVG Paths with React Art (Blog post)

NaNaNaNaNaNaNaNa blog post, blog post

Handcrafting an iOS Application with React Native (Blog post)
Handcrafting an iOS Application with React Native (Blog post)

A compilation of my knowledge and opinions on technology

Building React Native Apps (Blog post)
Building React Native Apps (Blog post)

"As we are working towards rolling out a fully-featured app, one thing that needed solved was how we should build the app for different environments. For example, how can we make (slightly different) development, staging, and production builds?"

Relay & GraphQL Newsletter
Relay & GraphQL Newsletter

Gerald Monaco (@devknoll), contributor to GraphQL in Relay is starting up a bi-weekly newsletter! Sign up to get it all up in your inbox, much like this one.

Highlights from facebook/react-native

React Native v0.13.0-rc
React Native v0.13.0-rc

Not long after v0.12.0, v0.13.0-rc has been released! @ide wrote up some fantastic release notes so be sure to give them a perusal. I wanted to pick a few of my favourite changes but there are too many so just click through.

Looking for somewhere to pitch in?
Looking for somewhere to pitch in?

The "Good First Task" tag is used by team members to indicate that an issue is actionable and that the fix or feature is wanted.

This is a great place to look when you want to find something to work on to help out with React Native.

I'll try to highlight at least one important "Good first task" in each of the coming newsletters!

Separate website for each release
Separate website for each release

This is the first highlighted "Good first task" - in short, what I think everyone would like is to have different version of the docs for every tagged release of React Native, and make it possible for the user to switch between them.

Corrected computation of RCText element height with padding by quentinadam
Corrected computation of RCText element height with padding by quentinadam

"Corrected computation of RCText element height with padding (padding was counted twice)."

If you have noticed issues with applying padding to Text, this should fix that!

New experimental backend for ListView: "RecyclerViewBackedScrollView"
New experimental backend for ListView: "RecyclerViewBackedScrollView"

This Android-only component is built on top of the RecyclerView, to try to get better performance out of ListView. Give it a try in your Android app and let @kmagiera know how if you run into any issues.

Highlights from the community

Android version of react-native-mapbox-gl now available!
Android version of react-native-mapbox-gl now available!

"Big release 🔥: Android, polylines and polygons!"

Developing React Native Android Apps With Linux
Developing React Native Android Apps With Linux

"Our guide to developing Android apps on Linux with React Native, based on our initial experience with the framework."

gilbox/react-three-ejecta-boilerplate
gilbox/react-three-ejecta-boilerplate

"universal webgl app that compiles for web and native mobile" #snowflakes #winteriscoming

dmotz/natal
dmotz/natal

Initialize a ClojureScript-powered React Native project and boot it without even using Xcode! Check out cljsrn.org for more info

axemclion/react-native-cordova-plugin
axemclion/react-native-cordova-plugin

Currently only available for Android, but it seems like a very promising way to reuse a bunch of existing code from the Cordova ecosystem! Here's a blog post with more information.

In summary, once it's set up all you need to do is:

var cordova = require('react-native-cordova-plugin');
cordova.device.getInfo(/* your callback here */);.
React Native deployment with Fastlane (Blog post)
React Native deployment with Fastlane (Blog post)

"While developing with React Native we wanted to have the same or at least a similar environment, so the goal was to have one command to build and deploy the application to test devices. This blog post is a detailed explanation of how to set up such a deployment environment for your project (and propably mine too, as I will definitely have to reread this post to remember next time)."

FaridSafi/react-native-google-places-autocomplete
FaridSafi/react-native-google-places-autocomplete

Do you like places but dislike typing? Well I have some great news for you then! FaridSafi has put together a wrapper around the Google Places autocomplete API, check it out!

Friends of the newsletter

Appetize.io
Appetize.io

I love these folks. They make rnplay.org possible and in doing so support the React Native community in a big way. They are also allowing us to use their simulators within the React Native docs! I am not paid to advertise for them, I'm happy 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!

Goodbits
Goodbits

"Newsletters should take minutes, not hours. Goodbits helps you quickly build email campaigns." That's their thing. True story, I once wore a Goodbits tshirt while cycling across the Golden Gate bridge. If you've read this far, you should probably at least try out Goodbits, because clearly you have time on your hands.

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!