Beginning with React Native
At the beginning of this month we started creating this app, I was having this course of react-native at Udemy, made by Stephen Grider (I truly recommend).
We already knew that react-native is a very powerful library to create multi-platform apps. But when the project comes and they asked if we were able to create an app in one week, we were a little concerned about delivering a project on that , like 'but and the code?', 'can we deliver something useful?', 'and if it wasn’t good enough?', 'What if we find some trouble during the development?', OMG I was scared.
We delivered the app in a week, and we really liked the final result. We also created a splash screen on the Android (the most difficult part - for someone that never developed for the platform).
First of all you have to understand that developing in React Native is a little different from developing a Web App. So the other difficulties that we had:
1. Running Android simulator on a Mac
The problem on running on Mac (I don’t know if it is just on Mac), if you choose the Nexus 5 there is no way to open the developers tool... Because the Command+D doesn’t do anything… So I installed the Nexus S (it is a little more old phone — I think), and it has the menu button that opens the Developers tools 😄
The other problem, well it isn’t a real problem. It’s just that if you are running Docker on your machine, you will not be able to run the Android Simulator because it uses a Virtual Machine to run, and they are not compatible. I took some minutes to figure it out.
2. Updating the react-native.
Ok that was my bad. First we didn’t need to update the project, but there were some warnings on the xcode that me and my friend Raony wasn’t liking that much, so we decided to update it.
First we updated the react-native, react, their peer dependencies…everything, but it didn’t work, we tried the new versions of the react-native and the react, and nothing. I removed the node_modules folder, the yarn cache, and nothing…
We spend about 4 or 5 hours trying to update it, than we found this beautiful command react-native update and we finally could update it. \o/, but the life is not that simple… The warnings still appear on xcode… 😞
3. Splash Screen
Actually I want to 'give' this section to the Android Documentation, they have this documentation that is very good and very declarative, that show you what you should know about the development on Android platform. But the problem is that we didn’t want to learn all the Android documentation to create a simple Splash Screen.
So after a lot of research we found this post that helped a lot, we still had some troubles with the AndroidManifest.xml, that we still doesn’t understand very well, but it’s working… \o/
Now the good parts ;)
First of all we could make a very powerful App in one week, even doing it with just two developers, and one of them (me) never had experience developing in React, it was a little strange on the beginning, but when you get the way, it’s amazing you should try...
2. React Native Documentation
React Native has a very pleasant Documentation that you can find here. There you will find every Component that exists on React Native and how to use it.
And they have a amazing problem solver for the React Native Styles, they will popup an warning on your screen, showing if the tag doesn’t support it and which styles your tag support. If you put a Color style on a View, it isn’t supported and doesn’t work, so a warning like this will be shown:
3. XCode
The xcode can import your project (not considering the JavaScript files), and you can make the whole configuration there, it made everything easier, and I find easier developing on IOS, some answers for some errors.
4. Onboard
On that week I notice that React Native was very easy to catch, after I look at how easy we get the way to develop the App. I had a help from Raony and Vinicius who already had an experience with React on Planrockr, it helped a lot. They assisted me in a lot of doubts about React and Redux, thanks 😉. And it’s very nice to see how easily they get the way to develop on the React Native… It’s wonderful. 😄
That’s all for now, I recommend for you to read this post by Instagram Engineering, explaining when and why they are using React Native in Instagram.
Did you like the post and think this content is useful, give your ❤ that more developers can see it… Thanks 😉
