React Amsterdam – a few quick takeaways

Alex-1
Alex-1

This was my first React dedicated conference, and to be honest I had my reservations. There is only so much you can fit into a single topic. One day single track conf turned out to be quite diverse to keep the attention all the way. As usual I was keeping random notes from the event. All notes and ideas are originated from talks, but are not necessarily direct quotes.

Alex-2
Alex-2

React Native

If you always wanted to try RN but were afraid of the tools and setup you have to do prior to writing a single line of code, fear no more. There is a service that allows you to write and run native iOS/Android apps in browser as you type. Basically, JSBin for React Native. Meet rnplay.org. It also allows you to switch and try apps on your actual native device.

Behind the scenes there is Appetize.io service that streams iOS or Android simulator directly into your browser. As far as I know there are no real devices involved, but native simulation is a great start. In fact, React Native official documentation now uses the very same embedded simulation for illustrating the examples. Go ahead, run some native iOS apps in your browser.

Alex-3
Alex-3

Tinker. Release. Repeat.

Another interesting initiative is React Native Package Manager - RNPM. Managing modules with native dependencies is not easy at the moment, and RNPM is here to help. There are rumours that it might even be included as part of RN offering (and it is already mentioned in the official RN documentations as a preferred way of linking).

JSS

JSS builds on top of  @Vjeux's idea that you can specify CSS properties of HTML elements as part of JSX declaration (which compiles into JS). The original approach lacks quite a few things like media queries and pseudo classes support. Christopher himself said that you should use common sense and combine inline CSS in JSX with conventional stylesheets.

Not anymore. JSS supports all CSS properties, can easily be used with React components, or simply compiled into CSS. It also offers dead code elimination, name scoping, rule isolation and fast selectors. It is even claimed to be faster than conventional CSS. And if you like idea of plugins, it has them too. The selection is far from PostCSS plugins catalog, but give it time and some crayons.

Apollo by Meteor

GraphQL is a great way of communicating data from backend to clients. It also requires a bit of setup. It is just a language, as a developer you will have to implement server side and client side support. On a server side it is likely that you’d use GraphQL layer as an opportunity to unify multiple RESTful (or otherwise) endpoints into a single GraphQL API. On a client you would in turn create and consume GraphQL requests either directly, or with something like Facebook Relay.

This is where the Apollo project steps in. Apollo server helps you consolidate multiple data sources into a single GraphQL endpoint. Apollo client help's you to consume that endpoint, provide pagination, reactivity and optimistic UI updates.

Both are still very much in development and not really ready for prime time. There isn't even much details on how exactly it'll work.

MobX

Recent tweet by Dan Abramov

Unhappy with Redux? Try MobX: https://t.co/7urLgKA9hZ

— Dan Abramov (@dan_abramov) April 23, 2016

MobX (former Mobservable) allows you to observe changes in things and act when those changes are happening. It uses ES6 decorators to help you wrap existing things (like app state and React components) into observables and computables. Observables are things that are being watched for changes. Computables are the things that must be updated as a result of a change.

If you choose so, MobX can be used as a Redux alternative. Like Redux, it promotes pure functions and is built on Functional Reactive Programming principles (FRP). You define observables and things that can change as a result, and then sit and watch how things are happening automatically.

There is pretty good 10 min MobX interactive tutorial available for playing.

Tweet Cube

Alex-4
Alex-4

A cube that projects tweets. Bonus for the cat userpics.

It would be a perfect companion to the throwable cube mic.

Venue

The place was called Pllek. From the official description:

This post-industrial spot with a beach-like atmosphere offers one of the best panoramic views of the IJ River… Pllek also is home to Amsterdam's largest disco ball at night.

To get there you cross the IJ river on a ferry from Amsterdam Centraal station. The place is pretty bizarre, with a rusting Soviet submarine in the bay, cranes, sea containers and a chilly wind. I even made a short film on getting there and back.

I get the feeling that organisers didn’t expect the weather to be so cold in the mid April - it was pretty chilly inside. There were lots of developers from Netherlands, but also from all over the Europe. It was a chilly, crowded, but very friendly event with nice snacks and coffee. It was also first of a kind, and they do intend to continue next year.

Alex-5
Alex-5

Chilly weather didn't affect popularity of the (free) ice cream stand

Alex-6
Alex-6

This trip was possible thanks to Red Badger's learning budget perk. Join us, and you'll get it too!