- Be a Vim user.
- Install UltiSnips.
- Add the code below to
$YOUR_VIM_FOLDER/UltiSnips/javascript.snippets
.
snippet ii "magic import" b
import `!p
// Create a queue to push events and stub all methods | |
window.analytics || (window.analytics = {}); | |
window.analytics_queue || (window.analytics_queue = []); | |
(function() { | |
var methods = ['identify', 'track', 'trackLink', 'trackForm', 'trackClick', 'trackSubmit', 'page', 'pageview', 'ab', 'alias', 'ready', 'group', 'on', 'once', 'off']; | |
var factory = function(method) { | |
return function () { | |
var args = Array.prototype.slice.call(arguments); | |
args.unshift(method); |
import React, { Component, PropTypes } from 'react' | |
import ReactDOM from 'react-dom' | |
import throttle from 'lodash/throttle' | |
import { INTERVAL } from './constants.js' | |
let bound // are the event handlers bound? | |
let current // current scroll position, from top of document | |
let queue // array of React Components to check |
keycode 66 = | |
keycode 66 = Control_L | |
keycode 133 = | |
keycode 133 = Meta_L | |
keycode 64 = Alt_L | |
clear mod1 | |
clear mod4 |
So migrating my existing app wasn't as troublesome as I originally thought. First thing I did was take a look at my router and routes
and figure try to make a mental model of all the files where I had nested routes in the existing app because those components/containers will contain {this.props.children}
. So I need to replace those with the nested <Match />
components.
So just to give an example:
<Router history={history}>
<Route path="/" component={App}>
// getComponent is a function that returns a promise for a component | |
// It will not be called until the first mount | |
function asyncComponent(getComponent) { | |
return class AsyncComponent extends React.Component { | |
static Component = null; | |
state = { Component: AsyncComponent.Component }; | |
componentWillMount() { | |
if (!this.state.Component) { | |
getComponent().then(Component => { |
<!-- | |
* Liquid Snippet for generating responsive image srcsets based on Shopify's native image transforms. | |
* Published June 17, 2016 by Joseph Bergdoll | |
* www.extendedplay.nyc | |
* | |
* Full list of Shopify's generated image transforms: | |
* https://ecommerce.shopify.com/c/ecommerce-design/t/very-important-please-read-new-image-sizes-supported-up-to-2048x2048-for-retina-support-110766 | |
* | |
* Simply include it within your image element, define the `image`, and the maximum size. | |
* Product Images and Theme Asset Images should have either `product: 'true'` or `asset: 'true'` declared, respectively. |
curl
to get the JSON response for the latest releasegrep
to find the line containing file URLcut
and tr
to extract the URLwget
to download itcurl -s https://api.github.com/repos/jgm/pandoc/releases/latest \
| grep "browser_download_url.*deb" \
| cut -d : -f 2,3 \
| tr -d \" \
const router = (routes, fn=(a,b)=>a(b)) => { | |
let current = null | |
const listen = () => { | |
window.addEventListener('hashchange', () => { | |
trigger(window.location.hashname.slice(1)) | |
}) | |
} | |
const trigger = path => { |
<?php | |
/** | |
* Simple PHP Templating function | |
* | |
* @param $names - string|array Template names | |
* @param $args - Associative array of variables to pass to the template file. | |
* @return string - Output of the template file. Likely HTML. | |
*/ | |
function template( $names, $args ){ | |
// allow for single file names |