# Hi there!

[http://www.meetup.com/React-Berlin/events/221080348/](React Berlin - Meetup #1 -
React Berlin)

[Peter Magenheimer (@peterjmag)](https://twitter.com/peterjmag)  
I'm a front end developer at [ResearchGate](http://www.researchgate.net/). And yes, [we're hiring](http://www.researchgate.net/careers).

## Git repos

The web app we'll be "porting"  
[https://github.com/peterjmag/reading-list](https://github.com/peterjmag/reading-list)  

The end result (hopefully!)  
[https://github.com/peterjmag/ReadingListIOS](https://github.com/peterjmag/ReadingListIOS)

If you'd like to follow along, check out ReadingListIOS's commit history. I'll be following similar steps during my talk (though not necessarily in exactly the same order).

## React Native

**Talks from FB**

- [React.js Conf 2015 Keynote - Introducing React Native - YouTube](https://www.youtube.com/watch?v=KVZ-P-ZI6W4)
- [React.js Conf 2015 Keynote 2 - A Deep Dive into React Native - YouTube](https://www.youtube.com/watch?v=7rDsRXj9-cU)
- [F8 2015 - React Native & Relay: Bringing Modern Web Techniques to Mobile - YouTube](https://www.youtube.com/watch?v=X6YbAKiLCLU)

**Tutorials**

- [http://facebook.github.io/react-native/docs/tutorial.html](http://facebook.github.io/react-native/docs/tutorial.html#content)
- A very comprehensive tutorial by Colin Eberhart  
  [http://www.raywenderlich.com/99473/introducing-react-native-building-apps-javascript](http://www.raywenderlich.com/99473/introducing-react-native-building-apps-javascript "Introducing React Native: Building Apps with JavaScript")

**Component and API docs**  

They're in a state of... flux. =) But they're still not bad.  
[https://facebook.github.io/react-native/docs/getting-started.html](https://facebook.github.io/react-native/docs/getting-started.html)

**More resources**

This community roundup on the React blog has a number of good React Native things  
[http://facebook.github.io/react/blog/2015/03/30/community-roundup-26.html](http://facebook.github.io/react/blog/2015/03/30/community-roundup-26.html "Community Round-up #26 | React")

## Some scattered links along the way

NavigatorIOS component  
[https://facebook.github.io/react-native/docs/navigatorios.html#content](https://facebook.github.io/react-native/docs/navigatorios.html#content)

WTFlexbox?  
[http://flexboxin5.com](http://flexboxin5.com)

Inline styles?!  
[https://speakerdeck.com/vjeux/react-css-in-js](https://speakerdeck.com/vjeux/react-css-in-js)

Some good tips on isolation of components  
[http://facebook.github.io/react-native/docs/text.html#limited-style-inheritance](http://facebook.github.io/react-native/docs/text.html#limited-style-inheritance)  
(It's a bit buried in the docs, but good stuff nonetheless.)

StyleSheet API good practices  
[http://facebook.github.io/react-native/docs/stylesheet.html#content](http://facebook.github.io/react-native/docs/stylesheet.html#content)

LinkView.DataSource  
[https://facebook.github.io/react-native/docs/tutorial.html#listview](https://facebook.github.io/react-native/docs/tutorial.html#listview)
[https://facebook.github.io/react-native/docs/listview.html#content](https://facebook.github.io/react-native/docs/listview.html#content)

TouchableHighlight component  
[https://facebook.github.io/react-native/docs/touchablehighlight.html#content](https://facebook.github.io/react-native/docs/touchablehighlight.html#content "React Native | A framework for building native apps using React")

WebView component  
[https://facebook.github.io/react-native/docs/webview.html#content](https://facebook.github.io/react-native/docs/webview.html#content)

Testing a React Native app on your iPhone / iPad  
[http://stackoverflow.com/a/29304365/349353](http://stackoverflow.com/a/29304365/349353 "Error running the initialized react-native project in Xcode - Stack Overflow")

I might reference (or steal code from) FB's "Movies" example:  
[https://github.com/facebook/react-native/tree/master/Examples/Movies](https://github.com/facebook/react-native/tree/master/Examples/Movies "react-native/Examples/Movies at master · facebook/react-native · GitHub")

**Components, components, components!**

Higher-Order Components  
[https://medium.com/@dan_abramov/mixins-are-dead-long-live-higher-order-components-94a0d2f9e750](https://medium.com/@dan_abramov/mixins-are-dead-long-live-higher-order-components-94a0d2f9e750 "Mixins Are Dead. Long Live Composition — Medium")

Smart and Dumb Components  
[https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0](https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0 "Smart and Dumb Components — Medium")

**Stuff I used in the web app**

RefluxJS  
[https://github.com/spoike/refluxjs](https://github.com/spoike/refluxjs "spoike/refluxjs · GitHub")

ECMAScript 6  
[https://babeljs.io/docs/learn-es6/](https://babeljs.io/docs/learn-es6/ "None")

Babel (formerly 6to5) - Use ES6+ today  
[https://babeljs.io/](https://babeljs.io/)

webpack - Browserify on steroids  
[http://webpack.github.io/](http://webpack.github.io/ "webpack module bundler")

React Hot Loader  
[http://gaearon.github.io/react-hot-loader/](http://gaearon.github.io/react-hot-loader/ "React Hot Loader · Tweak React components in real time.")

## Feedback?

I'd love to hear it! Feel free to talk to me afterwards, tweet at me, or just add it as a comment on this Gist. If you'd like to give me private feedback, that's cool too—just email me at [hi@peterjmags.com](mailto:hi@peterjmags.com).