По завершению курса учебная платформа SkillBox предоставила техническое задание по которому необходимо было сверстать макет "Blanchard".
DEMO: Banchard
- Чистая, адаптивная, семантическая верcтка
- Пиксель перфект
- Кросбраузерность
- Кросплатформенность
- Технология БЭМ
- Минимум медиазапросов для реализации адаптива
- Функционал:
- Слайдеры
- Плавный скролл по якорям
- Табы
- Аккордеон
- Отправка заявки на почту
- и так далее...
- Удобный юзабилити для пользователя; все кнопки и ссылки явно дают понять, что на них можно кликнуть (имеют ховер-эффект) и курсор-лапку, также отменён outline, но заменён на всех кликабельных элементах на псевдокласс :focus.
- Флексбокс-вёрстка, без использования фреймворков.
- Теги HTML- и CSS-документов должны быть валидными
- Swiper Slider
- Owl Carusel
- LightBox Chocolate
- jQuery
- SimpleBar
- Tippy
- Choices
- JustValidation
При выполнении дипломного проекта приходилось каждый раз выкручиваться, так как во многих местах требовались знания JS так или иначе. Приходилось много гуглить, собирать куски кода. Спустя год изучив JS понимаю, что все это можно было реализовать без сторонних плагинов.
Спустя год после выполнения данного дипломного проекта я изучил JS, React, Sass, WebPack и множество различных технологий для программирования и весртки. Это мой первый серьезный и объемный проект. Вопрос рефакторинга стоит, имеется желание вовсе переделать все с нуля, но скорее всего больших изменений не предвидится.
По итогу защитил дипломную работу на платформе SkillBox, принимали 3 преподавателя. Было указано на некоторые недочеты, но в целом работа вызвала всеобщее одобрение. На тот момент я старался выполнить работу максимально педантично, в результате это очень повысило уровень качества веб верстки. После данного проекта я исполнял множество различных работ менее объемных. Уровень верстки с тех пор вырос, но основной упор был сделан на программирование (JS/React/TypeScript)