Перейти к основному содержимому
аватарка с фото автора

Привет! Меня зовут Валера
и это мое портфолио

Я занимаюсь фронтендом и образованием. Верстаю веб-интерфейсы, преподаю верстку и создаю образовательные проекты. Помогаю студентам преодолевать трудности в обучении. Работаю автором курсов, лектором, наставником. Провожу консультации.
Моя цель: улучшать качество веба. Планирую создать свое образовательное учреждение для веб-разработчиков. Кроме того меня интересует всё, что касается дизайна, организации и планирования работы.

Мои проекты

Подборка ссылок по фронтенду

Подборка ссылок
  • Подборка качественных и актуальных материалов
  • Поддерживаю и обновляю с 2018 года
  • UI/UX фичи

Путь Фронтендера

frontend roadmap
  • Roadmap по фронтенду
  • Аналог roadmap.sh на русском
  • Ссылки на качественные источники
  • Дополняет мой курс и подборку ссылок

База знаний Web Dev Tips

Веб компонент шапки
  • Сделал, чтобы поделиться знаниями и опытом
  • Перевод на английский
  • Создано на Jekyll, своя тема
  • Улучшенный поиск по сайту

Курс "Создание и верстка веб-сайтов (HTML, CSS, JS)"

Курс HTML, CSS

Список анимируемых CSS свойств

Список анимируемых CSS свойств
  • Сделал на замену удаленного с MDN
  • Сборка на Node.js
  • Работа с открытым API от W3C
  • Сборка статики через Github Actions
  • Автообновление раз в день, чтобы не нагружать api

Опыт работы

Свои pet проекты и консультация

Веб компонент шапки
  • Провожу частные консультации
  • Веду канал на ютьюбе по веб-разработке
  • Поддерживаю и обновляю свои проекты (Подборка ссылок по фронтенду, Роадмап Фронтендера, База Знаний и другие)
  • CSS Userstyles

Университет Иннополис

Работа в Иннополисе

Преподаватель (2022)

Обязанности: проведение ранее подготовленного курса.

Проведение вебинара "Что может фронтендер" для привлечения новичков на курс.

Автор курса (2021-2022)

Обязанности: создание курса и конспекта курса по фронтенду для дальнейшего проведения на 120 ак. часов.

Курс оформлен и сертифицирован по требованиям У2035.

Разработал и провел техническое собеседование кандидатов в наставники.

Федеральный проект "Содействие занятости"

Работа в Содействие занятости

Автор курса (2022)

Обязанности: создание курса и материалов курса по фронтенду для дальнейшего проведения на 120 ак. часов.

TeachMeSkills

Работа в TeachMeSkills

Преподаватель (2022)

Обязанности: проведение части курса по фронтенду.

Инвольта Образование

Работа в Инвольте

Автор курса (2021-2022)

Обязанности: создание курса и конспекта курса по фронтенду для дальнейшего проведения.

Курс оформлен и сертифицирован по гос. требованиям.

Институт прикладной автоматизации и программирования

Работа в ИПАП

Автор и преподаватель (2021)

Обязанности: создание и проведение вебинара "Что может фронтендер" для привлечения новичков на курс.

SkillFactory

Работа в SkillFactory

Ментор и лектор (2019-2021)

Обязанности: консультация студентов, создание и проведение вебинаров и лекций, проверка работ

Автор курсов (2019-2020)

Обязанности: создание модулей онлайн-курса по фронтенду

HTML Академия

Работа в HTML Академия

Наставник (2019-2021)

Обязанности: работа на базовом и продвинутом (адаптив, бэм, автоматизация) курсах по верстке, голосовая и текстовая консультация студентов, проверка домашних заданий и дипломного проекта, работа через гит

Digital Banana

Работа в SkillFactory

Автор и преподаватель курса по фронтенду (2020)

Обязанности: создание и проведение курса по фронтенду с группой старшеклассников с проверкой заданий.

Нетология

Работа в Нетологии

Лектор (2019-2021)

Проведение своей лекции "Почему важно уметь искать информацию"

Руководитель курсов (2019)

Обязанности: правки и валидация правок курса, ответ на сложные вопросы студентов, мониторнинг лекций и отзывов.

Код-ревьюер (2019)

Обязанности: проверка заданий по верстке (разные упражнения)

Яндекс Практикум

Работа в Яндекс Практикум

Код-ревьюер (2019-2020)

Обязанности: проверка заданий по верстке (макет по БЭМу)

Лектор (2019)

Обязанности: проведение своей лекции "Эволюция сеток"

Учебный центр Базис

Работа в Базис

Автор и преподаватель курса HTML/CSS (2018)

Обязанности: разработка собственного курса и проведение очных занятий с группой

Социально-экономический институт,
Центр социального развития

Работа в СЭИ

Автор и преподаватель курсов HTML/CSS, Photoshop и ПК-грамотности (2017)

Обязанности: разработка собственных курсов и проведение очных занятий с группой

Верстка

Это портфолио:)

Моё портфолио
  • Написано с нуля на HTML, CSS, JS
  • Мой дизайн
  • Адаптив на флексах и гридах
  • БЭМ
  • Поддержка, переодический рефакторинг и другие обновления

Верстка лэндинга курса

Верстка лэндинга курса

Онлайн магазин E-comm

Сайт E-comm
  • Используется на моих курсах
  • Верстка по макету с Фигмы
  • Адаптив
  • БЭМ
  • Оживление корзины и сбор данных на JS
  • Оживление слайдера на JS и стилизация нативных инпутов на CSS

Лэндинг Агентства

Лэндинг Агентства
  • Используется на моих курсах
  • Адаптив от 350 до 1250
  • Pixel Perfect на макс. ширине
  • Разные способы реализации сложного декора (бесконечный фон до края)
  • БЭМ
  • комментарии для студентов в коде

Макет Moodboard

Макет Moodboard
  • Используется на вебинаре "Что может фронтендер"
  • CSS transitions + JS

Лэндинг услуг веб-разработки

Работа в Содействие занятости

Лэндинг Хостинг-провайдера

Макет Хостинг-провайдера
  • Адаптив
  • Pixel Perfect на макс. ширине
Сайт рекламного агентства

Сайт рекламного агентства (источник вдохновения)

  • Собственный метод обтравки изображений буквами на CSS (спросите меня подробности!)
  • clip-path для подложек под текст
  • Видео фон
Сайт студии дизайна

Сайт студии дизайна (источник вдохновения)

  • Переменные для цветов
  • clip-path: polygon для формы флажков с обновлениями
  • Slide-in анимация выплывающих снизу экрана блоков на js и jquery
  • Двойное наложение на изображения filter: grayscale и цветного фона (в оригинале просто картинки)
  • Созданные в фотошопе логотип, иллюстрации и фон

Макет Nerds HTML Академии

Макет Nerds

Макет Sedona HTML Академии

Макет Sedona

Переверстка промо камеры Айфона

промо камеры Айфона

Код

Лекции и вебинары