Skip to content

Instantly share code, notes, and snippets.

srdjan / 100+ different counter apps...
Last active Feb 23, 2021
More than 100 different counter applications...
View 100+ different counter apps...
100+ different js counter applications...
morsdyce /
Last active Mar 7, 2019
Introduction to BDSM - ReactiveConf Lightning talk proposal

This is a proposal for a lightning talk at the Reactive 2016 conference.

🌟Star this gist if you want to see it on the conference.

Introduction to BDSM

Every day we work with multiple teams to build our products, communication and sync are key factors to deliver your product on time without compromising quality.

In this talk I will introduce BDSM a new mocking tool that will change the way you coordinate between client and server teams minimizing friction allowing each team to work at its own pace while keeping in sync.

bendc / easing.css
Created Sep 23, 2016
Easing CSS variables
View easing.css
:root {
--ease-in-quad: cubic-bezier(.55, .085, .68, .53);
--ease-in-cubic: cubic-bezier(.550, .055, .675, .19);
--ease-in-quart: cubic-bezier(.895, .03, .685, .22);
--ease-in-quint: cubic-bezier(.755, .05, .855, .06);
--ease-in-expo: cubic-bezier(.95, .05, .795, .035);
--ease-in-circ: cubic-bezier(.6, .04, .98, .335);
--ease-out-quad: cubic-bezier(.25, .46, .45, .94);
--ease-out-cubic: cubic-bezier(.215, .61, .355, 1);
zspecza / amok_browserify_gulpfile.js
Last active Sep 29, 2019
Live inject CSS, Javascript & HTML with BrowserSync, Watchify, Amok & Gulp (excuse the messiness, still a WIP)
View amok_browserify_gulpfile.js
build tasks
* This gulpfile is optimised for developing
* React.js apps in ES6 through Babel, and is
* designed to live-inject CSS, HTML and even JavaScript
* changes so maintaining state in an application when
* editing code is super easy.
pdaoust / higher-order-functions.scss
Last active Nov 12, 2018
Higher-order functions for Sass 3.3 -- now that we've got the `call()` function in Sass, we can start to compose functions. We don't have the benefit of anonymous functions, of course, but this is real functional programming, folks!
View higher-order-functions.scss
// 'map', 'transform', 'select', or 'project' function. Iterate over a list,
// performing a function on each item, and collecting the new items. Each
// function takes an item as a first argument and returns a transformed item.
// You can pass additional arguments to the function too, which is a decent poor
// man's function composition.
// (I didn't call this f-map because the term 'map' is already used in Sass to
// denote a hash or dictionary.)
@function f-apply($func, $list, $args...) {
$new-list: ();
@each $item in $list {
nijikokun /
Last active Dec 27, 2015
The easiest, and most comprehensible class system for JavaScript using prototypal inheritance and Object.create. Also contains an additional chaining method, that isn't required but simplifies your code. Outputs the cleanest objects as far as Class Systems go.


After looking for a simple Class system in JavaScript, and looking at all the horrible libraries, forced upon terrible syntax, cluttered objects and prototypes... I'd like to introduce a simple alternative.

This is a very bare-bones, and yet one of the more powerful class systems in JavaScript. Built on-top of Object.create and prototype inheritance using the methods that everyone suggests is the best way to do classes in JavaScript ported over to a nicer syntax.

It doesn't clutter the properties or the prototype aside from a single method which is extends, and even this method is sugar and not required!

Check out zoo.js for an in-depth example of how to use Class. No matter how deep down the rabbit hole you go, it should keep references so you can do instanceof checks on children of a parent of a grand-parent and so forth.

james2doyle / scrollTo.js
Last active Feb 22, 2021
a native scrollTo function in javascript that uses requestAnimationFrame and easing for animation
View scrollTo.js
// easing functions
Math.easeInOutQuad = function (t, b, c, d) {
t /= d/2;
if (t < 1) {
return c/2*t*t + b
return -c/2 * (t*(t-2) - 1) + b;

Articles, Styletiles & Styleguide


View dci.js
// allows easily making an Actor with a Role
// if it's already an actor the context will be attached.
Object.defineProperty(Object.prototype, "as", {enumerable: false, value : function(role){
// this will add a role to the object
if(this.__isActor__) {
return this;
// if this is not an actor -
davatron5000 / gist:2254924
Created Mar 30, 2012
Static Site Generators
View gist:2254924

Backstory: I decided to crowdsource static site generator recommendations, so the following are actual real world suggested-to-me results. I then took those and sorted them by language/server and, just for a decent relative metric, their Github Watcher count. If you want a heap of other projects (including other languages like Haskell and Python) Nanoc has the mother of all site generator lists. If you recommend another one, by all means add a comment.