First impressions on React Native
Daniel Schmidt 27. Mar 2015
Earlier today Facebook open sourced a pile of happiness on web developers all over the world called React Native. Of course there was no other option than freaking out and give it a try with a quick prototype! I would like to share my first findings with you:
iOS development has never been easier
At least for me as a frontend developer this is definitely true! In my bachelor thesis I developed a small iOS application and even though it had just a few screens and features it was really hard to develop. Not only layouting was counter intuitive, Xcode brought various problems with it and there was another (low level) language to be learned. Also the APIs were not as smooth to use as JS libraries normally are (callback hell instead of promises was a recurring thing). React native solves many of these problems (plus react is also a mayor design improvement for webapps) and empowers you to build applications for iOS really fast (soon there will be Android support as far as I know). I mean, as I started developing I thought: “Well at least I can write JS for the iOS application and don’t have to bother with Objective-C”, but I didn’t think that I could develop an application (almost) as fast as I can develop a web application.
At weluse I work for a great startup, productmate, who builds a platform for local shops to display their products. As the API is really easy I decided to give it a try, here is the final result:
It was developed in about 3 hours with no existing knowledge about React (except watching half of the react-conf videos and having the primer open in a tab for a week). This was really impressive and not at last due to my next point:
The error messages are really, really verbose
I mean, they even give you tips if you may have a typo, they have a nice stacktrace displayed. They are in fact everything I ever wanted from a frameworks error output (angular.js, I’m looking at you and your $digest errors). It’s really hard to tell how great they are, you have to try it on your own. I had no error which I couldn’t track down within two minutes.
Also to be mentioned here is that
console.log works fine and logs into the iOS Application logs, to be seen in Xcode.
ES6 on the rise
As I took into the Movies Example it took me a few seconds until I realised that the js code isn’t broken or looking funny, but it’s written in ES6. This is really cool, because different APIs like the
promise API are landed and it's a whole lot of fun to use them. Arrow functions, deconstructing and modules are supported and various other features, too. If you would like to have a quick intro into ES6, check out my slides.
The best of the web here for you
I already mentioned my struggle with autolayouting on iOS, but I would like to emphasise this. You can now use a sufficient subset of CSS to layout your iOS App and provide a good level of consistency with almost no effort. In addition you don’t have to be slowed down by rebuilding your whole application on each little code change, simply reload your simulator (I hope someone builds an automatic reload soon)! You can also use the
debugger keyword as always to pause your code (if you have opened the safari inspector) which is really handy if you try to debug your application.
Also the best of iOS here (or almost here) for you
iOS has a wide range of great APIs which have never been accessible for web devs. But now with react native this door has opened, which is great. I have to say that there are still some APIs which aren’t open source / available, but the cool / unique ones like Push or Map are there. The Map is the one I tried out and it was really easy to use, but it’s still missing some options the original API provides (but I am working on this one). What is really cool about react native is that it is easily extensible; If there is a missing API or package it lets you build wrapper for them.
There are untackeled problems left
To my mind they are just inconveniences, but I didn’t want to leave them out:
- There is still too much XCode config to be done (
Info.pliststill have to be managed manually)
- A way to inspect the views like you can do it with the DOM would be a great thing