steveruizok

/**
 * Seeded random number generator, using [xorshift](https://en.wikipedia.org/wiki/Xorshift).
 * Adapted from [seedrandom](https://github.com/davidbau/seedrandom).
 * @param seed {string} The seed for random numbers.
 */
function rng(seed = '') {
  let x = 0
  let y = 0
  let z = 0
  let w = 0

SteffenBlake

Cheap gear to get the job done

1. Reolink PoE 5MP RLC-522 - https://www.amazon.ca/gp/product/B01AL5D85W/ref=ppx_yo_dt_b_asin_title_o06_s00
2. Mokerlink 1 to 4 port PoE switch - https://www.amazon.ca/MokerLink-Ethernet-Support-IEEE802-3af-Fanless/dp/B07SGBQNLM/ref=sr_1_4
3. (Kind of works) Raspberry Pi 4 - https://www.amazon.ca/CanaKit-Raspberry-Starter-Kit-4GB/dp/B07WRMR2CX/ref=sr_1_4 3a. (Recommended) Nanopi R4S (Way better performance but likely has to ship from China, but it is the far superior device for same price)
4. Recommended: Also get yourself a USB 3.0 portable hard drive, preferably 2TB+, of your preferred brand

Also likely needed:

ef4

Webpack 5 Node Polyfills Upgrade Cheatsheet

Webpack 4 automatically polyfilled many Node APIs in the browser. This was not a great system, because it could lead to surprisingly giant libraries getting pulled into your app by accident, and it gave you no control over the exact versions of the polyfills you were using.

So Webpack 5 removed this functionality. That means you need to make changes if you were relying on those polyfills. This is a quick reference for how to replace the most common patterns.

List of polyfill packages that were used in webpack 4

For each automatically-polyfilled node package name on the left, this shows the name of the NPM package that was used to polyfill it on the right. Under webpack 5 you can manually install these packages and use them via resolve.fallback.

alloy

drewkiimon

import React, { useEffect, useState } from "react";
import { useRouter } from "next/router";
import { MDXProvider } from "@mdx-js/react";

const components = {
	h1: (props: string) => <h1 style={{ color: "tomato" }} {...props} />,
};

const Placeholder: React.FC = () => {
	return <>Loading</>;

shilman

⚠️ Warning: this document is out of date.

For the most recent webpack5 instructions see MIGRATION.md.

Storybook experimental Webpack 5 support

Storybook 6.2 includes experimental Webpack 5 support. Webpack 5 brings a variety of performance improvements, as well as exciting new features like module federation. Here's a quick guide to get you going.

Intro

jacob-ebey

const fs = require("fs");
const path = require("path");

const Template = require("webpack/lib/Template");
const SingleEntryPlugin = require("webpack/lib/SingleEntryPlugin");
const VirtualModulesPlugin = require("webpack-virtual-modules");

const PLUGIN_NAME = "FederatedStartupCodePlugin";

/**

jacob-ebey

/*
  Makes your remote containers low level API accessible via:
  
  import accessFederatedContainer from "access-federated-containers";
  accessFederatedContainer("app2")
*/

/** @typedef {import("webpack").Compiler} Compiler */
/** @typedef {import("webpack").Compilation} Compilation */

steveruizok

import log from "ololog"

class Grid {
	rows = []
	width = 0
	height = 0

	chars = {
		active: ["┌", "─", "┒", "┃", "┛", "━", "┕", "│"],
		inactive: ["┌", "─", "┐", "│", "┘", "─", "└", "│"],

mattdesl

tixy + canvas-sketch

A quick test exporting tixy functions as GIF with canvas-sketch.

Save the file to a new empty folder, then:

npm install canvas-sketch-cli -g