Webdev

Scroll to an element 

1
2
3
4
5
6
7

let scrollTimeInMillis = 800;
let finalElementId = 'element';
setTimeout(() => {
    document.getElementById(finalElementId)?.scrollIntoView(
        {behavior: 'smooth'} //Extra options for...smooth scrolling
    );
}, scrollTimeInMillis)

Reference: scrollIntoView MDN Docs
Safari and IE don’t support the options parameter. We can add smooth via CSS instead:

1
2
3

html {
    scroll-behavior: smooth;
}

Load important resources first 

1
2
3

<head>
  <link rel="preload" as="font" href="./assets/fonts/ShorelinesScriptBold.otf" crossorigin="anonymous">
</head>

Doc reference

Date/Time 

1
2
3
4
5

//Get current time in millis
new Date().getTime()

//Convert date/time details to UTC Date()
new Date(Date.UTC(year, zeroIndexedMonth, day, hour, min, secs));

SQL

Most of this is tested with Postgres, used in Supabase

Metadata/Table modifications

View all schemas 

1
2

select schema_name
from information_schema.schemata;

View all constraints of a table 

1
2
3
4
5

select connamespace, conname, c.relname as child_table, p.relname as parent_table, confdeltype 
from pg_constraint 
join pg_class c on c.oid=conrelid 
join pg_class p on p.oid=confrelid
where c.relname='excerpt_tag';

Create table 

1
2
3
4
5
6
7
8
9

CREATE TABLE bookmark_tag (
  inserted_at timestamp with time zone DEFAULT timezone('utc'::text, now()) NOT NULL,
  updated_at timestamp with time zone DEFAULT timezone('utc'::text, now()) NOT NULL,
  bookmark_id int,
  tag_id int,
  CONSTRAINT bookmark_fk FOREIGN KEY (bookmark_id) REFERENCES bookmark(id),
  CONSTRAINT tag_fk FOREIGN KEY (tag_id) REFERENCES tag(id),
  CONSTRAINT bookmark_tag_pk PRIMARY KEY (bookmark_id,tag_id)
);

Add new column to existing table 

1
2

ALTER TABLE bookmark
ADD COLUMN isRead boolean default false;

Add RLS for a table 

1

ALTER VIEW excerpt_with_tags OWNER TO authenticated;

Update FK constraint 

1
2
3
4
5
6

ALTER TABLE "excerpt_tag"
DROP CONSTRAINT "excerpt_tag_tag_id_fkey",
ADD CONSTRAINT "excerpt_tag_tag_id_fkey"
  FOREIGN KEY ("tag_id")
  REFERENCES "tag"(id)
  ON DELETE CASCADE;

Views

Create new view 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

create or replace view excerpt_with_tags as
    select
        distinct excerpt.id,
        excerpt.excerpt,
        excerpt.description,
        excerpt.source,
        (SELECT ARRAY(
          SELECT excerpt_tag.tag_id 
          FROM excerpt_tag 
          WHERE excerpt_tag.excerpt_id = excerpt.id)
        as tags)
    from excerpt
    inner join excerpt_tag on excerpt_tag.excerpt_id = excerpt.id

Drop view 

1

drop view excerpt_with_tags

Get view definition 

1

SELECT pg_get_viewdef('tag_details');

Git

History

Reset timestamp of last commit 

1

git commit --amend --reset-author

Get first commit in a repo 

1

git rev-list --max-parents=0 HEAD

Get commit logs in reverse(from the first commit) 

1

git log --reverse

Bash

Bash starter pack

Add custom commands to your bash terminal. Eg: running gs instead of git status.
The .bashrc file is a config file for your bash terminal, you can edit it to add stuff.
Windows: Open bash.bashrc found in C:\Program Files\Git\etc. For Linux, cd ~ to go to home dir and then nano .bashrc to edit the bashrc file.
Add this snippet to the end:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

#User defined text starts
echo 'Ahh shit, here we go again.' #Your own welcome message

#Typing "rp" command runs this
function rp() {
    #Switch to your repos folder
    cd 'D:\Repos'
}

#short command aliases
function gs() {
    git status
}

#Create a dir and cd into it automatically
function xmkdir () {
        mkdir -p -- "$1" &&
        cd -P -- "$1"
}

#cd into a folder and immediately list all files inside
function xcd () {
    cd "$@" && ls
}

#Automatically add all changes, commit and then push. Check your changes properly before using this.
#Command format: acp "your commit message"
function acp() {
    if [ -z "$1" ]; then
        printf "%s\n" "Please provide a commit message.";
    else
        #Git add takes some time. If commit is run immediately after add, it fails. 
        #So sleep for 3 secs by default to give add time to complete.
        #If there's a locked file you might have to run the same command a couple of times, just up arrow and enter
        git add -A & sleep 3 & git commit -m "$1" & git push
        echo "$1"
    fi
}

Download a file 

1

wget <url>

List files 

1
2

ls -1 #List files, 1 per line
ls -1 | wc -1 #List files and count lines (wc = word count)

View contents 

1
2
3
4
5

cat <file_path> #Shows complete contents
nl <file_path> #Shows contents with line numbers
less <file_path> #Shows contents a page at a time
head <file_path> #Shows first 10 lines
tail <file_path> #Shows last 10 lines

Make a file executable 

1

chmod +x <file_path>

Move files 

1

mv <src_path> <destination_path> #Can be used to rename files too

Copy files 

1

cp <src_path> <destination_path>

View image metadata 

1
2

exiftool <file_path>
identify <file_path> #ImageMagick

Split 

1
2
3

cat file.txt | cut -c 10 #Show first 10 characters of each line
cat file.txt | cut -d ',' -f 2 #Split by delimiter ',' and show the 2nd field in each line
cat file.txt | cut -d ',' -f 1-2 #Split by delimiter ',' and show fields 1 and 2 in each line

1
2
3
4

cat file.txt | grep "keywordRegex"
cat file.txt | grep -i "keywordRegex"   #Case insensitive
cat file.txt | grep "keywordRegex" -A 2  #For each match, show next 2 lines too
grep -HRi "data" *  #Search through all files (H) recursively (R)

Audio/Video

Download ffmpeg: Download link

Convert video to audio 

1
2

ffmpeg -i filename.mp4 -vn filename.mp3
# -vn skips the video stream processing. Optional, but makes it faster