Разработка приложения "Список задач" на JavaScript с нуля. Часть №1 (базовый курс)

✍️Курс: Создание веб-приложения "Список задач" на чистом JS с нуля до результата.

Что разрабатываем: в данном видео пишем на чистом JS логику приложения для списка задач. В курсе делаю акцент на работу с данными и на понимание программирования на JavaScript, в видео не показана вёрстка и стилизация проекта, упор конкретно на JS и программирование.

Рекомендую изучать новичкам, которые умеют верстать простые сайты, осознают базовую логику работы HTML и CSS, но имеют трудности с JS.

📹Тайм-коды к видеокурсу:
00:00 - содержание курса, план занятия
01:56 - написание кода для работы c UI
02:09 - обзор файловой структуры проекта
03:04 - разбор HTML-файла
04:32 - разбор файла стилей CSS
05:26 - как я стилизовал компонент-аккордеон
08:23 - начало разработки приложения на JS
09:11 - создание переменных для работы c интерфейсом
13:40 - создание массивов задач
14:46 - обработка клика по кнопке "создать задачу"
19:25 - создание кнопки "выполнить задачу"
26:11 - реализация удаления задачи "deleteTask"
27:45 - реализация функции "сделать задачу важной"
31:28 - обработка клика по кнопке "очистить всё"
33:00 - обработка клика по клавише Enter
35:43 - модификация метода doneTask и реализация добавления задачи в список "выполненные"
38:35 - начало работы с данными, рефакторинг метода создания задачи
41:45 - доработка метода deleteTask
43:47 - реализации логики работы с данными в doneTask
49:43 - разработка логики работы данных в методе makeImportantTask
51:45 - доработка метода clearBtn
52:20 - вариация дебага приложения
53:39 - работа с localStorage
55:51 - реализация метода DOMContentLoaded
59:42 - рефакторинг
1:00:36 - дебаг
1:02:43 - доработка метода DOMContentLoaded
01:03:35 - доработка clearBtn
01:04:02 - создание функционала сортировки задач
01:06:03 - дебаг star-important
01:10:10 - глобальный рефакторинг кода и функций
01:15:37 - МОТИВАЦИЯ!

✏️Автор курса:
— Telegram: @IT_shopen

Готовый проект на GitHub и материалы для прохождения курса находятся в моём ТГ-канале в посте, ниже оставлю в закреплённом комментарии ссылку на него.

Благодарю за просмотр!

#javascript #frontend

Тэги:

#Андрей_Шопинский #Шопинский_frontend #Шопинский_курс_по_javascript #список_задач_javascript #создание_приложения_на_js #javascript_курсы #javascript_создание_приложения #курс_для_новичков_по_javascript #программирование_на_javascript #создание_приложения_на_чистом_js

Скачать видео