Steven Olsen crazy4groovy

## useEvent.tsx
type AnyFunction = (...args: any[]) => any

function useEvent<T extends AnyFunction>(callback?: T) {
  const ref = useRef<AnyFunction | undefined>(() => {
    throw new Error("Cannot call an event handler while rendering.")
  })
  // Or useInsertionEffect if it's React 18
  useLayoutEffect(() => {
    ref.current = callback
  })

## little-vdom-decompiled.js
/* eslint-disable no-unused-vars */
/* eslint-disable no-else-return */

// JSX constructor, similar to createElement()
export const h = (type, props, ...children) => {
	return {
		type,
		// Props will be an object for components and DOM nodes, but a string for
		// text nodes
		props,

## plink-plonk.js
/*
Copy this into the console of any web page that is interactive and doesn't
do hard reloads. You will hear your DOM changes as different pitches of
audio.

I have found this interesting for debugging, but also fun to hear web pages
render like UIs do in movies.
*/

const audioCtx = new (window.AudioContext || window.webkitAudioContext)()

## docker_wordpress.md

      
              1 file
            
          
              386 forks
            
          
              102 comments
            
          
              778 stars
            
          
                bradtraversy
                / docker_wordpress.md
            
            
              Last active
              April 25, 2024 15:18
            
              
                Docker Compose FIle For Wordpress, MySQL & phpmyadmin
              
          
    Wordpress & Docker

This file will setup Wordpress, MySQL & PHPMyAdmin with a single command. Add the code below to a file called "docker-compose.yaml" and run the command
$ docker-compose up -d

# To Tear Down
$ docker-compose down --volumes


## django_cheat_sheet.md

      
              1 file
            
          
              141 forks
            
          
              16 comments
            
          
              214 stars
            
          
                bradtraversy
                / django_cheat_sheet.md
            
            
              Last active
              February 24, 2024 23:35
            
              
                Django command cheat sheet
              
          
    Django 2.x Cheat Sheet

Creating a virtual environment

We need to create a virtual env for our app to run in: More Here
Run this command in whatever folder you want to create your venv folder
python -m venv ./venv


## gfonts-preview.html
<!DOCTYPE html>
<html>
<head>
    <title>Google Fonts Preview</title>
    <style>
        #preview {
            margin: 0 auto;
            text-align: center;
            width: 80%;
        }

## react-jets.js
/**
 * Inspired by: https://jets.js.org
 **/
import React from 'react'
import PropTypes from 'prop-types'

const style = Object.freeze({
  borderRadius: '5px',
  padding: '.1em'
})

## dashboard.yml
dashboard "Food":
  - h1 text: Food
  - h2 text: By caloric content
  - 3 columns:
    - rows:
      - h3 text: Bananas
      - pie chart: {
          "columns": [
            ["Protein", 5], ["Sugar", 10], ["Other carbs", 40], ["Fat", 1]
          ]

## file-types.css
/*
 * Archives
 * A compressed collection of data.
*/
a[href$=".7z"],
a[href$=".cab"],
a[href$=".gz"],
a[href$=".lzh"],
a[href$=".rar"],
a[href$=".tar"],

## ProgressBar.css
#progress-bar {
  border: 1px solid lightblue;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 1;
  transition: opacity .5s ease-in-out;
  animation: progress-bar-grow 10s 0s infinite alternate backwards;
}
	type AnyFunction = (...args: any[]) => any

	function useEvent<T extends AnyFunction>(callback?: T) {
	const ref = useRef<AnyFunction \| undefined>(() => {
	throw new Error("Cannot call an event handler while rendering.")
	})
	// Or useInsertionEffect if it's React 18
	useLayoutEffect(() => {
	ref.current = callback
	})
	/* eslint-disable no-unused-vars */
	/* eslint-disable no-else-return */

	// JSX constructor, similar to createElement()
	export const h = (type, props, ...children) => {
	return {
	type,
	// Props will be an object for components and DOM nodes, but a string for
	// text nodes
	props,
	/*
	Copy this into the console of any web page that is interactive and doesn't
	do hard reloads. You will hear your DOM changes as different pitches of
	audio.

	I have found this interesting for debugging, but also fun to hear web pages
	render like UIs do in movies.
	*/

	const audioCtx = new (window.AudioContext \|\| window.webkitAudioContext)()
	<!DOCTYPE html>
	<html>
	<head>
	<title>Google Fonts Preview</title>
	<style>
	#preview {
	margin: 0 auto;
	text-align: center;
	width: 80%;
	}
	/**
	* Inspired by: https://jets.js.org
	**/
	import React from 'react'
	import PropTypes from 'prop-types'

	const style = Object.freeze({
	borderRadius: '5px',
	padding: '.1em'
	})
	dashboard "Food":
	- h1 text: Food
	- h2 text: By caloric content
	- 3 columns:
	- rows:
	- h3 text: Bananas
	- pie chart: {
	"columns": [
	["Protein", 5], ["Sugar", 10], ["Other carbs", 40], ["Fat", 1]
	]
	/*
	* Archives
	* A compressed collection of data.
	*/
	a[href$=".7z"],
	a[href$=".cab"],
	a[href$=".gz"],
	a[href$=".lzh"],
	a[href$=".rar"],
	a[href$=".tar"],
	#progress-bar {
	border: 1px solid lightblue;
	position: fixed;
	top: 0;
	left: 0;
	opacity: 1;
	transition: opacity .5s ease-in-out;
	animation: progress-bar-grow 10s 0s infinite alternate backwards;
	}