mletov

Google -> js masonry gallery

Делать за вас никто не будет. Если бы у вас были хоть какие-то знания, но возникла бы сложность в чем-то конкретном - вам бы помогли, а так, похоже, вам будет проще купить лабу или препода.

Но для очистки совести вот вам ссылки:

Примеры с fetch. Метод POST вам пригодится.

https://www.freecodecamp.org/news/javascript-post-...
https://reqbin.com/code/javascript/wzp2hxwh/javasc...

Вставка в базу через PHP
https://www.w3schools.com/php/php_mysql_insert.asp

На самом деле, делать через JS не обязательно, можно и через action.
Количество форм на это не влияет.
https://www.geeksforgeeks.org/how-to-insert-form-d...

https://stackoverflow.com/questions/2705583/how-to...

https://github.com/anseki/readline-sync/issues/54

https://learn.javascript.ru/event-bubbling

И на button лучше type="button" прописать, т к там значение по умолчанию "submit".
Если обернуто в form, то будет форму сабмитить.

А зачем js и тем более jquery?
Чем чистый css плох?

Например
https://codepen.io/Knovour/pen/boJNPN

В большинстве случаев - резонно.

Для маленьких проектов - jquery + плагины.
Для средних - всякие UI фреймворки, типа DevExtreme.

Заметил, что разрабатывать типовые компоненты с нуля начинают на проектах, начиная с определенного уровня масштаба и крутости: Яндекс, Сбербанк, Skyeng. Когда проект очень популярен и разработчики, с одной стороны, хотят минимально зависеть от сторонних плагинов и либ. А с другой, будет весьма несолидно, если на Яндексе вдруг выскочит типовой fancybox или bx-slider ))

google -> js react cascading dropdown from json

Какие есть альтернативы?

Для мелких задач - чистый JS, для крупных - React, Angular, Vue

В зависимости от ситуации, добавьте проверку типа

if (!$('#type option:selected').get(0)) return;

или

if ($('#type option:selected').get(0))
{
  //... ваш код
}

В общем, есть форма, в ней когда меняешь INPUT отправляется запрос Ajax, но возвращается он только когда я сделаю так сказать focusout

Быть такого не может. Если уж ajax запрос запустился, то ответ возвращается когда сервер его возвратит, никаких других событий он не ждет. Значит, вы его вызываете не по тому событию.

Возможно, вам нужно повесить запуск ajax на другое событие
Почитайте про
https://api.jquery.com/keyup/
https://api.jquery.com/keypress/