Skip to content

Instantly share code, notes, and snippets.

View composite's full-sized avatar
🤡
와이 쏘 씨리우스야 씨벌로마.

Ukjin Yang composite

🤡
와이 쏘 씨리우스야 씨벌로마.
75 followers · 15 following
View GitHub Profile
@composite
composite / fail2ban-for-host.sh
Created November 8, 2024 10:05
fail2ban: BAN docker services for security (for Docker Host that installed fail2ban)
# INSERT fail2ban FORWARD for Docker host
sudo iptables -I FORWARD -j f2b-postgres
# DELETE fail2ban FORWARD for Docker host
sudo iptables -D FORWARD -j f2b-postgres
# Save
sudo iptables-save
@composite
composite / docker-compose-backup.sh
Last active September 1, 2024 04:25
My docker compose and data backup and refresh container up to date solution.
#!/bin/bash
SHDIR=$(dirname $0)
NOWDA=$(date '+%Y%m%d')
NOWDT=$(date '+%Y%m%d%H%M%S')
BUDIR="/data/backup/docker/compose/$NOWDA"
mkdir -p "$BUDIR"
find "$SHDIR" -maxdepth 3 -type d 2>/dev/null | while read COMPOSE_DIR
@composite
composite / OneDialog.tsx
Last active July 9, 2024 09:09 — forked from alexanderson1993/AlertDialogProvider.tsx
A multi-purpose alert/confirm/prompt replacement built with shadcn/ui AlertDialog components. No Context, SSR friendly, Also works on Next.js and Remix, but requires React 18 or later due to useSyncExternalStore.
'use client';
import * as React from 'react';
import {
AlertDialog,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
@composite
composite / openai.js
Created May 9, 2024 13:19
Next.js Server Sent Event Example (Next.js 13+ App Router)
// app/api/route.ts
import { Configuration, OpenAIApi } from 'openai';
export const runtime = 'nodejs';
// This is required to enable streaming
export const dynamic = 'force-dynamic';
export async function GET() {
const configuration = new Configuration({
apiKey: process.env.OPENAI_API_KEY,
@composite
composite / pass.ts
Created March 16, 2024 08:03
Generate and verify password based on PBKDF2 with SHA-256 using Web Standards. works on modern browser, node(20 or later), and any cloud's edge environment.
const encoder = new TextEncoder();
const ITERATIONS = 65535;
const LENGTH = 64;
const ALGORITHM = 'PBKDF2';
const DIGEST = 'SHA-256';
const DERIVED_KEY = {
name: 'AES-CBC',
length: 256,
} as const;
const USAGES = {
@composite
composite / object-cache.ts
Last active March 16, 2024 10:04
React weak argument using JSON based cache function for Server Component: useful to assign argument as object, array or any serializable values.
import hash from 'object-hash';
export type ObjectCacheFunction<A extends unknown[], V> = (...args: A) => V;
const objectMap = cache(() => new Map<string, any[]>());
export const objectCache = <A extends unknown[], V>(fn: ObjectCacheFunction<A, V>): ObjectCacheFunction<A, V> => {
const map = objectMap();
return new Proxy(
cache((s: string) => fn(...(map.get(s) as A))),
{
@composite
composite / inview.ts
Created February 17, 2024 05:44
React Polymorphic Component for Dummies & IntersectionObserver based Component Example
/* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-unsafe-assignment */
'use client';
import type { ElementType, RefCallback } from 'react';
import { createElement, useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { twMerge } from 'tailwind-merge';
import type { PolymorphicComponentProps } from './polymorphic';
export type InViewProps = {
/**
* The CSS Class that active when inside browser's sight
@composite
composite / safehtml.ts
Last active May 25, 2023 09:18
Safely append plain HTML content from your raw html string for React (caveats: no SSR/SSG friendly. you should handle before use it.)
// other allowed node types
const allowNodes: number[] = [Node.TEXT_NODE, Node.DOCUMENT_FRAGMENT_NODE]
// allowed tags
const allowTags = ['div', 'span', 'p', 'img', 'strong', 'i', 'b', 's', 'br', 'a', 'blockquote', 'code', 'del', 'em', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'hr', 'kbd', 'ol', 'ul', 'li', 'sub', 'sup']
// allowed tag's attributes
const allowAttrs = ['src', 'width', 'height', 'alt', 'title', 'href', 'style']
// generate almost unique hash that avoid key warning
const unsafeHash = () => Math.random().toString(36).substring(2)
@composite
composite / Dynamic.ts
Last active April 14, 2023 13:35
Just React hook utilities.
import {
type ComponentProps,
createElement,
type ElementType,
type ForwardedRef,
forwardRef,
type MutableRefObject,
type ReactDOM,
type ReactElement,
type Ref,
@composite
composite / HowToUse.vue
Created October 16, 2022 12:19
Legacy event bus pattern for Vue 3 Composition API
<script setup>
import useEventBus from './lib/event-bus'
const bus = useEventBus()
bus
.on('session-change', (...args) => {
// TODO Session Change
console.log('session change event fired', args)
})