Tomás Hayes tomyo

## dom3d.js
// 3D Dom viewer, copy-paste this into your console to visualise the DOM as a stack of solid blocks.
// You can also minify and save it as a bookmarklet (https://www.freecodecamp.org/news/what-are-bookmarklets/)
(() => {
  const SHOW_SIDES = false; // color sides of DOM nodes?
  const COLOR_SURFACE = true; // color tops of DOM nodes?
  const COLOR_RANDOM = false; // randomise color?
  const COLOR_HUE = 190; // hue in HSL (https://hslpicker.com)
  const MAX_ROTATION = 180; // set to 360 to rotate all the way round
  const THICKNESS = 20; // thickness of layers
  const DISTANCE = 10000; // ¯\\_(ツ)_/¯

## scoped-script.html
<!DOCTYPE html>

<script id='scoped-script'>
let i = 0;
(new MutationObserver(rx=>rx.forEach(({target:s}) => {
  if (s.tagName !== 'SCRIPT' || s.scoped || !s.hasAttribute('scoped')) return
  s.scoped=true
  if (!s.id) s.id='__s'+i++
  s.innerHTML=`(function(){${s.innerHTML}}).call(document.getElementById('${s.id}').parentNode)`
}))).observe(document, {childList:true,subtree:true,attributes:true,attributeFilter:['scoped']})

## useLocalStorage.js
import { useState } from "react";

export function useLocalStorage<T>(key: string, initialValue: T): [T, (s: T) => void] {
    // State to store our value
    // Pass initial state function to useState so logic is only executed once
    const [storedValue, setStoredValue] = useState<T>(() => {
        try {
            // Get from local storage by key
            const item = window.localStorage.getItem(key);
            // Parse stored json or if none return initialValue

## custom-elements-pattern.md

      
              1 file
            
          
              3 forks
            
          
              1 comment
            
          
              57 stars
            
          
                WebReflection
                / custom-elements-pattern.md
            
            
              Last active
              February 14, 2024 00:13
            
              
                Handy Custom Elements' Patterns
              
          
    Handy Custom Elements' Patterns


^{Photo by Ricardo Gomez Angel on Unsplash}
This gist is a collection of common patterns I've personally used here and there with Custom Elements.
These patterns are all basic suggestions that could be improved, enriched, readapted, accordingly with your needs.

  
## 55-bytes-of-css.md

      
              1 file
            
          
              115 forks
            
          
              31 comments
            
          
              2132 stars
            
          
                JoeyBurzynski
                / 55-bytes-of-css.md
            
            
              Last active
              April 10, 2024 20:23
            
              
                58 bytes of css to look great nearly everywhere
              
          
    58 bytes of CSS to look great nearly everywhere

When making this website, i wanted a simple, reasonable way to make it look good on most displays. Not counting any minimization techniques, the following 58 bytes worked well for me:
main {
  max-width: 38rem;
  padding: 2rem;
  margin: auto;
}

  
## mongodb_3.2.x_replica_sets_on_aws_ec2.md

      
              1 file
            
          
              26 forks
            
          
              8 comments
            
          
              36 stars
            
          
                leommoore
                / mongodb_3.2.x_replica_sets_on_aws_ec2.md
            
            
              Last active
              March 15, 2022 22:28
            
              
                MongoDB 3.2.x Replica Sets on AWS EC2
              
          
    #MongoDB 3.2.x Replica Sets on AWS EC2
A MongoDB replica set provides a mechanism to allow for a reliable database services. The basic replica set consists of three servers, a primary, a secondary and an arbitrator. The primary and secondary both hold a copy of the data. The arbitrator is normally a low spec server which just monitors the other servers and help with the failover process. In production, there can be more than three servers.
To setup mongo as a replica set on Amazon Web Services EC2 you need to first setup a security group with ssh on port 22 and mongodb on port 27017. You then need to create three servers. Select Ubuntu 14.04 LTS x64 and a micro (or bigger depending on your database size, ideally you should have enough memory to match your database size) instance for the primary and secondary and a nano instance for the arbitrator.
##Adjust the File System on each Server
The operating system by default will update the last access time on a file. In a high data throughput database application

  
## object-watch.js
/*
 * object.watch polyfill
 *
 * 2012-04-03
 *
 * By Eli Grey, http://eligrey.com
 * Public Domain.
 * NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
 */
	// 3D Dom viewer, copy-paste this into your console to visualise the DOM as a stack of solid blocks.
	// You can also minify and save it as a bookmarklet (https://www.freecodecamp.org/news/what-are-bookmarklets/)
	(() => {
	const SHOW_SIDES = false; // color sides of DOM nodes?
	const COLOR_SURFACE = true; // color tops of DOM nodes?
	const COLOR_RANDOM = false; // randomise color?
	const COLOR_HUE = 190; // hue in HSL (https://hslpicker.com)
	const MAX_ROTATION = 180; // set to 360 to rotate all the way round
	const THICKNESS = 20; // thickness of layers
	const DISTANCE = 10000; // ¯\\_(ツ)_/¯
	<!DOCTYPE html>

	<script id='scoped-script'>
	let i = 0;
	(new MutationObserver(rx=>rx.forEach(({target:s}) => {
	if (s.tagName !== 'SCRIPT' \|\| s.scoped \|\| !s.hasAttribute('scoped')) return
	s.scoped=true
	if (!s.id) s.id='__s'+i++
	s.innerHTML=`(function(){${s.innerHTML}}).call(document.getElementById('${s.id}').parentNode)`
	}))).observe(document, {childList:true,subtree:true,attributes:true,attributeFilter:['scoped']})
	import { useState } from "react";

	export function useLocalStorage<T>(key: string, initialValue: T): [T, (s: T) => void] {
	// State to store our value
	// Pass initial state function to useState so logic is only executed once
	const [storedValue, setStoredValue] = useState<T>(() => {
	try {
	// Get from local storage by key
	const item = window.localStorage.getItem(key);
	// Parse stored json or if none return initialValue
	/*
	* object.watch polyfill
	*
	* 2012-04-03
	*
	* By Eli Grey, http://eligrey.com
	* Public Domain.
	* NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
	*/