React.Amsterdam 2016
React.Amsterdam was the first ever React.js conference in Amsterdam and took place on April 16th at Pllek, an old shipbuilding factory in Amsterdam Noord. The event was organized by the local Amsterdam React Meetup group and as the organizers said: “We are very ambitions to make Amsterdam React capital of Europe.” I went to the conference with two of my Elements colleagues to learn more about React.
Migration to React
The first speaker for the day Jamis Charles, UI Engineer at PayPal, talked about the migration to React at PayPal. We all know how big PayPal is and how they didn’t change their interface for years. The reason for that is the usage of non-scalable technologies: in PayPal’s old stack about six weeks were needed for even a very small change. In 2014 they replaced C++ and XML to Kraken.js, Dust.js and Backbone.js but the front-end code was still not very well maintainable, so they also started to replace the Backbone views with React components. The whole process started with replace on small and not very important components, so if they would have failed, nobody would have been affected. Gradually they continued to replace other parts of interface: Backbone.js Router with React Router and Backbone models with Redux. The talk showed us how “pluggable” and modular React really is and how you can start from a small piece and update everything step by step from there. It doesn’t matter how big is your project, just a perfect example for the React’s scalability.
React Native
There were also several talks about React Native, which enables native iOS and Android development with React.
Tadeu Zagallo from Facebook London explained how React Native works in depth. It was really a useful talk: We learned about different steps during runtime, how JavaScript calls native modules and vice versa. But the most important for me was to understood that React Native has three main threads: a JavaScript thread that runs all JS, a main thread where all native UI work happens and “shadow queue” which handles all layout (converting CSS flexbox model to a real position of the screen).
Alexey Kureev and Mike Grabowski gave a talk about the React Native Package Manager (RNPM). One of the problems that I had when playing around with React Native was how to install the native modules. Usually you have to install a JS module from npm and after that you download and include some java/object-c files and assets. For non-mobile developers like me, that can be really painful. RNPM is here to solve this problem with just one terminal command. The good news is that the guys are working on merging RNPM with the React Native CLI, so in the near future we don’t have to use several different tools for the same thing.
Joshua Sierles presented React Native Playground, a JSFiddle-like environment where you can run React Native apps directly in a browser. It’s pretty cool because you can share snippets with colleagues or clients and they don’t need to install anything, just open the link from the browser and they have an app on their device. The official React Native documentation will also include this functionality very soon.
Other interesting topics
There were many other interesting talks, so highlights:
- Server-side rendering: lots of benefits like SEO, fast initial rendering (which is really important especially on mobile). Cons: can become too complex in large projects.
- Testing React components is really easy and enjoyable with libraries like Enzime.js (by AirBnB) which provides a very intuitive and flexible jQuery-like API.
- React can be the connecting point between designers and developers with tools like React Storybook which enable you to focus on a single component and its state. Also React is very useful in combination with libraries such as SourceJS (it can generate a style guide from your components).
- State management doesn’t look difficult with MobX which use observables to detect and apply state changes.
- React can be used for simple games in a very declarative way (see the below image).
Closing thoughts
During React Amsterdam I met a great developer community that brings so much (open source) cool stuff to the public. For the last year we saw how React is getting better and better and currently we could use it for so many different platforms: in the browser, native on mobile, on TV and even native Windows 10 apps. I believe the community will grow and this conference was only the first step. I’m looking forward to learn new exciting things in upcoming React meetups and I hope the conference next year will be bigger.
Originally published at www.elements.nl on April 19, 2016.
