Павел Корнилов

например: https://ru.wikipedia.org/wiki/URI?foo=bar#title
[схема: https] :// [источник: ru.wikipedia.org] [путь: /wiki/URI] [запрос: ?foo=bar] [фрагмент: #title]

// файл index.php

// Маршруты
// [маршрут => функция которая будет вызвана]
$routes = [
    // срабатывает при вызове корня или /index.php
    '/' => 'hello',
    // срабатывает при вызове /about или /index.php/about
    '/about' => 'about',
    // динамические страницы
    '/page' => 'page'
];

// возвращает путь запроса
// вырезает index.php из пути
function getRequestPath() {
    $path = parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH);

    return '/' . ltrim(str_replace('index.php', '', $path), '/');
}

// наш роутер, в который передаются маршруты и запрашиваемый путь
// возвращает функцию если маршшрут совпал с путем
// иначе возвращает функцию notFound
function getMethod(array $routes, $path) {
    // перебор всех маршрутов
    foreach ($routes as $route => $method) {
        // если маршрут сопадает с путем, возвращаем функцию
        if ($path === $route) {
            return $method;
        }
    }

    return 'notFound';
}

// функция для корня
function hello() {
    return 'Hello, world!';
}

// функция для страницы "/about"
function about() {
    return 'About us.';
}

// чуть более сложный пример
// функция отобразит страницу только если
// в запросе приходит id и этот id равен
// 33 или 54
// [/page?id=33]
function page() {

    $pages = [
        33 => 'Сага о хомячках',
        54 => 'Мыши в тумане'
    ];

    if (isset($_GET['id']) && isset($pages[$_GET['id']])) {
        return $pages[$_GET['id']];
    }

    return notFound();
}

// метод, который отдает заголовок и содержание для маршрутов,
// которые не существуют
function notFound() {
    header("HTTP/1.0 404 Not Found");

    return 'Нет такой страницы';
}


// Роутер
// получаем путь запроса
$path = getRequestPath();
// получаем функцию обработчик
$method = getMethod($routes, $path);
// отдаем данные клиенту
echo $method();

index.php
about.php
contact.php
...

function elemInViewport(elem,full) {
    var box = elem.getBoundingClientRect();
    var top = box.top;
    var left = box.left;
    var bottom = box.bottom;
    var right  = box.right;
    var width = document.documentElement.clientWidth;
    var height = document.documentElement.clientHeight;
    var maxWidth = 0;
    var maxHeight = 0;
    if(full) { maxWidth = right - left; maxHeight = bottom - top};
    return Math.min(height,bottom)- Math.max(0,top) >= maxHeight && Math.min(width,right)- Math.max(0,left)>= maxWidth
}

function scrollReveal() {
      var revealPoint = 150;
      var revealElement = document.querySelectorAll(".scrollReveal");
      for (var i = 0; i < revealElement.length; i++) {
        var windowHeight = window.innerHeight;
        var revealTop = revealElement[i].getBoundingClientRect().top;
        if (revealTop < windowHeight - revealPoint) {
          revealElement[i].classList.add("animated");
        }
      }
    }

    window.addEventListener("scroll", scrollReveal);
    scrollReveal();

function scrollReveal() {
      var revealPoint = 150;
      var revealElement = document.querySelectorAll(".scrollReveal");
      for (var i = 0; i < revealElement.length; i++) {
        var windowHeight = window.innerHeight;
        var revealTop = revealElement[i].getBoundingClientRect().top;
        if (revealTop < windowHeight - revealPoint) {
          revealElement[i].classList.add("animated");
          window.removeEventListener('scroll', scrollReveal)
        }
      }
    }

    window.addEventListener("scroll", scrollReveal);
    scrollReveal();

request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

for (const key of utm) {
    params.delete(key);
}

const href = 'https://example.com/?user=John&some_key=1&id=3';
const url = new URL(href);
const availableKeys = ['user', 'id'];
for (const key of [...url.searchParams.keys()]) {
    if (!availableKeys.includes(key)) {
        url.searchParams.delete(key);
    }
}
console.log(url.toString()); // 'https://example.com/?user=John&id=3'

<input id="example-2" type="text"><label for="example-2">Пример 2</label>

let data = new FormData();


data.append('file', input.files[0]);

const options = {
  method: 'POST',
  body: data	
}

const response = await fetch('url', options);
const res = await response.json();
console.log(res);