Skip to content

Instantly share code, notes, and snippets.

@threepointone
threepointone / glam-for-css-folks.md
Last active September 4, 2022 07:43
why css purists will love glam

I made a little styling lib called glam

(some features are in development)

one

let's start off with the simplest use case. we'll make an 'index.html' page, and assume we've setup our js bundler to output bundle.js

const MODULE_DIR = /(.*([\/\\]node_modules|\.\.)[\/\\](@[^\/\\]+[\/\\])?[^\/\\]+)([\/\\].*)?$/g;
{
loader: 'babel-loader',
test: /\.jsx?$/,
include(filepath) {
if (filepath.split(/[/\\]/).indexOf('node_modules')===-1) return true;
let pkg, manifest = path.resolve(filepath.replace(MODULE_DIR, '$1'), 'package.json');
try { pkg = JSON.parse(fs.readFileSync(manifest)); } catch (e) {}
return !!(pkg.module || pkg['jsnext:main']);
import { createStore, combineReducers } from 'redux'
const createInjectableStore = (createStore) => {
return (reducers) => {
const store = createStore(combineReducers(reducers))
const replace = () => {
store.replaceReducer(combineReducers(reducers))
}
store.injectReducer = (key, reducer) => {
reducers[key] = reducer
@d-akara
d-akara / JavaScriptSafeNavigation.md
Last active April 11, 2024 16:18
JavaScript Safe Navigation

Experimental Safe JavaScript Navigation

Implemented using ES6 Proxies and Symbols

The purpose of this function is to provide a way to avoid deep nested conditionals when traversing a hierarchy of objects. Some languages use an operator such as '?.' to perform this capability. This is sometimes called safe navigation or null conditional operators.

You can somewhat think of this as how a xpath select works. If any nodes along the path are not found, your result is simply not found without throwing an exception and without needing to check each individual node to see if it exists.

Suggestions for improvements welcome!

@skevy
skevy / gist:8a4ffc3cfdaf5fd68739
Last active February 4, 2017 04:59
Redux with reduced boilerplate

Note

I would recommend @acdlite's redux-actions over the methods suggested in this Gist.

The methods below can break hot-reloading and don't support Promise-based actions.

Even though 'redux-actions' still uses constants, I've come to terms with the fact that constants can be good, especially in bigger projects. You can reduce boilerplate in different places, as described in the redux docs here: http://gaearon.github.io/redux/docs/recipes/ReducingBoilerplate.html


@gaearon
gaearon / combining.js
Created June 3, 2015 18:03
Combining Stateless Stores
// ------------
// counterStore.js
// ------------
import {
INCREMENT_COUNTER,
DECREMENT_COUNTER
} from '../constants/ActionTypes';
const initialState = { counter: 0 };
@ryanflorence
ryanflorence / Dialog.js
Last active January 9, 2021 16:12
React Portal.js
var Dialog = React.createClass({
mixins: [Portal],
createPortal: function() {
this.dialog = $(this.portalNode).dialog({
autoOpen: false,
title: this.props.title,
close: this.props.onClose
}).data('ui-dialog');
},
@kachayev
kachayev / css-parser.md
Last active November 12, 2022 04:20
Parsing CSS file with monadic parser in Clojure
@gilr00y
gilr00y / gist:70f2d0ac43049cba059f
Last active August 29, 2015 14:02
ActiveRecord Cross-DB transactions
# AR transactions wrap a block of code, issuing a rollback if any errors are raised.
#
#(note: this gist makes use of SecondBase https://github.com/customink/secondbase)
require 'secondbase/model'
AR = ActiveRecord::Base
SB = SecondBase::Base
# The transaction returns the return value of the block
AR.transaction { 14 } #=> 14