elierotenberg

import autobind from './autobind';

class Base {
  constructor(v) {
    this.v = v;
  }
}

function multiply(by) {
  return function $multiply(target, name, descriptor) {

elierotenberg

@stores({
  ...
})
@debouncePropsUpdate({
  x: 1000,
})
@throttlePropsUpdate({
  y: 1000,
})
class MyComponent extends React.Component {

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

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

(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

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

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

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

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

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.