Проект "Mesto"

Страница представляет собой персональный профиль, куда можно добавлять фотографии из посещённых вами мест. Инстаграм на минималках, да :)

Что использовалось при написании. Технологии и подходы

• HTML и CSS - куда ж без них (теперь знаю, что можно целиком на JS).
• Grid CSS и Flexbox CSS - два товарища, первый для построения сеток, второй — для ручного мелкого позиционирования.
• JS - о, да, наконец-то! Чистый как слеза младенца, без фреймворков и библиотек. На нём здесь реализовано открытие/закрытия попапа редактирования профиля, добавления карточек, предпросмотра изображений, также сами формы, одна из которых меняет описание профиля, а другая принимает данные создаваемой карточки.
• ООП - парадигма, на которую переписано всё вообще.
• Webpack - великий и ужасный. Пришлось повозиться, но теперь он меня не пугает.

Что уже работает

• Уже упомянутые попапы. Было как минимум интересно. Эх, сладкий медовый месяц знакомства с языком :) Памагити
• Закрывающие крестики и кнопки "Создать" и "Сохранить" в формах.
• Предпросмотр изображения по клику на карточку.
• Лайк на карточке.
• Кнопка удаления карточек.
• Закрытие попапов по нажатию на Esc.
• Закрытие попапов по клику мимо самого попапа, т.е. на тонированный оверлей под модальным окном.
• Валидация форм в попапах. По большому счёту была с нуля написана готовая библиотека валидации на чистом JS, сопроводить документацией, бери да пользуйся :) Пришлось повозиться, но всё очень интересно.
• Генерация карточек из класса, а не из солянки функций. То же с валидацией, которая переписана в отдельный класс и применяется к открытой форме с переданным конфигом.

UPD: 9 спринт Проделана большая работа, Mesto вырывается наружу!

• Карточки загружаются с сервера, а не из папки с картинками.
• Иконка удаления карточки появляется только на собственноручно добавленных карточках, а при нажатии открывается попап, ожидающий подтверждения операции.
• Счётчик лайков работает и не обнуляется после перезагрузки страницы.
• Можно обновить фотографию профиля. Аватар теперь кликабельный, вызывает попап ожидающий ввода ссылки на картинку.

Что в планах (и непременно появится)

• Добавление/удаление карточек с фотографиями через форму и редактирование их описания. Сделано!
• Возможность поставить лайк фотографии или убрать поставленный. Сделано!
• Возможность изменить фото профиля. Сделано!
• Валидация форм. Сделано!
• Счётчик лайков. Сделано!
• Серверная часть. Чтобы вносимые изменения не исчезали при обновлении страницы. Сделано!
• Переписать проект на React. Сделано! В соседнем репозитории :)

Опционально

• Переключатель цветовой темы