Skip to content

Instantly share code, notes, and snippets.

View miguelfrias's full-sized avatar

Miguel Angel Frías Bonfil miguelfrias

  • Globant
  • Los Angeles
View GitHub Profile
@miguelfrias
miguelfrias / mysql-docker.sh
Created April 28, 2019 01:16 — forked from spalladino/mysql-docker.sh
Backup and restore a mysql database from a running Docker mysql container
# Backup
docker exec CONTAINER /usr/bin/mysqldump -u root --password=root DATABASE > backup.sql
# Restore
cat backup.sql | docker exec -i CONTAINER /usr/bin/mysql -u root --password=root DATABASE
@miguelfrias
miguelfrias / sm-annotated.html
Created December 4, 2015 17:08 — forked from hdragomir/sm-annotated.html
The deferred font loading logic for Smashing Magazine. http://www.smashingmagazine.com/
<script type="text/javascript">
(function () {
"use strict";
// once cached, the css file is stored on the client forever unless
// the URL below is changed. Any change will invalidate the cache
var css_href = './index_files/web-fonts.css';
// a simple event handler wrapper
function on(el, ev, callback) {
if (el.addEventListener) {
el.addEventListener(ev, callback, false);
@miguelfrias
miguelfrias / Contract Killer 3.md
Created October 15, 2015 16:21
The latest version of my ‘killer contract’ for web designers and developers

Contract Killer

The popular open-source contract for web designers and developers by Stuff & Nonsense

  • Originally published: 23rd December 2008
  • Revised date: October 8th 2015
  • Original post

@miguelfrias
miguelfrias / what-forces-layout.md
Last active September 21, 2015 15:31 — forked from paulirish/what-forces-layout.md
What forces layout/reflow. The comprehensive list.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout. This is also called reflow or layout thrashing, and is common performance bottleneck.

Element

Box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
  • elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
  • elem.getClientRects(), elem.getBoundingClientRect()
<!doctype html>
<!-- http://taylor.fausak.me/2015/01/27/ios-8-web-apps/ -->
<html>
<head>
<title>iOS 8 web app</title>
<!-- CONFIGURATION -->

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

Deploy your site with git

This gist assumes:

  • you have a local git repo
  • with an online remote repository (github / bitbucket etc)
  • and a cloud server (Rackspace cloud / Amazon EC2 etc)
    • your (PHP) scripts are served from /var/www/html/
    • your webpages are executed by apache
  • apache's home directory is /var/www/

How to patch Ubuntu for Heartbleed

  1. sudo apt-get update
  2. sudo apt-get install -y libssl1.0.0 openssl
  3. openssl version -a and confirm the "built on" date is >= 2014-04-07
  4. sudo lsof -n | grep ssl | grep DEL and restart all listed services.

Repeat #4 until no results are returned.

/*jslint sloppy:true, white:true, vars:true, plusplus:true */
var permutation = function (collection){
var current,
subarray,
result = [],
currentArray = [],
newResultArray = [];
if (collection.length){
/*
* a small mixin for easy use of rem with px as fallback
* usage: @include x-rem(font-size, 14px)
* usage: @include x-rem(marign, 0 12px 2 1.2)
* usage: @include x-rem(padding, 1.5 24px)
*
* thanks to Eric Meyer for https://github.com/ericam/susy
* and Hans Christian Reinl for http://drublic.de/blog/rem-fallback-sass-less/
*/
@mixin x-rem($property, $values) {