Skip to content

Instantly share code, notes, and snippets.

Avatar

Elie Rotenberg elierotenberg

View GitHub Profile
@elierotenberg
elierotenberg / snippet.js
Created Apr 6, 2020
Move Netflix subtitles to top
View snippet.js
(() => {
const css = `
.player-timedtext > div {
position: static !important;
text-align: center !important;
}
`;
const style = document.createElement("style");
style.innerHTML = css;
@elierotenberg
elierotenberg / README.md
Last active Jan 11, 2020
Offline password generator bookmarklet
View README.md

Notes:

  • password generation is purely offline; no risk of mitm
  • uses browser crypto API if available; fallback to Math.random
  1. Copy and paste the following URL in your browser address bar:
@elierotenberg
elierotenberg / BLOG.md
Last active Nov 1, 2020
Idiomatic Data Fetching using React Hooks
View BLOG.md

Idiomatic Data Fetching using React Hooks

This post has been written in collaboration with @klervicn

Virtually all web apps and websites need to pull data from a server, usually through a JSON-returning API. When it comes to integrating data fetching in React component, the "impedence mismatch" between the React components, which are declarative and synchronous, and the HTTP requests, which are imperative and asynchronous, is often problematic.

Many apps use third-party libraries such as Redux or Apollo Client to abstract it away. This requires extra dependencies, and couple your app with a specific library to perform data fetching. In most cases, what we want is a direct way to integrate plain HTTP requests (e.g. using native fetch) for usage in React components.

Here we will discuss how we can use React Hooks to do this in an elegant, scalable manner.

@elierotenberg
elierotenberg / DockerCompose.ts
Created Aug 15, 2019
Docker Compose TestUtils
View DockerCompose.ts
interface IDockerComposeProps {
cwd?: string;
dockerComposeFile: string;
}
class DockerCompose {
private readonly props: IDockerComposeProps;
private state: "unknown" | "pending-up" | "up" | "pending-down" | "down";
public constructor(props: IDockerComposeProps) {
@elierotenberg
elierotenberg / prototype.js
Last active May 16, 2019
Get text within rectangle
View prototype.js
(() => {
const MAX_BASENAME_LENGTH = 64;
const clicks = [];
const getNodesInRectangle = (topLeft, bottomRight) =>
Array.from(document.querySelectorAll("*").values()).filter(node => {
const { x, y, width, height } = node.getBoundingClientRect();
return (
x >= topLeft.x &&
x + width <= bottomRight.x &&
y >= topLeft.y &&
@elierotenberg
elierotenberg / IMyProtocol.d.ts
Last active Mar 5, 2019
Statically typechecked serializable protocol
View IMyProtocol.d.ts
import { IProtocol, IRequestResponseMap, IEventMap } from "./IProtocol";
import { ISerializable } from "./ISerializable";
type RequestResponseMap = {
ping: {
RequestParams: {};
ResponseParams: {};
};
echo: {
RequestParams: ISerializable;
@elierotenberg
elierotenberg / async-assign.js
Created Feb 22, 2019
Evaluation order vs. concurrency
View async-assign.js
(async () => {
// small function that resolves after t ms
const sleep = t => new Promise(resolve => setTimeout(resolve, t));
let state = {
counter: 0,
running: true
};
const setCounter = v => {
View concurrency.js
const state = {
counter: 0
};
const randomInt = (min, max) =>
Math.floor(Math.random() * (max - min + 1)) + min;
const sleep = (min, max = min) =>
new Promise(resolve => {
setTimeout(resolve, randomInt(min, max));
View gist:687c44f035f136d092edcbf9d2078a7c
const state = {
counter: 0
};
const randomInt = (min, max) =>
Math.floor(Math.random() * (max - min + 1)) + min;
const sleep = (min, max = min) =>
new Promise(resolve => {
setTimeout(resolve, randomInt(min, max));
@elierotenberg
elierotenberg / task.json
Created Feb 2, 2018
task.json file to run currently opened .m (octave/matlab) file with Ctrl+Shift+B
View task.json
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
{
"label": "Run",
"type": "shell",
"windows": {
"command": "C:\\Octave\\Octave-4.2.1\\bin\\octave-gui.exe",
You can’t perform that action at this time.