Munawwar

const htm = require('htm');
const { default: satori } = require('satori');
const { Resvg } = require('@resvg/resvg-js')
const { promises } = require('node:fs');
const { join } = require('node:path')

const html = htm.bind(function jsxToObject(type, props, ...children) {
  return {
    type,
    props: {

Munawwar

// time to first byte
const https = require('https');
const http = require('http');

/**
 * @param {Object} arg
 * @param {String} arg.host
 * @param {String} arg.path
 * @param {{ [k: string]: string }} arg.headers
 */

Munawwar

import { useState } from 'react';
import { merge } from 'lodash';

function useObjectState(defaultVal = {}) {
  const [state, setState] = useState(defaultVal);
  const updateState = (newState) => {
    setState((previousState) => ({ ...previousState, ...newState }));
  };
  const deepMergeState = (newState) => {
    setState((previousState) => merge({}, previousState, newState));

Munawwar

import { useEffect, useState } from 'react';

/**
 * @template T
 * @param {(previousState: T) => Promise<T>} getAsyncState async function to fetch state
 * @param {T} initialState
 * @param {any[]} [dependencies=[]] similar to useEffect dependencies. change in dependencies will
 * automatically call getAsyncState again
 * @returns {[T, (newState: T) => void, () => Promise<void>]} [state, setState, refetch]
 */

Munawwar

# A minimal Docker file for node.js and Puppeteer

# debian 10 (buster slim) amd64 + node v14
# https://hub.docker.com/layers/node/library/node/14.17.1-buster-slim/images/sha256-10c6bf7204614c18b0734a218f576082ea2d15e9af7b7817a07eddcd7d05a255?context=explore
FROM node:14.17.1-buster-slim@sha256:10c6bf7204614c18b0734a218f576082ea2d15e9af7b7817a07eddcd7d05a255

RUN apt-get update \
    # Install dependencies of Chromium that Puppeteer installs
    # Dependency list for puppeteer v10.0.0 taken from https://github.com/puppeteer/puppeteer/blob/v10.0.0/docs/troubleshooting.md#chrome-headless-doesnt-launch-on-unix
    # Puppeteer v10.0.0 installs Chromium 92.0.4512.0 / r884014

Munawwar

const whitespace = '[\\x20\\t\\r\\n\\f]';
const unescapeRegExp = new RegExp('\\\\([\\da-f]{1,6}' + whitespace + '?|(' + whitespace + ')|.)', 'ig');

function unescOrig(str) {
  return str.replace(unescapeRegExp, (_, escaped, escapedWhitespace) => {
    const high = '0x' + escaped - 0x10000;

    // NaN means non-codepoint
    // Workaround erroneous numeric interpretation of +"0x"
    // eslint-disable-next-line no-self-compare

Munawwar

PEM is a CSS naming convention. Inspired by BEM CSS and Suit CSS naming convention.

P = Prefix
E = Element
M = Modifier

Acceptable CSS class name formats:

Munawwar

// MIT License 2021 - https://opensource.org/licenses/MIT
const delay = require('delay');

/**
 * @param {AWS.DynamoDB.DocumentClient} dynamodbDocumentClient
 * @param {string} tableName
 * @param {string} ownerId a lock's gotta have an owner!
 * @param {Object} [options]
 * @param {string} [options.hashKeyProperty='key'] default value is 'key'
 * @param {string} [options.hashKeyValue='lock'] default value is 'lock'

Munawwar

# pip3 install opencv-contrib==4.5.1.48 opencv-contrib-python==4.5.1.48
import numpy as np
import cv2

src = cv2.imread('sample.jpg', 1)
blurred = cv2.GaussianBlur(src, (5, 5), 0)

blurred_float = blurred.astype(np.float32) / 255.0
# download model from https://github.com/opencv/opencv_extra/blob/5e3a56880fb115e757855f8e01e744c154791144/testdata/cv/ximgproc/model.yml.gz
edgeDetector = cv2.ximgproc.createStructuredEdgeDetection("model.yml")

Munawwar

import create, { State, StateSelector } from 'zustand';

// initialization
const initialStates = { count: 0 }; // no need to add your actions here like how zustand README shows.
const useStore = create(() => initialStates);
const { getState, setState } = useStore;

// usage within function component (reactive)
const Component = () => {
  const count = useStore(state => state.count);