Patrick trickpattyFH20

Keybase proof

I hereby claim:

I am trickpattyfh20 on github.
I am trickpatty (https://keybase.io/trickpatty) on keybase.
I have a public key ASBoswRiuxXfg8WN2oO8JwI5aDEVOIih5JL00ABLVG3wqwo

To claim this, I am signing this object:

Observables

You don't really need a framework or fancy cutting-edge JavaScript features to do two-way data binding. Let's start basic - first and foremost, you need a way to tell when data changes. Traditionally, this is done via an Observer pattern, but a full-blown implementation of that is a little clunky for nice, lightweight JavaScript. So, if native getters/setters are out, the only mechanism we have are accessors:

var n = 5;
function getN() { return n; }
function setN(newN) { n = newN; }

console.log(getN()); // 5

setN(10);

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.

Building a react native app in WSL2

Install, build and debug a react native app in WSL2 (Windows Subsystem for Linux) and Ubuntu.

Install tools in Windows
Install tools in WSL2
Connect to android hardware device from WSL2
Connect to android virtual device in Windows
- Start android virtual device in Windows
Start adb server in Windows

	console.error = (function() {
	const cached_function = console.error;
	return function(...args) {
	cached_function('%c ',
	`background-image: url("http://goo.gl/UBH9ZT");
	background-repeat: no-repeat;
	background-size: 40px, auto;
	font-size: 40px`
	);
	cached_function.apply(console, [...args]);

	"use strict";
	var Benchmark = require('benchmark');
	var suite = new Benchmark.Suite;

	// add tests
	suite
	.add('for', function() {
	const a = [1, 2, 3];
	const b = [4, 5, 6];

	var a = [0, 0, 1, 0, 2, 3, 0, 4, 0, 5];

	var idx;

	function findIdx() {
	idx = a.indexOf(0);
	return idx;
	}

	while (findIdx() !== -1) {

	'use strict';

	const ExtractTextPlugin = require('extract-text-webpack-plugin');

	const path = require('path');

	exports.tslint = {
	test: /\.ts$/,
	loader: 'tslint',
	exclude: [

	(() => {
	function walkDom(node, func) {
	var children = node.childNodes;
	for (var i = 0; i < children.length; i++) {
	walkDom(children[i], func);
	}
	func(node);
	}
	walkDom(document.body, (node) => {
	if (node.shadowRoot) {

	Array.from(document.querySelectorAll('[data-a-popover]')).forEach((el) => {
	const itemJson = JSON.parse(el.dataset.aPopover);
	const { url } = itemJson;
	if (url && url.includes('review')) {
	fetch(url)
	.then((response) => response.text())
	.then((html) => {
	const parser = new DOMParser();
	const doc = parser.parseFromString(html, 'text/html');
	const reviewPopupClone = doc.cloneNode(true);