arturparkhisenko

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

arturparkhisenko

FWIW: I (@rondy) am not the creator of the content shared here, which is an excerpt from Edmond Lau's book. I simply copied and pasted it from another location and saved it as a personal note, before it gained popularity on news.ycombinator.com. Unfortunately, I cannot recall the exact origin of the original source, nor was I able to find the author's name, so I am can't provide the appropriate credits.

---

Effective Engineer - Notes

• By Edmond Lau
• Highly Recommended 👍
• http://www.theeffectiveengineer.com/

What's an Effective Engineer?

arturparkhisenko

ffmpeg

Converting Audio into Different Formats / Sample Rates

Minimal example: transcode from MP3 to WMA:
ffmpeg -i input.mp3 output.wma

You can get the list of supported formats with:
ffmpeg -formats

You can get the list of installed codecs with:

arturparkhisenko

// From https://github.com/videojs/http-streaming/blob/d258fae646a3a4a6dc2ba26c729710dd8f39876a/src/videojs-http-streaming.js#L430-L464
/**
 * Whether the browser has built-in HLS support.
 */
window._supportsNativeHls = (function() {
  if (!document || !document.createElement) {
    return false;
  }

  const video = document.createElement('video');

arturparkhisenko

/**
 * We use this workaround to detect the Chromecast device generation.
 * Unfortunately the Cast Application Framework (CAF) does not have an API for that.
 *
 * cc-1: Chromecast 1st Gen.
 * cc-2: Chromecast 2nd Gen.
 * cc-3: Chromecast 3rd Gen.
 * cc-ultra: Chromecast Ultra
 * cc-builtin: Android TV with Chromecast built-in
 */

arturparkhisenko

Pure ESM package

The package linked to from here is now pure ESM. It cannot be require()'d from CommonJS.

This means you have the following choices:

1. Use ESM yourself. (preferred)
   Use import foo from 'foo' instead of const foo = require('foo') to import the package. You also need to put "type": "module" in your package.json and more. Follow the below guide.
2. If the package is used in an async context, you could use await import(…) from CommonJS instead of require(…).
3. Stay on the existing version of the package until you can move to ESM.

arturparkhisenko

FE vs BE

TL;DR enough of this kind of nonsense

---

I've been in the field for ~20 years and started as BE developer, and this is a reference for people thinking that because they are on the BE side, they're somehow entitled to:

• earn more money
• feel superior about FE developers
• joke about JavaScript or minimize the FE effort in any way

arturparkhisenko

arturparkhisenko

// https://pages.ucsd.edu/~dkjordan/chin/unitestuni.html
// https://fonts.google.com/specimen/Noto+Sans

const multiLanguageText = "00:00, : ,Ā Á Ă À ā á ă à Ǖ Ǘ Ǚ Ǜ ǖ ǘ ǚ ǜĈ ĉ Ĝ ĝ Ĥ ĥĴ ĵ Ŝ ŝ Ŭ ŭ Я не говорю по-русски. Я також не розмовляю Українською. Μῆνιν ἄειδε θεὰ Πηληϊάδεω Ἀχιλῆος. אני לא לומד עברית 𓂝𓃀𓅡𓄿𓌂 𓋴𓅓𓏏𓇏𓇌𓀀 我们刚才从 图书馆来了。 我們剛才從 圖書館來了。 𦮙, ABCČĆDĐEFGHIJKLMNOPQRSŠTUVWXYZŽ abcčćdđefghijklmnopqrsštuvwxyzž АБВГҐДЂЕЁЄЖЗЅИІЇЙЈКЛЉМНЊОПРСТЋУЎФХЦЧЏШЩЪЫЬЭЮЯ абвгґдђеёєжзѕиіїйјклљмнњопрстћуўфхцчџшщъыьэюя ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ αβγδεζηθικλμνξοπρστυφχψωά ΆέΈέΉίϊΐΊόΌύΰϋΎΫὰάὲέὴήὶίὸόὺύὼώ ΏĂÂÊÔƠƯăâêôơư आईऊऋॠऌॡऐऔऎअं अँकखगघङचछजझञटठडढणतथदधनपफबभयरवळशषसह 1234567890 ०१२३४५६७८९‘?’“!”(%) [#]{@}&<-+÷×=> ®©$€£¥¢:;,.*₹"

arturparkhisenko

# download image here https://www.microsoft.com/en-us/software-download/windows10ISO
# mount it
diskutil list
# check identifier, it's could be like disk2
# format disk using identifier in the end
diskutil eraseDisk ExFat "WINDOWS10" MBR disk2
# copy all files from the image mounted
cp -rp /Volumes/CCCOMA_X64FRE_EN-US_DV9/* /Volumes/WINDOWS10/

# WAY 2, (for image path - just grab iso and drag it into console)