Skip to content

Instantly share code, notes, and snippets.

View trevsm's full-sized avatar
👨‍💻

Trevor Smith trevsm

👨‍💻
View GitHub Profile
@trevsm
trevsm / useFetch.jsx
Created January 5, 2024 18:12
A generic react fetch hook
import { useState } from 'react';
function useFetch({ onSuccess, onError }) {
const [data, setData] = useState(null);
const [loading, setLoading] = useState(false);
const [error, setError] = useState(null);
const handleFetch = async (url, options = {}) => {
setLoading(true);
setError(null);
@trevsm
trevsm / compresspng.go
Created December 11, 2022 07:27
Compresses png files to 50% their original size using nearest-neighbor scaling algorithm
package main
import (
"fmt"
"image"
"image/png"
"io/ioutil"
"os"
)
@trevsm
trevsm / createElement.js
Created May 17, 2021 21:26
React-like createElement for manual jsx
function createElement(tag, attrs, ...children) {
// Custom Components will be functions
if (typeof tag === 'function') { return tag() }
// regular html tags will be strings to create the elements
if (typeof tag === 'string') {
// fragments to append multiple children to the initial node
const fragments = document.createDocumentFragment()
const element = document.createElement(tag)
children.forEach(child => {
@trevsm
trevsm / devices.json
Created November 13, 2020 22:15
List of popular device sizes (extracted from Chrome Developer Tools)
{
"BlackBerry Z30": {
"width": 360,
"height": 640
},
"BlackBerry PlayBook": {
"width": 600,
"height": 1040
},
"Galaxy Note 3": {
@trevsm
trevsm / devices.json
Last active November 11, 2020 22:39
Large archive of device screen sizes and aspect ratios (extracted from Wikipedia)
{
"3x4K:12K gaming PC": {
"designation": "12K",
"width": "11520",
"height": "2160",
"total-pixels": "24,883,200",
"aspect-ratio": {
"storage": "11520:2160",
"display": "48:9",
"pixel": "5.333"
@trevsm
trevsm / Card.js
Last active October 15, 2020 05:55
import React from 'react'
import './Card.css'
function Item(props) {
let value
if (Array.isArray(props.value)) {
value = props.value.map(n => <span key={n}>{n}</span>)
} else {
value = <span>{props.value}</span>
}
// returns array with existing delimiters
function parseText(text){
const reg1 = /(?<=\[name\]|\[age\])/g // negative lookahead
const reg2 = /(?=\[name\]|\[age\])/g // positive lookahead
return(Array.prototype.concat.apply([], (text.split(reg1).map(m => m.split(reg2)))))
}
@trevsm
trevsm / html_tag_archive.txt
Created October 6, 2020 22:33
(2020) Currently every valid/invalid html tag
<!--...-->
<!doctype >
<a></a>
<abbr></abbr>
<acronym></acronym>
<address></address>
<applet></applet>
<area></area>
<article></article>
<aside></aside>
import React, { Component } from 'react';
import { Messages } from "./templates/Messages";
import { SendForm } from "./templates/SendForm";
import { scrollbarFunctions, textareaFunctions, generateFunctions, getDom } from "../js/custom.js"
import '../css/app.css';
export default class App extends Component {
constructor() {
super()
this.state = {