Проект на JavaScript Приложение список задач ToDo



Пишем ToDo приложение на чистом JavaScript. Подробный урок для начинающих.

✅ Работа с DOM
✅ Отслеживание событий
✅ Отображение элементов на странице
✅ Работа с localStorage

Стартовый код к уроку в ТГ канале: https://t.me/+9XtDDNBdHAk4Yjhi

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Курс “Профессия HTML верстальщик”: https://webcademy.ru/htmlstart/
Старт обучения: 21 Ноября 2022 года
Обучение с наставником, 3 месяца, результат, гарантия.
Научим создавать веб-сайты и зарабатывать на этом.

💻 Курс “JS Frontend разработчик”: https://webcademy.ru/jscourse/
Старт обучения: 14 Ноября 2022 года
Обучение с наставником, 3 месяца, результат, гарантия.

🏁 Обучение с нуля
💁‍♂️ Обучение с наставником
🎯 Доведение с нуля до результата
🏢 Помощь с трудоустройством
💵 Поможем взять первый заказ на фрилансе

💳 возможна рассрочка
💳 если курс не понравится, вернём деньги в первую неделю

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Бесплатный курс “Создай свой первый сайт на HTML5 и CSS3”
7 уроков по 30 мин: http://webcademy.ru/htmlsite/
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

Тайм коды:

00:00 Обзор проекта
02:03 Старт работы над проектом
04:42 Добавление задач
17:26 Очистка поля ввода и фокус
19:07 Блок “Список дел пуст”
22:48 Рефакторинг
25:37 Удаление задач
34:21 Блок “Список дел пуст”
36:27 Отмечаем выполненные задачи
45:02 Рефакторинг
50:40 Сохранение разметки в localStorage
1:00:08 Работа с данными
1:03:15 Данные. Добавление задач
1:12:31 Данные. Удаление задач
1:22:04 Данные. Удаление задач через фильтр массива
1:27:07 Данные. Статус done
1:32:38 Данные. Блок “Список дел пуст”
1:41:38 Данные. Сохранение массива с задачами в localStorage
1:52:58 Рефакторинг. Функция renderTask
1:58:01 Публикация проекта на GitHub pages

Сайт: https://webcademy.ru/
Вконтакте: https://vk.com/webcademy
Telegram канал: https://t.me/webcademynews

Закрытый канал с исходниками: https://t.me/+9XtDDNBdHAk4Yjhi
Ссылка на макет и код с вебинара: https://t.me/c/1579074518/75

Comments are closed.