Skip to content

Instantly share code, notes, and snippets.

dornfeder /
Last active Sep 14, 2021
Git Branching Diagram Template

Git Branching Diagram Template for

This is my own variant of a git branching diagram template based on Bryan Braun's great template.

You can use this diagram as a template to create your own git branching diagrams. Here's how:

  1. Create a new diagram with (formerly
  2. Go to File > Open From > URL
  3. Insert this url (it points to the xml data below):
  4. Customize as needed for your team.
bessfernandez /
Last active Sep 12, 2021
How to setup a simple Storybook HTML demo app


Storybook for HTML

Storybook is all about writing stories. A story usually contains a single state of one component, almost like a visual test case.

Typically you see Storybook used for React or other frameworks, but the library has recently introduced the option to use HTML for your Storybook projects. As a prototyping tool or playground this is great! No larger scale knowledge of other frameworks needed.

Install Storybook HTML

View Poor Man's Style Guide
<h1 id="headings">Headings</h1>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
View AnchorJS.js
* Example 1
anchors.options = {
placement: 'right',
visible: 'hover',
wiledal / template-literals-3-for-loops.js
Last active Mar 26, 2021
Template Literals example: For loops
View template-literals-3-for-loops.js
Template literals for-loop example
Using `Array(5).join(0).split(0)`, we create an empty array
with 5 items which we can iterate through using `.map()`
var element = document.createElement('div')
element.innerHTML = `
<h1>This element is looping</h1>
${Array(5).join(0).split(0).map((item, i) => `
matthewmueller /
Last active May 21, 2021
OSX for Hackers (Mavericks/Yosemite)
# OSX for Hackers (Mavericks/Yosemite)
# Source:
# Some things taken from here
# Ask for the administrator password upfront
jordanmoore / Better Emmet Media Queries
Created Nov 18, 2013
Go to Preferences > Browse Packages > Emmet > Emmet.sublime-settings and add this between the curly brackets under snippets for writing better media queries quickly in Emmet. mqm => min-width media query mqx => max-width media query
View Better Emmet Media Queries
"css": {
"abbreviations": {
"mqm": "@media screen and (min-width:${1}) {\n\t|\n}",
"mqx": "@media screen and (max-width:${1}) {\n\t|\n}"
tomeara / inline_svg_helper.rb
Last active Oct 25, 2019
Inline SVG for Rails
View inline_svg_helper.rb
# Put this method in your helper file to render inline SVG
def inline_svg(path)
file ="app/assets/images/#{path}", "rb")
richardscarrott / box.css
Last active Aug 7, 2021
Fading an element in from display: none; with CSS transitions.
View box.css
.box {
display: block;
background: red;
width: 200px;
height: 200px;
opacity: 1;
.box-hidden {
display: none;
willurd /
Last active Sep 17, 2021
Big list of http static server one-liners

Each of these commands will run an ad hoc http static server in your current (or specified) directory, available at http://localhost:8000. Use this power wisely.

Discussion on reddit.

Python 2.x

$ python -m SimpleHTTPServer 8000