Skip to content

Instantly share code, notes, and snippets.

Avatar

Eirik L. Vullum eiriklv

View GitHub Profile
@eiriklv
eiriklv / component-using-mixin.js
Last active Jun 4, 2019
React Masonry Mixin Example
View component-using-mixin.js
/** @jsx React.DOM */
'use strict';
var React = require('react');
var MasonryMixin = require('./react-masonry-mixin.js');
var masonryOptions = {
transitionDuration: 0
View create-reconnecting-websocket.js
/**
* Import dependencies
*/
const { EventEmitter } = require('events');
const ReconnectingWebSocket = require('reconnecting-websocket');
/**
* Export a function that creates a websocket connection interface
*/
export default function createReconnectingWebsocket(uri) {
@eiriklv
eiriklv / avoiding-exceptions.js
Last active Feb 2, 2019
Exception free JavaScript?
View avoiding-exceptions.js
/**
* WHY? - BECAUSE EXCEPTIONS/TRY/CATCH IS A GLOBAL HORRIBLE MESS :-(
* Check out error handling in golang: https://blog.golang.org/error-handling-and-go
*/
/**
* Wrap an "unsafe" promise
*/
function safePromise(promise) {
return promise
@eiriklv
eiriklv / App.css
Last active Oct 27, 2018
Idiomatic React and Redux
View App.css
.App {
text-align: center;
}
.App-logo {
animation: App-logo-spin infinite 20s linear;
height: 10vmin;
}
.App-header {
@eiriklv
eiriklv / a.js
Last active Sep 20, 2018
Instance method anti-pattern
View a.js
/**
* Instance method anti pattern
*/
class MyComponent extends React.Component {
computeThatThing() {
return this.props.a + this.props.b;
}
render() {
return (
@eiriklv
eiriklv / conventions.md
Created Sep 20, 2018
Component class conventions
View conventions.md

React Conventions

  • Method ordering
  • PropTypes + DefaultProps
  • Destructuring from props and state (intent)
  • Avoid instance methods (only for things that matters to React)
  • Components > render methods (renderElements/renderItems/etc)
  • Pure render function (no window or Math.random())
  • Containers (connected) vs. Presentational Components (pure)
@eiriklv
eiriklv / seatbelt.js
Last active Aug 22, 2018
Seatbelts on!
View seatbelt.js
const { log } = console;
const Undefined = new Proxy(function() {}, {
get(target, key, receiver) {
if (key === 'name') {
return 'Undefined';
}
return Undefined;
},
View build.js
/**
* Dependencies
*/
const spawn = require('cross-spawn');
/**
* Package.json
*/
const packageJson = require('../package.json');
@eiriklv
eiriklv / server.js
Last active Apr 26, 2018
Simple server
View server.js
/**
* Dependencies
*/
const express = require('express');
const history = require('connect-history-api-fallback');
/**
* Environment / configuration
*/
const port = process.env.PORT || 3000;
View exercises.txt
1. Basic Syntax
- http://jsbin.com/kixovom/
2. Types and Literals
- http://jsbin.com/bagofoc/
3. Truth and Equality
- http://jsbin.com/feyepub/
4. Functions
- http://jsbin.com/tuzezip/
5. Objects
- http://jsbin.com/qukaqig/