Skip to content

Instantly share code, notes, and snippets.

Avatar
🖖
dribbble.com/joeyfigaro

Joey Figaro joeyfigaro

🖖
dribbble.com/joeyfigaro
View GitHub Profile
@joeyfigaro
joeyfigaro / _colors.scss
Created Dec 15, 2017
Personal approach for supporting multiple themes and organizing required colors
View _colors.scss
$shared: (
yellow: #fec52e,
purple: #ca4392,
blue: #2259e4,
sky_blue: #22ade1,
green: #1bdddb
);
$themes: (
dark: map-merge(
@joeyfigaro
joeyfigaro / devtools.js
Last active Jun 16, 2017
Real World Ramda: Readable Redux Stores (devtools.js)
View devtools.js
// client/store/devtools.js
import { curry, is, ifElse, allPass, isNil, not, identity } from 'ramda';
import { compose } from 'redux';
import { Iterable } from 'immutable';
const windowExists = is(Object, window);
const extensionCompose = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__;
const extensionComposeExists = not(isNil(extensionCompose));
const isImmutable = curry(Iterable.isIterable);
View index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<script id="jsbin-javascript">
@joeyfigaro
joeyfigaro / ramda-composition.js
Last active Jun 16, 2017
Ramda Composition Example
View ramda-composition.js
const props = ['users', 'lessons', 'favorites', 'history'];
const selectProps = pick(props);
const stringify = compose(
JSON.stringify,
selectProps
);
stringify({
sensitive: {
@joeyfigaro
joeyfigaro / configureStore.js
Created Jun 16, 2017
Ramda & Redux (when example)
View configureStore.js
function sayHello() {
return console.log('Hello.');
}
when(
equals(true, true),
sayHello
);
// -> Hello.
@joeyfigaro
joeyfigaro / configureStore.js
Last active Jun 16, 2017
Ramda & Redux (pick example)
View configureStore.js
store.subscribe(() => {
const state = store.getState();
storage.set('saved', pick(['lessons', 'auth', 'notifications'], state));
});
/*
{
saved: {
lessons: {...},
auth: {...},
@joeyfigaro
joeyfigaro / configureStore.js
Last active Jun 16, 2017
Real World Ramda: Configuring Your Redux Store
View configureStore.js
// client/store/configureStore.js
import { createStore } from 'redux';
import { compose, when, equals } from 'ramda';
import enhancer from 'client/store/enhancers';
import rootReducer from 'client/reducers';
function configureStore(initialState) {
const store = createStore(rootReducer, initialState, enhancer);
const addStoreToObj = obj => (obj.store = store);
@joeyfigaro
joeyfigaro / .hyper.js
Last active Apr 2, 2017
HyperJS Backup
View .hyper.js
// Future versions of Hyper may add additional config options,
// which will not automatically be merged into this file.
// See https://hyper.is#cfg for all currently supported options.
module.exports = {
config: {
// font family with optional fallbacks
fontFamily: 'Menlo, "DejaVu Sans Mono", Consolas, "Lucida Console", monospace',
// terminal cursor background color and opacity (hex, rgb, hsl, hsv, hwb or cmyk)
@joeyfigaro
joeyfigaro / .hyper.js
Created Apr 2, 2017
Initial hyperjs config
View .hyper.js
// Future versions of Hyper may add additional config options,
// which will not automatically be merged into this file.
// See https://hyper.is#cfg for all currently supported options.
module.exports = {
config: {
// font family with optional fallbacks
fontFamily: 'Menlo, "DejaVu Sans Mono", Consolas, "Lucida Console", monospace',
// terminal cursor background color and opacity (hex, rgb, hsl, hsv, hwb or cmyk)
@joeyfigaro
joeyfigaro / dsl-abstraction-proposal.md
Last active Mar 27, 2017
Early DSL abstraction proposal for redux apps
View dsl-abstraction-proposal.md

Overview

Idea suggests that we contain language within a module, auto-generate plurals and any other pieces off of a singular base, and consume the pieces throughout our code.

constants/language.js

export const USER = {
	SINGULAR: 'account_holder',
	PLURAL: () => `${USER.SINGULAR}s`
};