Skip to content

Instantly share code, notes, and snippets.

View branneman's full-sized avatar

Bran van der Meer branneman

View GitHub Profile
@branneman
branneman / index.html
Created April 13, 2024 13:22
HTML5 Video: MediaSource, SourceBuffer, video segments, etc.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, viewport-fit=cover"
/>
<title>video test</title>
</head>
@branneman
branneman / six-nations-table.test.ts
Last active March 23, 2024 14:53
Six Nations table calculator
import { describe, expect, it } from 'vitest'
import { Table, Match } from './six-nations-table'
import {
matches2table,
updateTable,
getTable,
orderTable,
PgamesPlayed,
WgamesWon,
LgamesLost,
@branneman
branneman / index.js
Created December 6, 2023 15:15
Random person selector
const allPeople = ['Aisha', 'Amina', 'Anya', 'Carlos', 'Chen', 'Liam', 'Nia', 'Oliver', 'Raj', 'Yuki' ]
const peopleAlreadySpeaking = ['Anya', 'Raj']
const numberOfPeople = 2
// Fisher–Yates shuffle
function shuffle(list) {
const xs = list.slice()
let currentIndex = xs.length
let randomIndex
@branneman
branneman / components-app.tsx
Last active December 7, 2023 11:11
React useTranslation Hook
import { useState } from 'react'
import { Outlet } from 'react-router-dom' // you don't have to use this necessarily, just an example
import Header from 'components/Header'
import { makeTranslationValue } from 'hooks/translation'
import { TranslationContext } from 'context/translation'
import translations from 'data/translations.json'
export default function App() {
// Array = ordered + indexed + duplicate values
// a.k.a. List
const arr = [1, 2, 3]
// size
arr.length //=> 3
// random-access
arr[1] // 2
@branneman
branneman / 2-declarative.js
Last active December 29, 2022 07:49
Code Simplicity is the Ultimate Sophistication - https://youtu.be/zxJnyMXhyvw
// Imperative: 'what' + 'how'
const makes1 = []
for (let i = 0; i < cars.length; i += 1) {
makes1.push(cars[i].make)
}
// Declarative: only 'what'
const makes2 = cars.map((car) => car.make)
@branneman
branneman / 1-function.js
Last active December 22, 2022 07:57
Functions, Iterators, Promises, Observables - It's all connected - https://youtu.be/5GCo8AGQ9Ck
// Producer
const range = (min, max, acc = []) => {
if (max < min) throw new Error('not supported!')
if (min >= max) return acc
return range(min + 1, max, acc.concat(min))
}
// Consumer
const lt100 = range(0, 100)
//=> [1, 2, 3, 4, ..., 97, 98, 99]
@branneman
branneman / 1.js
Created October 17, 2022 19:47
Interfaces
// Interface of a primitive variable: its name and type
const DEFAULT_DB_HOST = 'localhost'
// Interface of a container variable: its name, types and structures
const config = {
user: 'readuser',
pass: '******',
db: 'test-env',
}
@branneman
branneman / git.js
Last active March 23, 2023 13:15
How Git works - super simplified! — https://www.youtube.com/watch?v=T9Nag5IXVQ0
// blob = file contents, identified by hash
const blobs = {
'73d8a': 'import x from "y"; console.log("some file contents")',
'9c6bd': 'D8 A1 31 0F ...',
'547d4': '# Readme\nThis is documentation',
'a0302': '# Readme\nThis is some updated documentation',
}
// tree = references to blobs and trees, identified by hash
const trees = {
@branneman
branneman / unit-testing.js
Last active October 5, 2022 21:03
How I write High Quality Unit tests - https://youtu.be/naL7-XQ7T70
/**
* Returns a list of numbers from `min` (inclusive) to `max` (exclusive).
*/
const range = (min, max, acc = []) => {
if (max < min) throw new Error('not supported!')
if (min >= max) return acc
return range(min + 1, max, acc.concat(min))
}
/**