OrionReed

// 3D Dom viewer, copy-paste this into your console to visualise the DOM as a stack of solid blocks.
// You can also minify and save it as a bookmarklet (https://www.freecodecamp.org/news/what-are-bookmarklets/)
(() => {
  const SHOW_SIDES = false; // color sides of DOM nodes?
  const COLOR_SURFACE = true; // color tops of DOM nodes?
  const COLOR_RANDOM = false; // randomise color?
  const COLOR_HUE = 190; // hue in HSL (https://hslpicker.com)
  const MAX_ROTATION = 180; // set to 360 to rotate all the way round
  const THICKNESS = 20; // thickness of layers
  const DISTANCE = 10000; // ¯\\_(ツ)_/¯

WebReflection

This gist is a simple no-brainer description of the 3 ways (actually 2.5) the Web handle events.

<tag onclick />

The declarative inline HTML event listener is mostly an indirection of DOM Level 0 events, meaning this simply uses the equivalent of tag.onclick = listener behind the scene.

Example

click me

panzerdp

type ResponseWithData = Response & { data?: any };

interface Fetcher {
  run(input: RequestInfo, init?: RequestInit): Promise<ResponseWithData>;
}

class BasicFetcher implements Fetcher {
  async run(input: RequestInfo, init?: RequestInit): Promise<ResponseWithData> {
    return await fetch(input, init);
  }

cvan

function useMedia(mediaQuery) {
  const match = () => {
    if (!window.matchMedia) {
      return false;
    }
    return window.matchMedia(mediaQuery).matches;
  };

  const [value, set] = useState(match);

akella

What i'm using in streams and while working

Development tools

• https://fishshell.com/ - my default shell, i use theme bobthefish
• https://www.sublimetext.com/ - my default editor
  • Material Theme
  • Operator font
  • Packages: Emmet, Hayaku, SidebarEnhancements, JS Snippets, GSAP Snippets
  • Sublime snippet for comments
  • Sublime icon
• https://code.visualstudio.com/ - trying to switch, but not yet

Andy-set-studio

/**
 * Pass in an element and its CSS Custom Property that you want the value of.
 * Optionally, you can determine what datatype you get back.
 *
 * @param {String} propKey
 * @param {HTMLELement} element=document.documentElement
 * @param {String} castAs='string'
 * @returns {*}
 */
const getCSSCustomProp = (propKey, element = document.documentElement, castAs = 'string') => {

asuh

{
  "name": "_s",
  "version": "1.0.1",
  "scripts": {
    "clean": "rimraf style.css",
    "notify": "notify -h",
    "serve": "browser-sync start --proxy 'my.asuh' --files '**/*.css, **/*.js, *.php, **/*.json, dist/images/*'",
    "imagemin": "imagemin src/images/* -o dist/images",
    "icons": "svgo -f src/images/icons -o dist/images/icons && svg-sprite-generate -d dist/images/icons -o dist/images/icons/sprite.svg",
    "lint-scss": "stylelint 'sass/**/*.scss' --syntax scss --config node_modules/stylelint-config-wordpress/scss.js",

eashish93

vs Questions

---

1. http://stackoverflow.com/questions/804115 (rebase vs merge).
2. https://www.atlassian.com/git/tutorials/merging-vs-rebasing (rebase vs merge)
3. https://www.atlassian.com/git/tutorials/undoing-changes/ (reset vs checkout vs revert)
4. http://stackoverflow.com/questions/2221658 (HEAD^ vs HEAD~) (See git rev-parse)
5. http://stackoverflow.com/questions/292357 (pull vs fetch)
6. http://stackoverflow.com/questions/39651 (stash vs branch)
7. http://stackoverflow.com/questions/8358035 (reset vs checkout vs revert)

amysimmons

Advanced JavaScript Learning Resources

This is a list of advanced JavaScript learning resources from people who responded to this [Tweet][13] and this [Tweet][20].

• [You Don't Know JS][3]

• [Frontend Masters courses by Kyle Simpson][12]

• [@mpjme][6]'s [YouTube videos][5]

gboudreau

Generating Authy passwords on other authenticators

---

*update: TBC, but this new might affect how easy it is to use this technique past August 2024: Authy is shutting down its desktop app | The 2FA app Authy will only be available on Android and iOS starting in August

---

This gist, based in part on a gist by Brian Hartvigsen, allows you to export from Authy your TOTP tokens you have stored there.
Those can be "standard" 6-digits / 30 secs tokens, or Authy's own version, the 7-digits / 10 secs tokens.