Blaine Kasten blainekasten

## catch-all-routes.jsx
// 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>
  )

## get-data-list.js
// 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() {

## connect-context.js
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!

## observable-react.js
/*
 * 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';

## 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"
}

## environment.js
// 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:

## constants.js
// 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 =
  {

## jquery.weekcalendar.css
<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">
	// 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>
	)
	// 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() {
	/*
	* 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';
	#!/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"
	}
	// 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:
	// 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 =
	{
	<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">