Отлично!
Именно писать руками "чистый JS" без фреймворков — это очень полезный практический навык для middle-разработчика, даже если твой фокус — серверный PHP.

Поясню, как тебя будут оценивать по этому пункту:

  • ✅ Понимаешь ли ты, как работает DOM и как с ним работать нативно
  • ✅ Умеешь ли навесить обработчик событий без jQuery
  • ✅ Можешь ли сделать простой AJAX-запрос без fetch-полифиллов
  • ✅ Понимаешь ли bubbling, event.preventDefault()
  • ✅ Не боишься писать утилиты и небольшие интерактивности сам

Давай так: я тебе сначала дам памятку (мини-чеклист чистого JS), потом — практический пример на уровень middle, и ты сам попробуешь предложить решение 👍

🧩 Чеклист по чистому JS без фреймворков

Как сделать
document.querySelector(selector)
document.querySelectorAll(selector)
element.addEventListener('click', handler)
document.createElement('div')
parent.appendChild(child)
element.textContent = 'Text'
fetch(url).then(...).catch(...)
event.preventDefault()
element.value
parent.addEventListener('click', (event) => { if (event.target.matches('.btn')) { ... } })

🛠️ Практическая задача

Допустим, у тебя в приложении (например, в твоём плагине Webasyst) есть простая HTML-форма:

<form id="task-form">    <input type="text" name="title" placeholder="Task title" />    <input type="text" name="description" placeholder="Description" />    <button type="submit">Create Task</button> </form>  <div id="result"></div>

Задание:

👉 Написать чистый JS-код, который:

  • ✅ На отправку формы перехватывает событие
  • ✅ Собирает данные полей
  • ✅ Отправляет POST-запрос через fetch
  • ✅ Выводит результат ответа в #result

📌 Подсказки для размышления:

  • Как получить форму и навесить слушатель?
  • Как собрать данные формы вручную?
  • Как отправить fetch с method: 'POST'?
  • Как обработать JSON-ответ и вывести в DOM?

Попробуй сам предложить решение — я посмотрю, дам обратную связь и помогу улучшить.

Если хочешь, можем усложнить: добавить валидацию полей, обработку ошибок, или debounce. 🚀