4 ms·

Q: Should one get familiar/experienced with React[0][1] first before jumping into React Native dev? Or is this tutorial sufficiently stand-alone without React

Q: Should one get familiar/experienced with React[0][1] first before jumping into React Native dev? Or is this tutorial sufficiently stand-alone without React (web) experience? [0] http://survivejs.com/react/introduction/ http://survivejs.com/react/introduction/ [1] https://online.reacttraining.com/p/reactjsfundamentals https://online.reacttraining.com/p/reactjsfundamentals

dabbott 10y ago
I'd be interested in hearing from people who have learned through this site, but my aim is: One should be able to learn React Native directly through this tutorial, without starting with React for web. The main prerequisite is ES5 JavaScript. The tutorial makes analogies to HTML/CSS/React and other web technologies, but these aren't crucial to understanding the material.
- drieddust 10y ago
  Thanks for putting the effort. Though my knowledge is limited but I don't get this. Why React is different from React Native? Ideally web should be another target just like iOS or Android.
  - dabbott 10y ago
    The "React" part is the same regardless of web or native. But there are a lot of other concerns for web (css, DOM stuff, and integrating libraries that use those two). Ideally web is just another taraget :) https://github.com/necolas/react-native-web https://github.com/necolas/react-native-web That said, while writing a website with react-native-web is potentially interesting for new sites, it can be less worthwhile for an existing site to just embed a little bit (which is one of the huge values of React). It's also still very experimental. But I suspect it will be supported in a huge way soon.
  - spicyj 10y ago
    React DOM is a sibling of React Native that integrates directly with web APIs and allows you to use <div /> and <span /> directly instead of RN APIs like <View />. You're correct that there's no theoretical reason that RN apps can't run on the web; as dabbott mentions, react-native-web is one third-party attempt at this. We'd like to support this officially one day but don't currently have a high-quality solution we can recommend.
bennyg 10y ago
As someone who dove headfirst into RN without JS/React experience (~5 years of iOS), you don't need to know any of that stuff beforehand. I haven't gone through (or really looked in-depth) this tutorial, but I can say that the ES{x} features are pretty easy to grok once you've seen and written them a few times. Most of the syntax specifics are easy to pick up just by reading code. The biggest things I'd focus on for starting into RN is: - React lifecycle (componentDidMount, willUnmount, shouldComponentUpdate, etc) - Add render counts into your debug builds so you know if components are re-rendering way more than they should (shouldComponentUpdate is your friend here). Other than that, learn by building. Keep an open mind to frustrations since RN changes rapidly, and the documentation/examples/libraries online are not the most up-to-date.
- hackcrafter 10y ago
  Nice, I'm going to jump strait into this then. Thanks! I did find the You Don't Know JS[0] book series extreamly helpful as a C++/Python coder who has only done enough JS to get by. But that is the extent of my prep for learning React Native. Interestingly, the YDKJS author (Kyle Simpson) is very down on the adoption and heavy usage of ES6 class notation and the over-reliance of the syntactic appearance of a OO-language class systems in JS. His argument is the abstraction will leak the in-its-own-right powerful delegation system of JS prototypes, so why not just learn/use raw objects or his OLOO (objects-linked-to-other-objects) pattern. I find it hard to mentally map the ES6 class to the equivalent object+prototype structure it is syntax sugar for, so just throw my hands up and for the most part pretend they are Python style open-objects. [0] https://github.com/getify/You-Dont-Know-JS https://github.com/getify/You-Dont-Know-JS
drieddust 10y ago
I tried survivejs but whole complexity and explanations started falling apart when flux and whole concept of provider was introduced. [1] http://survivejs.com/react/implementing-kanban/react-and-flux/ http://survivejs.com/react/implementing-kanban/react-and-flu...

dabbott 10y ago

I'd be interested in hearing from people who have learned through this site, but my aim is: One should be able to learn React Native directly through this tutorial, without starting with React for web. The main prerequisite is ES5 JavaScript. The tutorial makes analogies to HTML/CSS/React and other web technologies, but these aren't crucial to understanding the material.

drieddust 10y ago
Thanks for putting the effort. Though my knowledge is limited but I don't get this. Why React is different from React Native? Ideally web should be another target just like iOS or Android.
- dabbott 10y ago
  The "React" part is the same regardless of web or native. But there are a lot of other concerns for web (css, DOM stuff, and integrating libraries that use those two). Ideally web is just another taraget :) https://github.com/necolas/react-native-web https://github.com/necolas/react-native-web That said, while writing a website with react-native-web is potentially interesting for new sites, it can be less worthwhile for an existing site to just embed a little bit (which is one of the huge values of React). It's also still very experimental. But I suspect it will be supported in a huge way soon.
- spicyj 10y ago
  React DOM is a sibling of React Native that integrates directly with web APIs and allows you to use <div /> and <span /> directly instead of RN APIs like <View />. You're correct that there's no theoretical reason that RN apps can't run on the web; as dabbott mentions, react-native-web is one third-party attempt at this. We'd like to support this officially one day but don't currently have a high-quality solution we can recommend.

bennyg 10y ago

As someone who dove headfirst into RN without JS/React experience (~5 years of iOS), you don't need to know any of that stuff beforehand. I haven't gone through (or really looked in-depth) this tutorial, but I can say that the ES{x} features are pretty easy to grok once you've seen and written them a few times. Most of the syntax specifics are easy to pick up just by reading code. The biggest things I'd focus on for starting into RN is: - React lifecycle (componentDidMount, willUnmount, shouldComponentUpdate, etc) - Add render counts into your debug builds so you know if components are re-rendering way more than they should (shouldComponentUpdate is your friend here). Other than that, learn by building. Keep an open mind to frustrations since RN changes rapidly, and the documentation/examples/libraries online are not the most up-to-date.

hackcrafter 10y ago
Nice, I'm going to jump strait into this then. Thanks! I did find the You Don't Know JS[0] book series extreamly helpful as a C++/Python coder who has only done enough JS to get by. But that is the extent of my prep for learning React Native. Interestingly, the YDKJS author (Kyle Simpson) is very down on the adoption and heavy usage of ES6 class notation and the over-reliance of the syntactic appearance of a OO-language class systems in JS. His argument is the abstraction will leak the in-its-own-right powerful delegation system of JS prototypes, so why not just learn/use raw objects or his OLOO (objects-linked-to-other-objects) pattern. I find it hard to mentally map the ES6 class to the equivalent object+prototype structure it is syntax sugar for, so just throw my hands up and for the most part pretend they are Python style open-objects. [0] https://github.com/getify/You-Dont-Know-JS https://github.com/getify/You-Dont-Know-JS

drieddust 10y ago

I tried survivejs but whole complexity and explanations started falling apart when flux and whole concept of provider was introduced. [1] http://survivejs.com/react/implementing-kanban/react-and-flux/ http://survivejs.com/react/implementing-kanban/react-and-flu...