WebDev Building Blocks

My personal cheatsheet, some sort.



HTML

HTML5 Trigger

⎗
✓
1
2
3
4
5
<!DOCTYPE html>
<html>
    <head></head>
    <body></body>
</html>

UTF-8 Encoding Trigger

⎗
✓
<meta charset="UTF-8">

Favicon

⎗
✓
<link rel="icon" href="logo.png" type="image/x-icon">

Responsive Viewport

⎗
✓
<meta name="viewport" content="width=device-width, initial-scale=1.0">
⎗
✓
<a href="nya.html" target="_blank">the link</a>

Javascript

GET

⎗
✓
function findGetParameter(parameterName) {
    var result = null,
        tmp = [];
    location.search
        .substr(1)
        .split("&")
        .forEach(function (item) {
            tmp = item.split("=");
            if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
        });
    return result;
    }

Fetch

⎗
✓
async function getFetch(){
    var uri = "URI"
    const response = await fetch(uri, {method:'GET'});
    json await response.json()

    var data = new FormData()
    data.append('a','b')
    fetch(uri, {method:'POST', body:data,}).then(data => {
        data.text().then(function (result){
            console.log(result)
        })
    })
}


Loop

⎗
✓
1
2
3
4
5
6
7
8
data.forEach(iter)
function iter(value, index, array){
    //do something
}

for (i = 0; i < this.length; i++) {
    //do something
 }

DOM Manipulation

⎗
✓
1
2
3
4
5
6
7
8
var m = document.getElementById('m')
var c = document.createElement('div')
var s = document.querySelector('#s')
m.innerHTML = ""
c.classList.add('nyaa')
c.setAttribute('onclick','show()')
m.appendChild(c)
m.focus()

DOM Events

⎗
✓
m.onclick = () => { doSomething()}

Array Sort

⎗
✓
1
2
3
var tnode = []
tnode.push(something)
tnode.sort((a,b) => b.replies - a.replies)

Redirects

⎗
✓
1
2
3
4
//Pop up a new tab
window.open("t.html?", '_blank').focus();
// Simulate a mouse click:
window.location.href = "http://www.abc.com";

Local Storage

⎗
✓
1
2
3
var value = localStorage.getItem('key')
localStorage.setItem('key','value')
localStorage.removeItem('key')

Variable Declaration

⎗
✓
var hash = 0, i, chr;

Alert

⎗
✓
var pw = prompt("Input password")

RNG

⎗
✓
var uid = Math.floor(Math.random() * 100000);

JSON

⎗
✓
var c = JSON.parse(data)
var d = JSON.stringify(c)

Date Time

⎗
✓
var today = new Date();
var time = today.getHours() + ":" + today.getMinutes()

Force Scrolldown

⎗
✓
window.scrollTo(0, document.body.scrollHeight);

Try Catch

⎗
✓
1
2
3
4
5
6
7
8
9
//i
try {
    //so hard
    //and got so far 
}
catch(err){
    //but in the end
    //it doesn't even matter
}

String

⎗
✓
1
2
3
s.includes("substring")
let result = text.replace("a", "b");
let result = text.replace(/blue/g, "red");

Keypress Detection

⎗
✓
1
2
3
4
5
6
domElement.addEventListener('keypress', (e) => {
    if (e.keyCode === 13) {
        e.preventDefault();
        doSomething();
    }
})

Logout Detection

⎗
✓
1
2
3
4
5
window.addEventListener('beforeunload', (event) => {
    //do something
    event.preventDefault();
    event.returnValue = '';
})

Javascript 3rd Party Library

Gun

⎗
✓
1
2
3
4
5
6
gun = Gun(['gunserver1uri', 'gunserver2uri']);
copy = gun.get('key1').get('key2')
copy.on((data) => {
    console.log(data)
})
copy.put(null)
Edit

Pub: 12 Aug 2022 03:20 UTC

Edit: 14 Aug 2022 13:20 UTC

Views: 337