Skip to content

Instantly share code, notes, and snippets.

View cjohansen's full-sized avatar

Christian Johansen cjohansen

709 followers · 4 following
View GitHub Profile
@cjohansen
cjohansen / component.js
Created September 11, 2015 13:37
export function createComponent(render) {
var def = typeof render === 'function' ? {render: render} : render;
render = def.render;
def.render = function () {
const {data, children} = this.props;
return render.call(this, data, children);
};
if (!def.getInitialState) {
@cjohansen
cjohansen / reapp.js
Created September 11, 2015 13:21
/*global React*/
import {createApp} from '../../src/reapp';
import assign from 'lodash/object/assign';
import pick from 'lodash/object/pick';
const {h1, div, p, a, button} = React.DOM;
const app = createApp(document.getElementById('app'), {
routes: [
['viewUser', '/users/:id'],
['editUser', '/users/:id/edit']
@cjohansen
cjohansen / element.js
Created June 10, 2015 08:14
function mkElement(tag) {
return function () {
return React.createElement.apply(React, [tag].concat([].slice.call(arguments, 0)));
};
}
var div = mkElement("div");
var h1 = mkElement("h1");
@cjohansen
cjohansen / reactorama.js
Created May 27, 2015 10:07
createComponent is 18 lines of JavaScript that puts a lean and enjoyable interface on top of React's somewhat clunky and non-JSX-hostile API.
// Most components are defined fully by their render function,
// and all they need to access is the props
var myComponent = createComponent(function (props) {
return React.DOM.h1({}, "Hello " + props.name);
});
// ...which can be done very succinctly with ES6:
const {h1, div} = React.DOM;
const myComponent = createComponent(({name}) => h1({}, `Hello ${name}`));
@cjohansen
cjohansen / stasis.html
Created February 2, 2015 16:12
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta http-equiv="X-UA-Compatible" content="edge">
<title>Building static sites in Clojure with Stasis</title>
<meta name="author" content="Christian Johansen">
<meta name="robots" content="all">
<link href="http://feeds.feedburner.com/cjno-en" rel="alternate" type="application/rss+xml" title="cjohansen.no blog-feed">
@cjohansen
cjohansen / react.js
Last active September 15, 2016 09:26
function appUI(actions) {
return React.createClass({
render: function () {
return React.DOM.h1({onClick: actions.doit}, 'LOL');
}
});
}
var data = {}
@cjohansen
cjohansen / react.js
Created January 21, 2015 09:28
function loginUI(actions) {
return React.createClass({
render: function () {}
});
}
@cjohansen
cjohansen / react.js
Created January 21, 2015 09:28
function loginUI(actions) {
return React.createClass({
render: function () {}
});
}
@cjohansen
cjohansen / par.js
Created October 17, 2014 08:47
function setPixelAspectRatio(ratio) {
var canvas = document.createElement('canvas');
canvas.width = originalImage.width * ratio;
canvas.height = originalImage.height;
var ctx = canvas.getContext('2d');
ctx.scale(ratio, 1);
ctx.drawImage(originalImage, 0, 0);
imageEditor.loadImage(canvas);
}
@cjohansen
cjohansen / oo.css
Created October 10, 2014 10:57
.mod, .tabs, pre, h1, h2, h4, h5, p, ul, ol, hr, table {margin: 1rem 0;}
.bd, .media {overflow:hidden;}
.media .img {float:left; margin-right: 0;}
.media .imgExt {float:right; margin-left: 0;}