blainekasten’s gists

blainekasten / catch-all-routes.jsx

Last active June 4, 2020 14:01

Unified Routes

	// filepath: src/pages/product/[...id].js
	// This is an example of a fallback route for your product collection route. If a user visites /product/id and the id
	// does not match an id from your dataset, we will render this fallback url with a `/product/*id` named splat

	export default function ProductNotFound(props) {
	return (
	<div>
	<h1>Product not found</h1>
	</div>
	)

blainekasten / get-data-list.js

Created November 16, 2017 20:19

RenderProps vs HOC

	// This Component fetches data from a server and then renders its children.
	// Important to remember that any time the parent component re-renders, this component re-renders also.

	// I think the main difference is this version makes the fetching a Child while the HOC makes the fetching a Parent.
	export class GetDataList extends Component {
	props: { children: Function }

	state = { dataList: null };

	componentDidMount() {

blainekasten / connect-context.js

Last active June 2, 2020 15:52

Use Redux Connect, with context in your map* methods!

 import React from 'react';
 import { connect as reduxConnect } from 'react-redux';
 function wrapWithContext(mapStateToProps, mapDispatchToProps, contextTypes, component) {
   return class ConnectedComponent extends React.Component {
     constructor(props, context) {
       super(props, context);
       /*
        * This is the magic right here!

blainekasten / observable-react.js

Last active December 31, 2016 06:10

Makes paths observable to state locations.

	/*
	* This is just a concept to use ES6 Proxies for a flux-like implementation where
	* components are observers of state nodes. Using Proxie setters, when the specific
	* state node is mutated, the components who observe that are re-rendered on the spot.
	*
	* likely missing some logic, just a concept
	*/

	import state from 'state';
	import { componentToStateMap, pathMapper } from 'pathMapperProxy';

blainekasten / post-merge

Last active August 29, 2015 14:18 — forked from sindresorhus/post-merge

	#!/usr/bin/env bash
	# MIT © Sindre Sorhus - sindresorhus.com


	changed_files="$(git diff-tree -r --name-only --no-commit-id ORIG_HEAD HEAD)"

	check_run() {
	echo "$changed_files" \| grep --quiet "$1" && eval "$2"
	}

blainekasten / environment.js

Last active September 11, 2020 12:39

Mirroring Rails Environment in Javascript

	// This should actually be a .js.erb file so you can interpolate Ruby code in it
	// I left it off the file naming because the gist would color words weird when .js.erb
	// was the file extension

	;(function(window){
	var _environment;

	/*
	* Namespace.
	* You could name this anything you want, even stick to rails conventions and do:

blainekasten / constants.js

Last active January 3, 2016 06:19

Javascript Constants

	// Ever need to create constants in javascript?

	// Option 1:

	// Browser Support: ie9+ ff4+ chrome6+ opera12+ safari 5.1+

	// You must wrap your constants variables in an object:

	var constants =
	{

blainekasten / jquery.weekcalendar.css

Created March 28, 2013 15:55

Backbone Calendar Structure

	<head>
	<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
	<link rel='stylesheet' type='text/css' href='js/libs/css/smoothness/jquery-ui-1.8.11.custom.css' />
	</head>
	<body>
	<script type="text/html" id="CalendarTemplate">
	<div id="calendar" style="border:2px solid black;">
	<div class="ui-widget wc-container">
	<div class="ui-widget-header wc-toolbar">
	<div class="wc-display ui-buttonset">

Blaine Kasten blainekasten