ryanflorence

const fsp = require("fs").promises;
const path = require("path");
const { execSync } = require("child_process");

const chalk = require("chalk");
const Confirm = require("prompt-confirm");
const jsonfile = require("jsonfile");
const semver = require("semver");

const packagesDir = path.resolve(__dirname, "../packages");

threepointone

On implementing a client for feature flags in your UI codebase

This document isn't an explainer on Feature Flags, you can find that with my amateur writeup, or literally hundreds of better writeups out there.

This document is also agnostic to the choice of service you'd use: LaunchDarkly or split.io or optimizely or whatever; that's orthogonal to this conversation.

Instead, this document is a list of considerations for implementing a client for using Feature Flags for User Interface development. Service providers usually give a simple fetch and use client and that's it; I contend that there's a lot more to care about. Let's dive in.

To encourage usage, we'd like for the developer experience to be as brutally simple as possible. So, this should be valid usage:

ClickerMonkey

// when T is any|unknown, Y is returned, otherwise N
type IsAnyUnknown<T, Y, N> = unknown extends T ? Y : N;
  
// when T is never, Y is returned, otherwise N
type IsNever<T, Y = true, N = false> = [T] extends [never] ? Y : N;

// when T is a tuple, Y is returned, otherwise N
// valid tuples = [string], [string, boolean], 
// invalid tuples = [], string[], (string | number)[]

anniesullie

/**
 * A bookmarklet for viewing the largest contentful paint in a page.
 * Will show each LCP after the bookmarklet is clicked.
 *
 * To install:
 * 1. Copy the code starting from the line beginning `javascript:`
 * 2. Add a new bookmark in Chrome, and paste the code in as the URL.
 **/
javascript:(function(){
  try {

KATT

Record<string, x | undefined>

Represent maps

// rather than 
const map: {[ key: string ]: string} = {
  foo: 'bar',
}

slikts

Advanced memoization and effects in React

Memoization is a somewhat fraught topic in the React world, meaning that it's easy to go wrong with it, for example, by [making memo() do nothing][memo-pitfall] by passing in children to a component. The general advice is to avoid memoization until the profiler tells you to optimize, but not all use cases are general, and even in the general use case you can find tricky nuances.

Discussing this topic requires some groundwork about the technical terms, and I'm placing these in once place so that it's easy to skim and skip over:

• Memoization means caching the output based on the input; in the case of functions, it means caching the return value based on the arguments.
• Values and references are unfortunately overloaded terms that can refer to the low-level implementation details of assignments in a language like C++, for example, or to memory

emmabostian

Seven different types of CSS attribute selectors

// This attribute exists on the element
[value]

// This attribute has a specific value of cool
[value='cool'] 

// This attribute value contains the word cool somewhere in it
[value*='cool'] 

stettix

Things I believe

This is a collection of the things I believe about software development. I have worked for years building backend and data processing systems, so read the below within that context.

Agree? Disagree? Feel free to let me know at @JanStette. See also my blog at www.janvsmachine.net.

Fundamentals

Keep it simple, stupid. You ain't gonna need it.

khalid32

### extract videos as mp3 files
youtube-dl -x --audio-format mp3 <video link>

### get highest resolution audio & video
To download a video, you type the URL after the command like so:

youtube-dl <video link>

To select the video quality, first use the -F option to list the available formats, here’s an example,

jeffsheets

i18n Translations

To generate new translations:

1. remove .messages folder
2. Extract all messages into .messages dir with: yarn i18n:extract
3. Add new messages into {lang}.json files with: yarn i18n:manageTranslations
4. Translate any new entries in {lang}.json files and commit to repo (see Untranslated keys: output of previous command for list of keys needing translation)

Setup