Skip to content

Instantly share code, notes, and snippets.

Avatar

Denny Trebbin fibric

View GitHub Profile
@kflorence
kflorence / scrollbarWidth.js
Created Jul 10, 2012
Calculate scroll bar width cross-browser
View scrollbarWidth.js
function getScrollBarWidth() {
var inner = document.createElement('p');
inner.style.width = "100%";
inner.style.height = "200px";
var outer = document.createElement('div');
outer.style.position = "absolute";
outer.style.top = "0px";
outer.style.left = "0px";
outer.style.visibility = "hidden";
@staltz
staltz / introrx.md
Last active Aug 10, 2020
The introduction to Reactive Programming you've been missing
View introrx.md
@sebmarkbage
sebmarkbage / react-terminology.md
Last active Jul 28, 2020
React (Virtual) DOM Terminology
View react-terminology.md
@sebmarkbage
sebmarkbage / Enhance.js
Last active Jun 26, 2020
Higher-order Components
View Enhance.js
import { Component } from "React";
export var Enhance = ComposedComponent => class extends Component {
constructor() {
this.state = { data: null };
}
componentDidMount() {
this.setState({ data: 'Hello' });
}
render() {
View pragmatic-touch-icons.md

NOTE I'm trying to find the most optimal fav/touch icon setup for my use-cases. Nothing new here. Read Mathias Bynens' articles on re-shortcut-icon and touch icons, a FAQ or a Cheat Sheet for all the details.

I'd like to hear how you approach this: @valuedstandards or comment on this gist.

The issue

You have to include a boatload of link elements pointing to many different images to provide (mobile) devices with a 'favicon' or 'touch icon':

![Touch Icon Links](https://o.twimg.com/2/proxy.jpg?t=HBj6AWh0dHBzOi8vcGhvdG9zLTYuZHJvcGJveC5jb20vdC8yL0FBRGFGY1VRN1dfSExnT3cwR1VhUmtaUWRFcWhxSDVGRjNMdXFfbHRJWG1GNFEvMTIvMjI3OTE2L3BuZy8xMDI0eDc2OC8yL18vMC80L1NjcmVlbnNob3QlMjAyMDE1LTA0LTE0JTIwMTYuNTYuMjYucG5nL0NNejBEU0FCSUFJZ0F5Z0JLQUkvNGR1eDZnMzZmYnlzYWI3

@bennadel
bennadel / reduce.js
Created Aug 18, 2016
Code Kata: Using Array Reduce() To Navigate An Object Graph In JavaScript
View reduce.js
// I am just an arbitrarily non-trivial object to query.
var config = {
tasks: {
interval: {
//...
},
daily: {
backupFilesToS3: {
dayOfWeek: "Saturday",
hour: 22
@mjackson
mjackson / resolvePromise.js
Last active Sep 9, 2018
An easy way to do async APIs in JavaScript that support both promises *and* callbacks!
View resolvePromise.js
// Here is a function that I use all the time when creating public
// async APIs in JavaScript:
const resolvePromise = (promise, callback) => {
if (callback)
promise.then(value => callback(null, value), callback)
return promise
}
// Sometimes I like to use callbacks, but other times a promise is
@neonto
neonto / ReactStudio-Reactconf.md
Last active May 14, 2019
React Studio - a GUI tool built specifically for React
View ReactStudio-Reactconf.md

--> Star this gist if you want to see it on the Reactive 2016 conference <--

Writing React.js is fun... But being able to draw React components, design responsive layouts and create entire app flows visually can be even more fun! (Especially for those non-coder members of your team who think ECMAScript 6 is a skin disease. They should see the light of React too.)

In this lightning talk, we'll give you a world premiere sneak peek at React Studio (www.reactstudio.com), a GUI tool built specifically for React. We'll explain how React's functional design makes it a great fit for visual tools. Also we will show how React Studio's plugin approach makes it a really powerful meta-programming system. Want to switch your app from Redux to Alt.js or vice versa? Just swap the state plugin and export again! That's just one of the joys of using a visual system for your Reactified visual design.

https://reactiveconf.com

You can’t perform that action at this time.