Issue #17

Logo for React Native Newsletter

I was away last week at React Rally, where I hung out with a bunch of smart people and learned that 3.2% is the legally enforced maximum ABV for draught beer in Utah.. But here we are again with news from around the React Native world.

Top News

React Native v0.11.0-rc and v0.10.0
React Native v0.11.0-rc and v0.10.0

No single huge feature in this release but a lot of bugfixes and small additions that I'm sure you will all appreciate, click through for the release notes!

PSA: v0.11.0-rc will be the last release to contain "rc" in the version name. After speaking with @linclark at React Rally, we've decided that the best approach going forward in order to avoid peerDependencies-related npm warnings (see this issue for more information) is to publish our release candidates without the -rc suffix. The most recent stable version will be marked as the latest on npm, so that will be downloaded automatically and you will have to manually specify the "release candidate" version in order to use it - so this does not change. If you take issue with this approach, ping me @notbrent on Twitter and we can discuss!

GraphiQL - An interactive in-browser GraphQL IDE released
GraphiQL - An interactive in-browser GraphQL IDE released

Announced on stage at React Rally, this is a zero effort way to jump in and play with GraphQL to get a feel for how it works, while also reading up more about Star Wars in preparation for the upcoming new film.

The items and edges thing still feels super weird to me but it was explained to me as being an important construct for 1) security: you might be friends with Brent and Todd, but maybe Brent doesn't want you to see that he is friends with Todd because he is embarrassed by that, so you can see the nodes but not the edges. 2) pagination: https://facebook.github.io/relay/docs/graphql-connections.html#content (thanks @leeb and @schrockn for explaining this).

Exponent on the App Store & xde released
Exponent on the App Store & xde released

xde is the "Exponent Development Environment" - a GUI tool that makes it even easier to use Exponent. If you haven't heard of it before, Exponent is a way to build and share apps / "experiences" without even going into Xcode. All you need is your text editor and an iPhone. @ccheever spoke about it at React Rally so keep an eye out for the videos to be posted online! Join us on the Exponent Slack to chat more about it!

ProjectSeptemberInc/gl-react-native
ProjectSeptemberInc/gl-react-native

"OpenGL bindings for React Native to implement complex effects over images and components, in the descriptive VDOM paradigm" - wow, this is super exciting! Clone it, try out the examples and check out the gitbook docs to be blown away. I can't wait to see people begin to integrate this into their projects!

React Native Showcase is live
React Native Showcase is live

Thanks @chirag04 for putting this together! This is a showcase of React Native apps, feel free to submit a pull request to add yours to the list!

Guy with impressive mustache talks about React Native
Guy with impressive mustache talks about React Native

This article is great, you should definitely read it, but my god, that mustache, it's a work of art. Adam Wolff, I salute you.

Highlights from facebook/react-native

[RFC] Declarative navigator routeStack API
[RFC] Declarative navigator routeStack API

"The Navigator component stores quite a bit of information internally in this.state, which makes sense given the complexity of scene transitions. However, the imperative APIs needed to work with the Navigator component (pop, push, replaceAtIndex, etc.) are unfamiliar when coming from other traditionally declarative React core components.

I'd like to propose adding a new (optional) declarative API:

<Navigator routeStack={routes} />"

Interesting discussion started by @tgriesser - I'd love to see this kind of behaviour integrated so that you can easily plug your navigation state into Redux!

[NavigatorIOS] push flicker 0.10.0
[NavigatorIOS] push flicker 0.10.0

@oblador makes a great point here - currently it's hard to performantly animate Navigator transitions when pushing any semi-complex view because you end up dropping frames pretty quickly. This is a known issue that is being looked at by the team and there are some efforts being made to improve it as I mention in my response. But if you have any other ideas for how we can make this better, feel free to jump in the thread! Or, if you're interested in taking ownership of NavigatorIOS and forming a small group around it, I would encourage you to do so! This is the beauty of open source :)

[NavigatorIOS] Adding the ability to change the title bar font. by lloydho
[NavigatorIOS] Adding the ability to change the title bar font. by lloydho

An exemplary pull request from lloydho - we need more of these for NavigatorIOS! Apparently he's moved to BitBucket though. See ya lloydho!

Add Drop Shadow Style to Text Component by greghe
Add Drop Shadow Style to Text Component by greghe

"Adds four new styles to the Text component: textShadowOpacity,textShadowColor, textShadowOffset and textShadowRadius. They are nearly identical to the correspondingly named view shadow properties."

Highlights from the community

Discovery VR on the App Store on iTunes
Discovery VR on the App Store on iTunes

Beautiful app built with React Native was released last week, I highly recommend you download it, open a video, go in a room without windows and turn the lights off*. Move your phone around. Super cool. Of course not all of that could be done with JavaScript but the slick UI that gets you to the action certainly is.

*please don't trip and fall and hurt yourself, if you are a clumsy person then just sit on your couch and surround yourself with pillows.

yelled3/react-native-google-static-map
yelled3/react-native-google-static-map

If an interactive map is overkill for you and you just want to show one specific area of a map, this might be the library for you - it's a wrapper around Google's static map API.

aksonov/react-native-svg-elements
aksonov/react-native-svg-elements

"Use React Native to draw SVG. No XML parsing, use speed of React Native directly. Alpha version, not all elements/attributes are supported now." - cool project that seems like a better version of the simple react-native-svg project I put together a while ago. Hope to see it continue to develop!

aksonov/react-native-tableview
aksonov/react-native-tableview

Yeah that's right, another weird purple Github placeholder avatar - that must mean that this is aksonov again. In this project, aksonov wraps the native UITableView. This might be useful for you if you feel you're not quite getting the performance you need out of ListView and don't need much in the way of customization for your list.

voximplant/react-native-voximplant
voximplant/react-native-voximplant

"VoxImplant Mobile SDK module for React Native. It lets developers embed realtime voice and video communication into React Native apps and works together with VoxImplant cloud platform. The SDK uses WebRTC for media processing."

yamill/react-native-pasteboard ยท GitHub
yamill/react-native-pasteboard

Sometimes it's just better to let the code speak:

PasteBoard.copyText('Hello world!', (callback) => {
  AlertIOS.alert('Alert', 'Link copied to clipboard!');
});
michaelcontento/redux-middleware-react-native-appstate
michaelcontento/redux-middleware-react-native-appstate

It's neat to see some more work being done to provide tooling around Redux specific to React Native! If you haven't tried Redux yet, please do, you will enjoy it!

paramaggarwal/react-native-device-motion
paramaggarwal/react-native-device-motion

Pretty sure the image says it all here.

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. 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!

*|LIST:ADDRESS|*

Unsubscribe