31 todo list на JS часть 2, preventDefault, trim, Date.now, map

В этом уроке мы продолжаем создавать наш практический проект *Todo List на JavaScript* — приложение для создания списка дел. В предыдущем уроке мы познакомились с **Git и GitHub**, создали репозиторий и загрузили туда наши учебные проекты. А также подготовили HTML и CSS для Todo List. Теперь наконец переходим к JavaScript и начинаем оживлять наше приложение. 🚀 Что мы изучим в этом уроке: как найти HTML-элементы из JavaScript; как работать с формой и событием `submit`; почему обработчик события лучше устанавливать на форму, а не только на кнопку; как работает стандартное поведение браузера; как отменить стандартное поведение с помощью `preventDefault()`; как получать значение из `input`; как использовать `trim()` для проверки введенного текста; как хранить список дел в массиве; как создавать объект Todo; что такое `Date.now()` и для чего он может использоваться; как добавлять новые элементы в массив с помощью `push()`; как отрисовывать список дел через JavaScript; как использовать `map()` для создания HTML; как преобразовать массив в строку с помощью `join()`; как изменять содержимое элемента через `innerHTML`; как очищать поле ввода после добавления дела; как возвращать фокус на `input` с помощью `focus()`; что такое функция инициализации приложения и зачем нужна `init()`. Практика В результате у нас уже будет работать основная часть Todo List: *вводим дело → нажимаем Enter или кнопку → создается Todo → добавляется в массив → список перерисовывается.* На этом уроке мы пока не будем реализовывать весь функционал Todo List, чтобы не перегружать занятие. Домашнее задание Попробуйте самостоятельно: убрать `empty-state`, когда в списке появляется хотя бы один Todo; реализовать изменение счетчика количества дел. Если сразу не получится — ничего страшного. На следующем занятии мы разберем это вместе. Материал можно скачать по ссылки https://github.com/niskadevla/js-course/tree/main/31_todolist_part_2_preventDefault Продолжаем изучать JavaScript **просто, понятно и с нуля**! 🚀 Если урок был полезен — поддержите видео лайком 👍 и подписывайтесь на канал, чтобы не пропустить следующие уроки.