Get ready for a whole new world of possibilities!

My Journey with React Native

Ashiq Muhammed
5 min readMay 17, 2017

As a web developer I have developed applications for the web platform for some time now, but was recently faced with a situation where I had to develop for a mobile platform. The android developer on our team was on leave and we were left with the two of us, myself and Ronnel, our IOS developer. Being a web developer my first choice was to go with Cordova or Phonegap considering its ease and earlier experience. So we patched up the app using Polymer and Firebase and put it to test with Phonegap. And as expected, the result wasn’t too exciting either. All the animations were choppy and the loading between pages took ages. So we sat down and looked at our alternatives. The first option was to get set up with Android Studio and do it the proper way, but then the learning curve was huge. So going forward with Android studio was clearly not an option.

React Native to the Rescue!

So this is when we started looking into React Native as a possible solution. React Native was gaining popularity with every new day and developers everywhere were talking about it. So we sat down and started researching our possibilities with React Native.

You will never take JavaScript down

Anyone with good experience working on a JavaScript development environment could get straight to it and get everything set up with in a few hours.

To begin with, by choosing react native as our development environment there would be less time spent in development when compared to Android Studio. Anyone with good experience working on a JavaScript development environment could get straight to it and get everything set up with in a few hours. And the best thing is that the code in the final build is a product that’s not a webview but a native, effecient app. React native was developed to meet three main requirements — simplicity, scalability and to be as fast as possible. What react native actually does is embed the JavaScript files in the app, and then runs them locally. In react native we can write JavaScript code but the framework will generate its corresponding native widgets, whether it be buttons or views or images. Like I said before there is no webview, instead our JS code runs in a thread that will create and destroy native widgets within the app.

Getting a good start

So there are some things you should keep in mind while in the early stages of development, the things that helped me in my journey with react native. I will list some of them here that can help you get a good start.

Setting up your development Environment should be done with utmost care. Get a good editor ready for writing your react native code. If you are concentrating solely on IOS development then Deco IDE is a good option with its preset widgets and other features. Another notable software is Expo which is an XDE which can help you get you started without Android Studio and its other dependencies.

Always test your build on an actual device than using an emulator. This is because an emulator can give you results which might not even come close to the case when you actually test it on a device. It can cause you to hog up bugs of all kinds, all along your development process and you might only notice this at very the last moment. So its better to test it with an actual device as you debug your build.

Because it is native!

If you are building for both Android and IOS platforms using react native make sure you do it concurrently. React native is mostly cross-platform, but there’s lots of little stuff like IOS and Android handling various components differently. One part that works perfectly with IOS might give you an error when you build it for Android. So make sure you take care of this scenario as well.

This one is very important, keep reading the official documentation for react native from the guys at Facebook. Any changes or updates to the framework is going to show up there first. So you don’t wanna be the last one knowing about whats happening with react native.

And the last thing chose a coding editor of your choice. Be sure that the said editor supports react native code snippets and other handy features. In my case I started out with Atom with a plugin for React native from Facebook called Nuclide. It is a pretty stable environment to get your work started. Other than that Atom also provides other plugins and packages that can be manually installed which can help with in editing your code. There are also other editors favourable for react native development like sublime text and brackets that also comes with various features.

The Conclusion

So the hardest part in dealing with a react native development environment was the set up time. Especially for Mac users where you might have storage limitations they can ask you to download Android Studio and its other dependencies which can hog up a lot of your storage space. But after researching a lot I found a way around it. It still takes some time do this, but for those who interested in knowing more about how this can be achieved, I will writing another article soon. So finally we were almost at the end of our development course with React native, and I gotta say that its been one hell of a ride. Especially from the perspective of a web developer its an entirely new and challenging experience. Once you have worked with react for some time, you will learn to step out of your comfort zone and try approaching a problem from a totally different angle. At the same time react native will make you feel like you are in home waters with its simplicity and JavaScript like environment. I would recommend every web developer to try their hand at react native. I can guarantee you that it will be a very welcoming and rewarding experience.

Its actually pretty awesome!

Best of luck for your further endeavours with React Native. Show some love if you liked this article and do feel free to ask your questions and doubts in the comments section below

--

--