Skip to content

Instantly share code, notes, and snippets.

View benfrain's full-sized avatar

Ben Frain benfrain

View GitHub Profile
@austinhyde
austinhyde / js-observables-binding.md
Last active August 16, 2023 18:19
Vanilla JavaScript Data Binding

Observables

You don't really need a framework or fancy cutting-edge JavaScript features to do two-way data binding. Let's start basic - first and foremost, you need a way to tell when data changes. Traditionally, this is done via an Observer pattern, but a full-blown implementation of that is a little clunky for nice, lightweight JavaScript. So, if native getters/setters are out, the only mechanism we have are accessors:

var n = 5;
function getN() { return n; }
function setN(newN) { n = newN; }

console.log(getN()); // 5

setN(10);

@tommillard
tommillard / SimpleHTTPServer
Last active November 13, 2018 10:54
Serve a local folder as a server at http://localhost:8000/
browse to folder in terminal and run:
python -m SimpleHTTPServer
mymodule {
@at-root {
.#{&}-header { ... }
.#{&}-footer { ... }
.#{&}-body {
a { ... }
span { ... }
p { ... }
}
}
@sergiolopes
sergiolopes / README.md
Last active February 11, 2024 23:57
A script to generate SVG sprites, including CSS and PNG fallbacks.
@mirisuzanne
mirisuzanne / type.scss
Created September 2, 2012 17:24
Using modular scale with vertical rhythms
// Using the Modular Scale plugin along with Compass Vertical Rhythms module.
// The goal is to use MS to give us the values,
// and use VR to apply those values to our typography.
// ---------------------------------------------------------------------------
// Defaults
$base-size: 24px;
$ratio: major-third() fifth();
@ls-lukebowerman
ls-lukebowerman / sitemap.xml.erb
Created August 7, 2012 17:59
Sitemap (sitemaps.org) generator for Middleman
<% pages = sitemap.resources.find_all{|p| p.source_file.match(/\.html/) } %>
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<% pages.each do |p| %>
<url>
<loc>http://youdomain.com/<%=p.destination_path.gsub('/index.html','')%></loc>
<priority>0.7</priority>
</url>
<% end %>
</urlset>
@mrinalwadhwa
mrinalwadhwa / data_url.rb
Created June 20, 2012 04:00
SCSS custom function to insert data uri into style sheets.
require 'base64'
# tools.ietf.org/html/rfc2397
# developer.mozilla.org/en/data_URIs
# "data:" + MIME type + ";base64," + base64-encoded content
def to_data_url(content, content_type)
outuri = 'data:' + content_type + ';base64'
content = Base64.encode64(content).gsub("\n", '')
outuri += ",#{content}"
@lucasfais
lucasfais / gist:1207002
Created September 9, 2011 18:46
Sublime Text 2 - Useful Shortcuts

Sublime Text 2 – Useful Shortcuts (Mac OS X)

General

⌘T go to file
⌘⌃P go to project
⌘R go to methods
⌃G go to line
⌘KB toggle side bar
⌘⇧P command prompt