miniscripts's profile picture. Bite-sized scripts for everyday use. Tweets will largely cover front-end development technologies: HTML, CSS, and JavaScript. Managed by @jonathansampson

MiniScripts

@miniscripts

Bite-sized scripts for everyday use. Tweets will largely cover front-end development technologies: HTML, CSS, and JavaScript. Managed by @jonathansampson

MiniScripts hat repostet

function shallowEqual(obj1, obj2) { const keys1 = Object.keys(obj1); if (keys1.length !== Object.keys(obj2).length) return false; for (const k1 of keys1) { if (! (k1 in obj2)) return false; if (obj1[k1] !== obj2[k1]) return false; } return true; }


MiniScripts hat repostet

HEX to RGB in a tweet let hex = '#​c71585'; let rgb = `rgb(${hex.match(/[0-9a-f]{2}/gi).map(c => parseInt(c, 16)).join()})`; #js


Both Alt and Ctrl keys on your keyboard produce character 65, so how can you tell which is which? The KeyboardEvent.location property tells you the location of the key on your keyboard: 1 means left, and 2 means right (0 for keys with no ambiguity).


Need to pad your strings? Now you can with padStart and padEnd. You can even provide a pad character: › "Hello".padStart(10) ‹ " Hello" › "Hello".padEnd(10) ‹ "Hello " › "Hello".padEnd(10, ".") ‹ "Hello....."


MiniScripts hat repostet

Now in @brave: Search GitHub, MDN, Stack Overflow from the address bar: :gh brave :m spread :s reactjs {'🦁':'Developers'.repeat(3)+'!'}


Curious which version of http-server you have installed? Easy! Run from project directory w/o -g for local modules. npm list http-server -g


Speak to me, Browser. var a = "Hello, friend."; speechSynthesis.speak( new SpeechSynthesisUtterance(a) ); Edge 14, Firefox 49, Chrome 33


Notification.requestPermission().then( p => p[0] == "g" && new Notification( "Smile", { icon: "ico.png", body: "🙂" } ) ); #Notifications


MiniScripts hat repostet

ES6 array of numbers: const range = (start, end) => ( Array.from({ length: end - start + 1 }, (x, i) => i + start) ); #JavaScript #es6


Chaining handlebars Helpers: {{ encodeURI ( join values '|' ) }}


The window.getComputedStyle method works for both elements, and pseudo elements: getComputedStyle( el ) getComputedStyle( el, "::before" );


let debounce; win.addEventListener('scroll', () => { clearTimeout(debounce); debounce = setTimeout( () => { /*logic*/ }, 100); });


MiniScripts hat repostet

Unicode code point escape syntax, recently added in JavaScript 2015, also found its way into PHP 7. This makes me very happy. \u{2661} ♡


An option element's end tag may be omitted if the element is followed by another option, optgroup, or no more content in the parent element.


4.10.8 The datalist element <input list="fam"> <datalist id="fam"> <option>Luke <option>Vader </datalist>


Trying to convert RGB values to HEX? You can do so quickly in the console of your @f12devtools: 185..toString(16); // b9


When gradients are leveraged as solid background images, the angle value can be omitted. linear-gradient( blue, blue );


Angles can be "deg" (360 in a circle), "grad" (400 in a circle), "rad" (2π in a circle), or "turn" (1 in a circle). w3.org/TR/css3-values…


Planning on using linear-gradient? While Chrome and Edge implicitly understand 0 to mean 0deg, Firefox and IE do not. Don't cut corners.


United States Trends

Loading...

Something went wrong.


Something went wrong.