Skip to content

Instantly share code, notes, and snippets.

View justinribeiro's full-sized avatar
🌩️
Winter is coming.

Dr. Justin Ribeiro, Ph.D. justinribeiro

🌩️
Winter is coming.
291 followers · 0 following
View GitHub Profile
@justinribeiro
justinribeiro / instruct.md
Last active December 20, 2021 08:42
ssh-agent-windows
  1. Open git-bash on Windows.
  2. Make sure you have a .profile: touch .profile
  3. Open .profile and add:
env=~/.ssh/agent.env

agent_load_env () { test -f "$env" && . "$env" >| /dev/null ; }

agent_start () {
@justinribeiro
justinribeiro / font-report-devtools-snippet.md
Created October 18, 2019 15:43
Find font definitions of elements in a page.

Find font defintions for elements within a page with DevTools

This is simple DevTools snippt that uses TreeWalker to find textNodes, and then we parse what font styles are in use on that node with getComputedStyle.

Note, this won't travel the ShadowDOM which is it's own can of worms.

function findTextNodesFor(element){
  let node; 
  const discoveredTextNodes = [];
@justinribeiro
justinribeiro / instruct.md
Last active September 27, 2019 18:56
Generating icons for PWAs with imagemagick convert and the command line

Generate a set of icons for the manifest, index metadata, so forth.

convert raw-icon.png \
  \( -clone 0 -resize 512x512 -write icon-512.png \) \
  \( -clone 0 -resize 384x384 -write icon-384.png \) \
  \( -clone 0 -resize 192x192 -write icon-192.png \) \
  \( -clone 0 -resize 144x144 -write icon-144.png \) \
  \( -clone 0 -resize 96x96 -write icon-96.png \) \
 \( -clone 0 -resize 72x72 -write icon-72.png \) \
@justinribeiro
justinribeiro / responsive-test.html
Created May 6, 2019 16:21
A simple resize observer test, based on Philip's concept. https://philipwalton.com/articles/responsive-components-a-solution-to-the-container-queries-problem/
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>A simple responsive container</title>
</head>
<body>
<responsive-container>
@justinribeiro
justinribeiro / instructions.md
Last active October 8, 2018 01:57
The Web Platform Podcast: Pipelines for publishing

Justin's Guide to faster episodes

The follwing is my working document as I create a pipeline for faster YouTube > LibSyn / iTunes distribution. This is not complete, but really cuts down on some time.

Prerequisites

I'm a commandline guy, I like UNIX tooling philosophy. Hence, my prereqs.

  1. youtube-dl
  2. ffmpeg
  3. mutagen
@justinribeiro
justinribeiro / tasks.json
Created June 26, 2018 20:45
Running lighthouse-cli inside Visual Studio Code via tasks.json.
{
// Some basic lighthouse testing using docker, lighthouse-cli, jq, tr Note,
// you must search/replace the test url (no var support in tasks.json
// currently)
"version": "2.0.0",
"tasks": [
// NOTE: you don't have to run the container to make this work, you can
// simply change the lighthouse commands as required below to work with your
// setup (I find the container easier)
{
@justinribeiro
justinribeiro / ericbidelman.com-20180830T120745.lighthouse.report.json
Last active August 30, 2018 20:29
{"userAgent":"Mozilla/6.0 (Macintosh; Intel Mac OS X 10_13_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3537.0 Safari/537.36","lighthouseVersion":"3.0.3","fetchTime":"2018-08-30T19:07:45.641Z","requestedUrl":"https://ericbidelman.com/","finalUrl":"https://ericbidelman.com/","runWarnings":[],"audits":{"is-on-https":{"id":"is-on-https","title":"Uses HTTPS","description":"All sites should be protected with HTTPS, even ones that don't handle sensitive data. HTTPS prevents intruders from tampering with or passively listening in on the communications between your app and your users, and is a prerequisite for HTTP/2 and many new web platform APIs. [Learn more](https://developers.google.com/web/tools/lighthouse/audits/https).","score":1,"scoreDisplayMode":"binary","rawValue":true,"displayValue":"","details":{"type":"table","headings":[],"items":[]}},"redirects-http":{"id":"redirects-http","title":"Redirects HTTP traffic to HTTPS","description":"If you've already set up HTTPS, make sure that you redirect all
@justinribeiro
justinribeiro / io-schedule-2018.js
Last active April 14, 2018 19:39
Get a console list of your reserved schedule. Use as DevTools snippet. Because friends let friends know where they'll be at I/O (generally).
schedule = '';
sections = document.querySelectorAll(".schedule__grid__content");
sections.forEach(section => {
let time = '';
try {
time = section.querySelector(".schedule__grid__time").textContent;
} catch(e) {
time = section.querySelector('.schedule__grid__date');
if (time) {
@justinribeiro
justinribeiro / feature_detect_es_modules.js
Created November 22, 2017 23:21 — forked from ebidel/feature_detect_es_modules.js
Feature detect ES modules: both static import and dynamic import()
<!--
Complete feature detection for ES modules. Covers:
1. Static import: import * from './foo.js';
2. Dynamic import(): import('./foo.js').then(module => {...});
Demo: http://jsbin.com/tilisaledu/1/edit?html,output
Thanks to @_gsathya, @kevincennis, @rauschma, @malyw for the help.
-->
@justinribeiro
justinribeiro / eddystone-uid-gen.md
Created April 10, 2017 18:20
Sometimes I just need an EddyStone UID for testing.

Eddystone UID generate

Sometimes when I'm testing, I just need an UID and I don't particularly care about the ID portion. This little alias generate based on any string really (though should be FQDN).

alias genEuid='generateEddystoneUID'
generateEddystoneUID() {
  echo -n $1 | sha256sum | cut -b-10 | tr -d \\n | xxd -pu | xargs -I{} printf '%s%s' {} `od -vAn -N6 -tx2 < /dev/urandom | tr -d ' '`
}