elierotenberg

(() => {
  const css = `
    .player-timedtext > div {
      position: static !important;
      text-align: center !important;
    }
  `;

  const style = document.createElement("style");
  style.innerHTML = css;

elierotenberg

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

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

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

(() => {
  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

import { IProtocol, IRequestResponseMap, IEventMap } from "./IProtocol";
import { ISerializable } from "./ISerializable";

type RequestResponseMap = {
  ping: {
    RequestParams: {};
    ResponseParams: {};
  };
  echo: {
    RequestParams: ISerializable;

elierotenberg

(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 => {

elierotenberg

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

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

{
  // 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",