Skip to content

Instantly share code, notes, and snippets.

<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width"/>
</head>
<body style="height: 300vh">
<svg style="position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);"
width="655" height="209" viewBox="0 0 655 209" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M653 207V62C653 28.8629 626.228 2 593.091 2C519.318 2 391.639 2 292.675 2C270.583 2 252.717 19.9124 252.717 42.0038C252.717 63.5378 252.717 81.7221 252.717 81.7221C252.717 81.7221 252.717 81.7221 252.717 81.7221V167C252.717 189.091 234.808 207 212.717 207H2"
stroke="#EAECF0" stroke-width="4" stroke-linecap="round"/>
@mikowl
mikowl / oneliners.js
Last active March 28, 2024 20:52
👑 Awesome one-liners you might find useful while coding.
// Inspired by https://twitter.com/coderitual/status/1112297299307384833 and https://tapajyoti-bose.medium.com/7-killer-one-liners-in-javascript-33db6798f5bf
// Remove any duplicates from an array of primitives.
const unique = [...new Set(arr)]
// Sleep in async functions. Use: await sleep(2000).
const sleep = (ms) => (new Promise(resolve => setTimeout(resolve, ms)));
// or
const sleep = util.promisify(setTimeout);
@mikowl
mikowl / myaliases.plugin.zsh
Last active March 24, 2024 02:11
My bash/zsh aliases
# My aliases
# Easier navigation
alias ..="cd .."
alias ...="cd ../.."
alias ....="cd ../../.."
alias .....="cd ../../../.."
# ls stuff, most are set in lib/directories.zsh
# I use lsd (https://github.com/Peltoche/lsd) for certain listings
@mikowl
mikowl / nord-vimium.css
Created July 5, 2019 19:07
Nord Vimium Theme
/* Nord Vomnibar CSS */
/* Installation: Open Vimium Options -> Click "Show Advanced Options" and paste this into the CSS for Vimium UI text area. */
#vomnibar ol, #vomnibar ul {
list-style: none;
display: none;
}
#vomnibar {
background: rgba(46, 52, 68, 0.9);

Frameworks like React require that when you change the contents of an array or object you change it's reference. Or push another way that you don't change arrays but instead create new arrays with updated values (i.e. immutability).

There are older array methods that are incompatible with immutability because they alter the array in place and don't cghange the array reference. These are destructive methods.

Shown below are replacements for the array destructive methods (e.g. push, pop, splice, sort, etc.) that will create new array references with the updated data.

Solutions are provided using the spread operator and also the newer "change array by copy" methods (toSpliced, toSorted, toReversed and with).

Setting Value At Index

@mikowl
mikowl / keybindings.json
Last active December 13, 2022 19:05
vscode keybindings
// mikowls mostly vimish vscode keybindings
[
{
"key": "cmd+n",
"command": "workbench.action.files.newUntitledFile"
},
{
"key": "cmd+k cmd+t",
"command": "workbench.action.selectTheme"
},
@mikowl
mikowl / clean.sh
Created November 15, 2022 19:22 — forked from Iman/clean.sh
Free up disk space on Ubuntu - clean log, cache, archive packages/apt archives, orphaned packages, old kernel and remove the trash
#!/bin/sh
#Check the Drive Space Used by Cached Files
du -sh /var/cache/apt/archives
#Clean all the log file
#for logs in `find /var/log -type f`; do > $logs; done
logs=`find /var/log -type f`
for i in $logs
@mikowl
mikowl / settings.json
Last active September 5, 2022 20:16
vscode config
{
"workbench.colorCustomizations": {
// "editorGroupHeader.tabsBorder": "#303340",
"tab.activeBorder": "#c692ea",
// "editorLineNumber.foreground": "#525a86",
// "statusBar.background": "#011627",
// "statusBar.noFolderBackground": "#011627",
// "statusBar.debuggingBackground": "#011627",
// "statusBar.foreground": "#d6deeb",
// "statusBar.debuggingForeground": "#d6deeb"
{
"colors": {
// An extra border around active elements to separate them from others for greater contrast.
"contrastActiveBorder": "",
// An extra border around elements to separate them from others for greater contrast.
"contrastBorder": "",
//Overall border color for focused elements. This color is only used if not overridden by a component.
"focusBorder": "",
//Overall foreground color. This color is only used if not overridden by a component.
@mikowl
mikowl / auto-animate.tsx
Created August 4, 2022 22:38 — forked from hwkr/auto-animate.tsx
Auto Animate Component
import { ElementType, HTMLAttributes } from "react";
import { useAutoAnimate } from "@formkit/auto-animate/react";
interface Props extends HTMLAttributes<HTMLElement> {
as?: ElementType;
}
export const AutoAnimate: React.FC<Props> = ({
as: Tag = "div",
children,