Gary Grumbley ggrumbley

## zustand-internals.jsx
import { useSyncExternalStore } from "react";
// For more on the useSyncExternalStore hook, see https://react.dev/reference/react/useSyncExternalStore

// The code is almost identical to the source code of zustand, without types and some features stripped out.
// Check the links to see the references in the source code.
// The links are referencing the v5 of the library. If you plan on reading the source code yourself v5 is the best way to start.
// The current v4 version contains lot of deprecated code and extra stuff that makes it hard to reason about if you're new to this.

// https://github.com/pmndrs/zustand/blob/fe47d3e6c6671dbfb9856fda52cb5a3a855d97a6/src/vanilla.ts#L57-L94
function createStore(createState) {

## node-typescript-esm.md

      
              1 file
            
          
              47 forks
            
          
              30 comments
            
          
              545 stars
            
          
                khalidx
                / node-typescript-esm.md
            
            
              Last active
              July 3, 2024 18:04
            
              
                A Node + TypeScript + ts-node + ESM experience that works.
              
          
    The experience of using Node.JS with TypeScript, ts-node, and ESM is horrible.
There are countless guides of how to integrate them, but none of them seem to work.
Here's what worked for me.
Just add the following files and run npm run dev. You'll be good to go!
package.json


## javascript-proxy-as-rest-client.js
/* Using a JavaScript proxy for a super low code REST client */
// via https://dev.to/dipsaus9/javascript-lets-create-aproxy-19hg
// also see https://towardsdatascience.com/why-to-use-javascript-proxy-5cdc69d943e3
// also see https://github.com/fastify/manifetch
// also see https://github.com/flash-oss/allserver
// and https://gist.github.com/v1vendi/75d5e5dad7a2d1ef3fcb48234e4528cb

const createApi = (url) => {
  return new Proxy({}, {
    get(target, key) {

## regex_html_tag.md

      
              1 file
            
          
              2 forks
            
          
              3 comments
            
          
              11 stars
            
          
                gavin-asay
                / regex_html_tag.md
            
            
              Last active
              July 4, 2024 11:22
            
              
                Regex and You: Matching an HTML Tag
              
          
    Regex and You: Matching an HTML Tag

Regular expressions, ever versatile, will help up locate HTML tags in a string today.
Summary

Pattern matching HTML strings serves at least one crucial function in web dev: sanitizing user input. Allowing user-submitted strings opens one's application to significant vulnerability. Supposing, for example, some ne'er-do-well on the internet submitted a comment that includes <script src="[path]/stealYourData.js"></script>. Regular expressions allow us to match HTML tags in a string, because HTML tags conform to a certain pattern:

begin and end with brackets (<>)
contain a string name consisting of one or more lowercase letters, like p, a, div, strong, script


## README.md

      
              2 files
            
          
              9 forks
            
          
              0 comments
            
          
              4 stars
            
          
                curran
                / README.md
            
            
              Last active
              April 19, 2024 03:27
            
              
                CSS Named Colors
              
          
    A dataset containing named CSS colors.
From MDN: CSS Colors.

  
## frame.tsx
import * as React from 'react'
import { createPortal } from 'react-dom'

type FrameProps = React.IframeHTMLAttributes<HTMLIFrameElement> & {
  head?: React.ComponentType<any>
  children?: React.ReactNode
}
const Frame = React.memo(({head, children, ...iframeProps}: FrameProps)=> {
  const node = React.useRef<HTMLIFrameElement>()
  const [doc, setDoc] = React.useState<Document>()

## 55-bytes-of-css.md

      
              1 file
            
          
              114 forks
            
          
              32 comments
            
          
              2135 stars
            
          
                JoeyBurzynski
                / 55-bytes-of-css.md
            
            
              Last active
              July 20, 2024 05:29
            
              
                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;
}

  
## README.md

      
              2 files
            
          
              0 forks
            
          
              0 comments
            
          
              15 stars
            
          
                avimar
                / README.md
            
            
              Last active
              July 1, 2017 14:13
            
              
                Node.js/Javascript Stack
              
          
    Programming Environment:


Microsoft Visual Studio Code: build in git-support, auto-complete, TypeScript paramater lookup.
Bitbucket for GIT: free private repo

node.js backend:


nconf: loadable, pluggable configuration
restify: instead of express, it's oriented for APIs
bunyan: for logging, built in support from restify
knex.js: SQL query builder/promises/pooling (but it's not an ORM)
PM2: deploy and clustering


## _sanfrancisco-font.md

      
              2 files
            
          
              5 forks
            
          
              0 comments
            
          
              20 stars
            
          
                mfd
                / _sanfrancisco-font.md
            
            
              Last active
              May 4, 2024 22:33
            
              
                San Francisco Web Font
              
          
    Web fonts

Custom webfonts
https://gist.githubusercontent.com/mfd/614e2e80a22b878bde63cb471cbe677e/raw/4996edf5eb9aea434e0cbdc81923fb110a29d060/sanfrancisco-font.css

<link rel="stylesheet prefetch" href="https://gist.githubusercontent.com/mfd/614e2e80a22b878bde63cb471cbe677e/raw/eef2aabfd0d588d43285431186a0cf70305ceb80/sanfrancisco-font.css">


## anonymous
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/4.0.6/rx.all.js"></script>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <div id="app"></div>
	import { useSyncExternalStore } from "react";
	// For more on the useSyncExternalStore hook, see https://react.dev/reference/react/useSyncExternalStore

	// The code is almost identical to the source code of zustand, without types and some features stripped out.
	// Check the links to see the references in the source code.
	// The links are referencing the v5 of the library. If you plan on reading the source code yourself v5 is the best way to start.
	// The current v4 version contains lot of deprecated code and extra stuff that makes it hard to reason about if you're new to this.

	// https://github.com/pmndrs/zustand/blob/fe47d3e6c6671dbfb9856fda52cb5a3a855d97a6/src/vanilla.ts#L57-L94
	function createStore(createState) {
	/* Using a JavaScript proxy for a super low code REST client */
	// via https://dev.to/dipsaus9/javascript-lets-create-aproxy-19hg
	// also see https://towardsdatascience.com/why-to-use-javascript-proxy-5cdc69d943e3
	// also see https://github.com/fastify/manifetch
	// also see https://github.com/flash-oss/allserver
	// and https://gist.github.com/v1vendi/75d5e5dad7a2d1ef3fcb48234e4528cb

	const createApi = (url) => {
	return new Proxy({}, {
	get(target, key) {
	import * as React from 'react'
	import { createPortal } from 'react-dom'

	type FrameProps = React.IframeHTMLAttributes<HTMLIFrameElement> & {
	head?: React.ComponentType<any>
	children?: React.ReactNode
	}
	const Frame = React.memo(({head, children, ...iframeProps}: FrameProps)=> {
	const node = React.useRef<HTMLIFrameElement>()
	const [doc, setDoc] = React.useState<Document>()
	<!DOCTYPE html>
	<html>
	<head>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/4.0.6/rx.all.js"></script>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>JS Bin</title>
	</head>
	<body>
	<div id="app"></div>