izhubrov / todo-list

Todo list :page_with_curl:

Проект: Список дел

Данный проект представляет собой одностраничный сайт.

• Страница сайта расположена по адресу: https://izhubrov.github.io/todo-list/.

Требования

Требования к верстке

• Основным требованием при верстке сайта являлось его корректное отображение на различных разрешениях экрана с возможность добавления, удаления новых дел, редактирования, копирования существующих дел.

Требования к разработке на языке JavaScript

• Должна быть реализована возможность добавления, удаления новых дел, редактирования, копирования существующих дел.
• Должна быть реализована живая валидация поля ввода дела с помощью встроенного API JavaScript.

Применяемые технологии

Применяемые технологии верстки

• Флекс-бокс верстка.
• Грид таблицы.
• Выразительные семантические теги (section, ul, footer).
• Относительные пути к файлам.
• Методология наименования классов CSS БЭМ Nested.
• Относительные размеры блоков.
• Оптимизация шрифтов (сглаживание, подгонка размера текста, рендеринг).
• Метатег корректного масштабирования страницы (@media).
• Подключение локального шрифта Inter через директиву @font-face.

Применяемые технологии программирования на языке JavaScript

• Выбор элементов в Document Object Model (DOM) дереве (метод querySelector).
• Функции создания, копирования, удаления, редактирования дела.
• Функции проверки на валидность полей ввода Popup.
• Добавление в DOM-дерево дел через шаблоны template.
• Отмена стандартной обработки событий браузера методом события preventDefault();
• Метод addEventListener для ослеживания событий "submit" для корректной отправки формы и события "click".

---

Итог

Сайт получился отзывчивым (резиновым и адаптивным), корректно отображается на устройствах с разрешением от 320px и есть возможность изменять данные сайта с проверкой на валидность.