Skip to content

Instantly share code, notes, and snippets.

store Tasks {
@tasks = []
@undone <- @tasks.filter(task => !task.done)
makeTask(task) { return { title: title, done: false } }
addTask() { @tasks.push(makeTask(task)) }
clear() { @tasks = @undone }
}
type Todo {
completed : bool
text : string
}
state Todos { number: Todo } {
completed < filter('completed')
uncompleted < intersect(completed)
add(data) {
@natew
natew / gist:f0c396442584b071915f
Last active August 29, 2015 14:18
Nested animations through context in Reapp
<ViewList animator> // passes context: { step: 0.555 }
<View /> // extends context with { index: 0 }
<View /> // ...
<View> // extends context with { index: 2 }
// here's the tricky part: you can nest ViewLists, and they should pass their "new" context down to their children
<ViewList> // reset context { step: 0 }
<View /> // reset context { index: 0 }
</ViewList>
</View>
Book
author <- #authors(data.authorId).name
<div.book>
<img src={data.source}>
<div.title>{data.title}</div>
{showAuthor? <div.author>by {author}</div>}
</div>
Main
/* WEBPACK VAR INJECTION */(function(module) {/* REACT HOT LOADER */ if (true) { (function () { var ReactHotAPI = __webpack_require__(/*! /Users/nw/projects/reapp/reapp-pack/~/react-hot-loader/~/react-hot-api/modules/index.js */ 236), RootInstanceProvider = __webpack_require__(/*! /Users/nw/projects/reapp/reapp-pack/~/react-hot-loader/RootInstanceProvider.js */ 230), ReactMount = __webpack_require__(/*! react/lib/ReactMount */ 7), React = __webpack_require__(/*! react */ 2); module.makeHot = module.hot.data ? module.hot.data.makeHot : ReactHotAPI(function () { return RootInstanceProvider.getRootInstances(ReactMount); }, React); })(); } (function () {
'use strict';
var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumer
@natew
natew / main.jsx
Last active August 29, 2015 14:18
/* WEBPACK VAR INJECTION */(function(module) {/* REACT HOT LOADER */ if (true) { (function () { var ReactHotAPI = __webpack_require__(233), RootInstanceProvider = __webpack_require__(230), ReactMount = __webpack_require__(7), React = __webpack_require__(2); module.makeHot = module.hot.data ? module.hot.data.makeHot : ReactHotAPI(function () { return RootInstanceProvider.getRootInstances(ReactMount); }, React); })(); } (function () {
'use strict';
var _interopRequire = function (obj) { return obj && obj.__esModule ? obj['default'] : obj; };
var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (descriptor.value) descriptor.writable = true; Object.defineProperty(target,
@natew
natew / gist:0072ca690f379d175f9f
Last active August 29, 2015 14:18
coffeescript 2.0
import React, Reapp, View, NestedViewList, List from 'reapp'
import RefreshButton, RotatingLoadingIcon, ArticleItem
Article
@state = { refreshing: false }
mount
:articlesHotLoad
refresh
@natew
natew / gist:3e9345f8419e3d4a4af8
Last active August 29, 2015 14:18
Quotes from #reactnative
[14:30] < Glenjamin> my main discovery was that native forms are nothing like web forms
[11:48] < kureev> hazberg: they definitely need to create just a simple toolbar component
[11:49] < kureev> because either you have no control over it, or you need to do everything by yourself
Stylesheet.create({
respond: {
'max-width > 200px': {
}
}
})
@natew
natew / slideablelist.jsx
Last active August 29, 2015 14:15
Slideable List with Reapp
import React from 'react';
import DottedViewList from 'reapp-ui/views/DottedViewList';
import View from 'reapp-ui/views/View';
import { Container, Block } from 'reapp-ui/components/Grid';
import List from 'reapp-ui/components/List';
import Input from 'reapp-ui/components/Input';
import Button from 'reapp-ui/components/Button';
export default React.createClass({
getInitialState() {