logo

Ирина Дружинина

Портфолио

+79167595432

Немного о себе

Мои учебные проекты

Карта с объявлениями

Проект Keksobooking - сервис размещения объявлений

  • Проект написан в ходе успешного прохождения интенcива «JavaScript. Профессиональная разработка веб-интерфейсов»
  • Использованы только HTML5, CSS3 и JavaScript ES6.
  • Присутствует валидация форм и фильтрация данных.
  • Встроен картографический сервис Leaflet.
  • Работа с сетью (протокол HTTP, формат данных JSON, Fetch API)
  • Все файлы JS представляют собой ES-модули.

Посмотреть код

Изображения стран и предлагаемых туров по Европе

Лендинг Путешествие по Европе от HTML Academy

  • Проект написан в ходе успешного прохождения стажировки по профессии «Фронтенд-разработчик»
  • Использованы только HTML5, препроцессор Sass и JavaScript ES6.
  • БЭМ методология. Семантическая и валидная верстка. Адаптивная и резиновая верстка.
  • Desktop first. Проект выполнен в мобильной, планшетной и Desktop версиях
  • При помощи JavaScript оживлены модальные окна, мобильное меню "Гамбургер". Якорные ссылки и переключение табов. Скролл, свайп, валидность полей, LocalStorage.
  • Работа с графикой и её оптимизация (адаптивная, векторная, растровая, "нежная" ретинизация, формат WebP)
  • Оптимизация шрифтов
  • Сборка Gulp

Посмотреть код

Pink

Адаптивный проект Cat Energy от HTML Academy

  • Проект написан в ходе успешного прохождения интенcива «HTML и CSS. Адаптивная вёрстка и автоматизация»
  • Использованы только HTML5, препроцессор Sass и JavaScript.
  • БЭМ методология. Семантическая и валидная верстка. Адаптивная и резиновая верстка.
  • Mobile first. Проект выполнен в мобильной, планшетной и Desktop версиях
  • JavaScript, как нестрогий инструмент в проекте. При помощи шаблонов JS ES5 оживлены мобильное меню "Гамбургер" и слайдер "Упитанный/похудевший кот".
  • Работа с графикой и её оптимизация (адаптивная, векторная, растровая, "нежная" ретинизация, формат WebP)
  • Выравнивание в PixelPerfect по макету из Figma
  • Оптимизация шрифтов
  • Сборка Gulp

Посмотреть код

Sedona

Статичный проект Nerds от HTML Academy

  • Проект написан в ходе успешного прохождения интенcива «HTML и CSS. Профессиональная вёрстка сайтов»
  • Использованы только HTML5 и CSS3.
  • Семантическая и валидная верстка.
  • Позиционирование элементов.
  • Проверка на переполнение контентом.
  • Табуляция и корректный код для скринридера
  • Минификация кода
  • Выравнивание в PixelPerfect по макету из Figma

Посмотреть код

Дипломы былых побед

Ключевые навыки