Snippets
Variable casings.casings.txt
snake_case kebab-case camelCase PascalCase
Truncate text to oneline if parent can overflow.truncate.css
display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
Scroll element into viewcenter-element.js
document.getElementById('ELEMENT_ID').scrollIntoView({
behavior: 'smooth',
block: 'center',
inline: 'center'
});Encode and decode URIencode-decode.js
const encodedString = encodeURI(stringToEncode); const decodedString = decodeURI(encodedString);
Delete DynamoDB table if existsdelete-table.py
import boto3
client = boto3.session.Session().client('dynamodb')
existing_tables = client.list_tables()
if 'TABLE_NAME' in existing_tables['TableNames']:
print('Table already exists. Deleting table.')
client.delete_table(
TableName='TABLE_NAME'
)
waiter = client.get_waiter('table_not_exists')
waiter.wait(
TableName='TABLE_NAME',
WaiterConfig={
'Delay': 60,
'MaxAttempts': 30
}
)
print('Table deleted.')Export DynamoDB table to S3 using boto3export-table.py
import boto3
client = boto3.session.Session().client('dynamodb')
table_description = client.describe_table(
TableName='TABLE_NAME'
)
export_arn = client.export_table_to_point_in_time(
TableArn=table_description['Table']['TableArn'],
S3Bucket='BUCKET_NAME',
S3Prefix='PREFIX_NAME',
ExportFormat='DYNAMODB_JSON',
ExportType='FULL_EXPORT',
)['ExportDescription']['ExportArn']
while True:
description = client.describe_export(
ExportArn=export_arn
)
status = description['ExportDescription']['ExportStatus']
if status == 'FAILED':
print(description['ExportDescription']['FailureMessage'])
sys.exit()
elif status == 'IN_PROGRESS':
print('Export still in progress. Checking again after 1 minute.')
time.sleep(60)
else:
print('Export completed.')
breakTurn on Point-In-Time Recovery for DynamoDB using boto3toggle-pitr.py
import boto3
client = boto3.session.Session().client('dynamodb')
client.update_continuous_backups(
TableName='TABLE_NAME,
PointInTimeRecoverySpecification={
'PointInTimeRecoveryEnabled': True
}
)Print Color in Pythonprint_color.py
def print_warning(message):
print('\033[93m' + str(message) + '.\033[0m')
def print_error(message):
print('\033[91m' + str(message) + '.\033[0m')Logging in Pythonlog.py
import logging
logging.basicConfig(filename=str(time.time()) + '.log', level=logging.INFO)
def log(message):
logging.info(str(datetime.now()) + ': ' + message)Processes in Pythonprocesses.py
from multiprocessing import Process
def start_processes(items, param):
processes = []
for item in items:
process = Process(target=do_something, args=(item,param,))
processes.append(process)
process.start()
for process in processes:
process.join()
def do_something(item, param):
print('do something')Threads in Pythonthreads.py
from threading import Thread
def start_threads(items, param):
threads = []
for item in items:
thread = Thread(target=do_something, args=(item,param,))
threads.append(thread)
thread.start()
for thread in threads:
thread.join()
def do_something(item, param):
print('do something')Measure total script timetimer.py
import time start = time.time() print(round((time.time() - start) / 60, 2), 'minutes.')
Listen to URL changeurl-change.js
this.urlObserver = new MutationObserver(() => {
if (window.location.href !== previousUrl) {
previousUrl = window.location.href;
console.info('URL CHANGED!');
}
});
this.urlObserver.observe(document, { subtree: true, childList: true });Sanitize user inputsanitize.ts
/**
* Sanitizes the provided input
* @param input The input to be sanitized
*/
static sanitize(input: string): string {
return input ? input.replaceAll(/(<([^>]+)>)/gi, '') : '';
}Copy to Clipboardcopy.js
navigator.clipboard.writeText(text);
URL Parameter Serviceurl-parameter.service.ts
import { inject } from 'aurelia-dependency-injection';
import { Router } from 'aurelia-router';
/**
* This class handles store management through URL parameters
*/
export class UrlParameterService {
constructor(@inject(Router) private router: Router) {}
/**
* Gets the value of the URL parameter
* @param key Parameter name to retrieve
* @returns Parameter value
*/
get(key: string): string {
const url = new URL(window.location.href);
return url.searchParams.get(key);
}
/**
* Adds or updates URL parameter value
* @param key Name of the parameter
* @param value Parameter value
*/
set(key: string, value: string): void {
const url = new URL(window.location.href);
url.searchParams.set(key, value);
this.updateNavigation(url);
}
/**
* Removes an existing URL parameter entry
* @param key Name of the parameter to remove
*/
remove(key: string): void {
const newUrl = new URL(window.location.origin + window.location.pathname);
const oldUrl = new URL(window.location.href);
for (const [parameter, value] of oldUrl.searchParams.entries()) {
if (parameter !== key) {
newUrl.searchParams.set(parameter, value);
}
}
this.updateNavigation(newUrl);
}
/**
* Updates the current navigation
* @param url URL object to navigate to
*/
private updateNavigation(url: URL): void {
this.router.navigate(`${this.router.currentInstruction.fragment}${url.search}`);
}
}File Servicefile.service.ts
/**
* This class is used to handle files from the API
*/
export class FileService {
/**
* Creates and downloads file
* @param filename Default name of the file on save
* @param type Type of the file to save as
* @param content File content in bytes
*/
downloadFile(filename: string, type: string, content: string): void {
// Create blob with file content
const fileData = new Blob([this.encodeArrayBuffer(content)], { type });
// Create a hidden HTML element to perform download
const link = document.createElement('a');
link.href = window.URL.createObjectURL(fileData);
link.setAttribute('download', filename);
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
/**
* Encodes file content to array buffer
* @param content File content string
* @returns Array buffer to create blob with
*/
private encodeArrayBuffer(content: string): Uint8Array {
// Decode a string of Base64-encoded data into bytes
const binaryString = window.atob(content);
// Create an array of unicode values
const bytes = new Uint8Array(binaryString.length);
for (let i = 0; i < binaryString.length; i++) {
const asciiValue = binaryString.charCodeAt(i);
bytes[i] = asciiValue;
}
return bytes;
}
}
Type Guardtype-guard.ts
/**
* Type guard to check whether provided animal is a dog
* @param animal Animal object to check
* @returns Whether animal is a dog
*/
private isDog(animal: any): animal is Dog {
return !!animal.isCute;
}CSS Resetreset.css
html {
box-sizing: border-box;
font-size: 16px;
}
*, *:before, *:after {
box-sizing: inherit;
}
body, h1, h2, h3, h4, h5, h6, p, ol, ul {
margin: 0;
padding: 0;
font-weight: normal;
}
ol, ul {
list-style: none;
}
img {
max-width: 100%;
height: auto;
}Generate GUIDgenerate-guid.js
const guid = crypto.randomUUID();
Remove duplicate strings from arrayunique-strings.js
const uniqueStrings = [...new Set(['a', 'b', 'a'])]
How to parse current URLurl.js
// https://ui.dev/get-current-url-javascript/?comments=false
const {
host, hostname, href, origin, pathname, port, protocol, search
} = window.location
host // "ui.dev"
hostname // "ui"
href // "https://ui.dev/get-current-url-javascript/?comments=false"
origin // "https://ui.dev"
pathname // "/get-current-url-javascript/""
port // ""
protocol // "https:"
search // "?comments=false"Create a unique filename in case of duplicatesunique-filename.ts
/**
* Sets unique file name to avoid duplicates or overrides
* @param originalName Full filename of the original to duplicate from
* @param existingNames Full filenames of all existing files
*/
static generateDuplicateFilename(originalName: string, existingNames: string[]): string {
const [originalFileName, extension] = originalName.split('.');
let editedFileName = originalFileName;
if (existingNames.some((existingName) => existingName.split('.')[0] === originalFileName)) {
let index = 1;
do {
editedFileName = `${originalFileName} (${index++})`;
} while (existingNames.some((existingName) => existingName.split('.')[0] === editedFileName));
}
return `${editedFileName}.${extension}`;
}Recommend VSCode extensions for a projectextensions.json
{
"recommendations": [
"dbaeumer.vscode-eslint",
"esbenp.prettier-vscode",
"ecmel.vscode-html-css",
"sibiraj-s.vscode-scss-formatter",
"formulahendry.auto-rename-tag",
"kamikillerto.vscode-colorize",
"deque-systems.vscode-axe-linter",
"streetsidesoftware.code-spell-checker",
"aaron-bond.better-comments",
"vincaslt.highlight-matching-tag",
"oderwat.indent-rainbow",
"christian-kohler.path-intellisense",
"YoavBls.pretty-ts-errors"
]
}
Since I always forget the new deep copy methoddeep-copy.js
structuredClone(object);
Open HTML snippet in a new tabopen-html.js
const windowUrl = URL.createObjectURL(new Blob([htmlString], { type: 'text/html' }));
const openedWindow = window.open(windowUrl);
openedWindow.document.close();Global state manager for your sitemailbox.service.ts
import { BehaviorSubject } from 'rxjs';
/**
* Stores global states
*/
export class MailboxService {
/** Stores state of whether page is loading */
isPageLoading = new BehaviorSubject<boolean>(false);
/** Listen to page loading state changes */
isPageLoading$ = this.isPageLoading.asObservable();
}Style your scrollbarscrollbar.css
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-thumb {
border-radius: 5px;
background-color: #c0c0c0;
}Change highlight colorhighlight.css
::selection {
background: #fce38a;
}Adds NES cursor to your website.nes.css
.nes * {
cursor: url(https://raw.githubusercontent.com/nostalgic-css/NES.css/develop/assets/cursor.png), auto !important;
}
.nes a,
.nes button {
cursor: url(https://raw.githubusercontent.com/nostalgic-css/NES.css/develop/assets/cursor-click.png), pointer !important;
}