andria-dev

// You can also use TypeScript types to make the rest of ...props match
// what the HTML props or component props would be for that tag.
function Confetti({ tag: Tag, options, ...props }) {
  const nodeRef = useRef(null);
  
  /* logic */
  
  return <Tag ref={nodeRef} {...props}>{/* stuff */}</Tag>;
}

andria-dev

// Same as useEffect in <App> but abstracted
function useLog(...values) {
	useEffect(() => {
		console.log(...values)
	}, values)
}

function App() {
	const [todos, setTodos] = useState([]);

andria-dev

#!/usr/bin/env python3
"""
# Usage

Copy and paste the below line of code into your Python interpreter and
it will give you a string of all characters from 1 to 255 inclusive that
you can copy and paste into your Python code to generate your payload.

You can also just copy the result that I already have here lol.
"""

andria-dev

Accessibility of Burger Menu Structures

When creating a navigation menu that can be expanded/opened and closed, it is important that the navigation landmark itself, the , remain visible at all times for those using a screen reader that are looking for that landmark. Alongside this, the button that is used to expand the navigation menu needs to be inside of the navigation landmark for the most accessible experience. When the button is inside the , the screen reader user can easily find that button when jumping to the navigation landmark.

andria-dev

#!/bin/bash
# function definitions

pressAnyKeyToContinue() {
    read -n 1 -s -r -p "Press any key to continue."
}

# Get sudo privileges beforehand
sudo -v

andria-dev

// Front-End: Let's pick our product, ask for a Session ID, and redirect to the checkout page.
import { useShoppingCart, formatCurrencyString } 'use-shopping-cart'

function Product({ product }) {
  const { redirectToCheckout } = useShoppingCart()
  const { name, image, description, currency } = product
  const price = formatCurrencyString({ value: product.price, currency, language: 'en-US' })

  async function buyNow() {
    const response = await fetch("/.netlify/functions/create-session", {

andria-dev

# Usage: yarn remove $(Get-NodePackages -Pattern 'gatsby')
function Get-NodePackages {
	param (
		$Pattern = '.*',
		$PackagePath = '.\package.json'
	)

	$package = ConvertFrom-Json $(gc $PackagePath | Out-String)
	$dependencies = $package.dependencies ?? @()
	$devDependencies = $package.devDependencies ?? @()

andria-dev

// Half Precision Floats

/**
 * @description Converts a binary number like: 1100101011000000
 * sign | exponent | significand
 * 1    | 10010    | 1011000000
 *
 * back into it's decimal representation, in this case it's -13.5
 *
 * @param {string} binaryString a binary number in string format

andria-dev

import preact from 'preact';

function printWarning(message) {
  message = `Warning: ${message}`;
  if (typeof console !== 'undefined') {
    console.error(message);
  }
}

// installs global prop checker