React Component Playground, React Native Fish

2015-05-05 17:33:53 +0100 by Alex R. Young

React Component Playground

I have a backlog of React submissions, so I thought I'd work through them rather than spacing them out over a few weeks. First, React Component Playground (GitHub: FormidableLabs/component-playground, License: MIT, npm: component-playground) by Ken Wheeler is a React component that allows you to edit a React component with a live preview. You can try it out on the project's homepage -- see the button example near the top.

Normally with React/Angular/etc. you're constantly waiting for the build/refresh cycle, but with this project you can experiment a little bit to get results more quickly. As the example suggests, this is useful when working with React styles.

The same author also wrote nuka-carousel (GitHub: kenwheeler/nuka-carousel, License: MIT, npm: nuka-carousel), which is a React carousel component.

React Native Fish

Fish example

If you're looking for a fun React Native project, then check out Ivan Starkov's react-native-fish (GitHub: istarkov/react-native-fish). It's a graphical experiment that generates a trial of objects that looks like a fish. It's pure JavaScript and doesn't use any images.

It's interesting to see how React Native can be used to draw abstract things that aren't NSWhateverViews. I noticed that it uses arrays from the gl-matrix module, and immutable.