• This article is Marno original, reprint must retain source!
  • The public account [aMarno], after concern, reply RN to join the exchange group
  • React Nativewww.marno.cn

One, foreword

A few days ago, I wrote a tutorial on how to get started with React Native: A Detailed Guide for All Developers to Get started with React Native (Stage 1), which summarized my experience in learning React Native. In just a few days, I read more than 3W books online. A lot of people added me to wechat and asked me if I have a follow-up tutorial, there is definitely! The React Native Detailed Guide for All Developers (Stage 2) (…..) Now the basic outline has been completed. Because the entry is still relatively simple, the more later learning may be to master the more things. In the second stage of learning, I really did not step on the pit, I have also recorded, the following article will be updated.

Answer some questions

1. How many stages are there in the tutorial?

A lot of people ask me about this on wechat, so there are only four stages. You can see my Mind map of HelloRN project on Github, and that is the basic outline. The structure of the tutorial is still evolving because I’m still learning. In the establishment of a perfect knowledge system on the road is certainly not repeated adjustments. Also draw lessons from the experience of many predecessors! Thank you again! (Knees!)

React Native and Weex?

This is the second question many people ask! Let me briefly explain my opinion. Both of them use JS to implement Native functions. RN comes from Facebook and Weex comes from Alibaba. Well, let’s choose RN! Why? ! Check out Medium, Twitter! Because there was almost no Weex there. Maybe Weex hasn’t been pushed abroad yet? However, there is no right or wrong technology, learn which are the same skill!

3. Why write a separate project, like the demo in Phase 1?

The demo in the tutorial is a mix of many small demos written during the learning process, although the subcontracting management is carried out, but it still looks messy. Therefore, a separate project is written to maintain the demo, which only realizes about 30% of the functions of Eye-opening 3.1.2 so far (you ask me the remaining 70%? I haven’t learned it yet)!

Three, the front is nonsense, look at the following ↓↓↓

4. Screenshot preview

select Personal center

5. Main technical framework

Currently used

  • “Native base”: “^2.0.5” (integrated framework)
  • “React-native banner”: “^0.1.0” (banner AD, based on react-native swiper)
  • “React-native – parallax-scrollview “:” 0″
  • “React-native Tab-navigator “: “^0.3.3”
  • “React-native -vector-icons”: “^4.0.0”
  • “React-native video”: “^1.0.0”

We’ll use it later

  • “React-native storage”: “^0.1.5”
  • “React-native swiper”: “^1.5.4”
  • “React-native Easy-toast “: “^1.0.5”

Vi. Warehouse Address:react-native-eyepetizer

How to run this project? If you have any problems, please send an issue to me on Github directly or leave a message to me

Vii. Project experience

In fact, in the process of writing this demo or summed up some experience, I will write articles and share with you. For example, the use of pictures, it is better to use an entry class for unified management; As well as naming style variables, it is best to use the styles name…… everywhere Of course, there are some other tips, which I’ll see in a follow-up article. Also hope that if you have a good experience, you can comment back to me! Thank you very much!

Eight, the statement

  • The interfaces used are from the network, please do not use! Respect original copyright