Skip to content

Instantly share code, notes, and snippets.

@peterjmag
Last active June 21, 2021 10:13
Show Gist options
  • Select an option

  • Save peterjmag/2ef39ba5d25f3f1e0008 to your computer and use it in GitHub Desktop.

Select an option

Save peterjmag/2ef39ba5d25f3f1e0008 to your computer and use it in GitHub Desktop.

Revisions

  1. peterjmag revised this gist Jan 2, 2016. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion react-native-talk.md
    Original file line number Diff line number Diff line change
    @@ -49,7 +49,7 @@ 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)
    [http://flexboxin5.com](http://flexboxin5.com)
    [Ninja edit from the future: flexboxin5.com [has been down for a while](https://twitter.com/peterjmag/status/669613851898486789), so here's a mirror: [https://cvan.io/flexboxin5/](https://cvan.io/flexboxin5/)]

    Inline styles?!
  2. peterjmag revised this gist Jan 2, 2016. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions react-native-talk.md
    Original file line number Diff line number Diff line change
    @@ -50,6 +50,7 @@ NavigatorIOS component

    WTFlexbox?
    [http://flexboxin5.com](http://flexboxin5.com)
    [Ninja edit from the future: flexboxin5.com [has been down for a while](https://twitter.com/peterjmag/status/669613851898486789), so here's a mirror: [https://cvan.io/flexboxin5/](https://cvan.io/flexboxin5/)]

    Inline styles?!
    [https://speakerdeck.com/vjeux/react-css-in-js](https://speakerdeck.com/vjeux/react-css-in-js)
  3. peterjmag revised this gist Jan 2, 2016. No changes.
  4. peterjmag revised this gist Jan 2, 2016. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion react-native-talk.md
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,6 @@
    ## A bit of context

    This is a companion Gist for a talk that I gave at [React Berlin](http://www.meetup.com/React-Berlin/events/221080348/). The fine folks at [Bitcrowd](http://bitcrowd.net/en) [recorded all three of the evening's talks](http://blog.bitcrowd.net/2015/04/06/react_april/), so you can watch mine at [https://www.youtube.com/watch?v=9ArhJiMGVDc](https://www.youtube.com/watch?v=9ArhJiMGVDc).
    This is a companion Gist for a talk that I gave at [React Berlin](http://www.meetup.com/React-Berlin/events/221080348/) in April 2015. The fine folks at [Bitcrowd](http://bitcrowd.net/en) [recorded all three of the evening's talks](http://blog.bitcrowd.net/2015/04/06/react_april/), so you can watch mine at [https://www.youtube.com/watch?v=9ArhJiMGVDc](https://www.youtube.com/watch?v=9ArhJiMGVDc).

    # Hi there!

  5. peterjmag revised this gist Jan 2, 2016. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion react-native-talk.md
    Original file line number Diff line number Diff line change
    @@ -4,7 +4,7 @@ This is a companion Gist for a talk that I gave at [React Berlin](http://www.mee

    # Hi there!

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

    [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).
  6. peterjmag revised this gist Apr 7, 2015. 1 changed file with 1 addition and 2 deletions.
    3 changes: 1 addition & 2 deletions react-native-talk.md
    Original file line number Diff line number Diff line change
    @@ -4,8 +4,7 @@ This is a companion Gist for a talk that I gave at [React Berlin](http://www.mee

    # Hi there!

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

    [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).
  7. peterjmag revised this gist Apr 7, 2015. 1 changed file with 4 additions and 0 deletions.
    4 changes: 4 additions & 0 deletions react-native-talk.md
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,7 @@
    ## A bit of context

    This is a companion Gist for a talk that I gave at [React Berlin](http://www.meetup.com/React-Berlin/events/221080348/). The fine folks at [Bitcrowd](http://bitcrowd.net/en) [recorded all three of the evening's talks](http://blog.bitcrowd.net/2015/04/06/react_april/), so you can watch mine at [https://www.youtube.com/watch?v=9ArhJiMGVDc](https://www.youtube.com/watch?v=9ArhJiMGVDc).

    # Hi there!

    [http://www.meetup.com/React-Berlin/events/221080348/](React Berlin - Meetup #1 -
  8. peterjmag revised this gist Apr 1, 2015. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion react-native-talk.md
    Original file line number Diff line number Diff line change
    @@ -37,7 +37,7 @@ They're in a state of... flux. =) But they're still not bad.

    **More resources**

    This community roundup on the React blog has a number of good React Native things
    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
  9. peterjmag revised this gist Apr 1, 2015. 1 changed file with 5 additions and 0 deletions.
    5 changes: 5 additions & 0 deletions react-native-talk.md
    Original file line number Diff line number Diff line change
    @@ -35,6 +35,11 @@ If you'd like to follow along, check out ReadingListIOS's commit history. I'll b
    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
  10. peterjmag revised this gist Apr 1, 2015. 1 changed file with 17 additions and 0 deletions.
    17 changes: 17 additions & 0 deletions react-native-talk.md
    Original file line number Diff line number Diff line change
    @@ -77,6 +77,23 @@ Higher-Order Components
    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 [[email protected]](mailto:[email protected]).
  11. peterjmag created this gist Mar 31, 2015.
    83 changes: 83 additions & 0 deletions react-native-talk.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,83 @@
    # 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)

    ## 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")

    ## 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 [[email protected]](mailto:[email protected]).