Александр КосоуровHTML-Верстальщик / Frontend-разработчик

Портфолио
pet-проектpet-проект
рекомендуюрекомендую

Planets

PUG
SCSS
TypeScript
Pet-проект направленый на работу с TypeScript
prod-проектprod-проект

Frank auto

PUG
SCSS
Vanilla JS
Сайт автодиллера
prod-проектprod-проект
рекомендуюрекомендую

Завод Точприбор

PUG
SCSS
Vanilla JS
Lottie.js
GSAP
Сайт завода испытательных приборов - Точприбор
Главная
Из интересного на этой странице - на первом экране Lottie анимация работает в связке со слайдером. Анимация подвала работает на GSAP
Референции
Весь функционал (выбор страны, региона, фильтрация точек на карте и т.д.) страницы полностью написан на чистом JS, на входе JSON с данными.
О заводе
Тут из интересного схема завода (виртуальная экскурсия) с точками, привязанными к разделам подробного описания участков.
Карта сайта
Весь сайт получился интересным, так что вот список страниц)
prod-проектprod-проект

Онлайн-гимназия Адель

PUG
SCSS
Vanilla JS
jQuery
Сайт онлайн-гимназии Адель.

Вёрстка PUG + SCSS + Vanilla JS. Отдельно проработанная под требования Рособрнадзора версия для слабовидящих.
pet-проектpet-проект

Weather

React
SCSS
fetch API
Pet-проект направленный на тренировку навыков в React.

Приложение отображает текущую погоду. Умеет определять город пользователя по геолокации. Имеет функцию поиска города вручную. Показывает температуру по Цельсию и по Фарингейту. Сохраняет информацию о пользователе в LocalStorage
prod-проектprod-проект

Vi Interiors

PUG
SCSS
Vanilla JS
GSAP
Сайт студии дизайна интерьеров. Весь построен с анимацией зависящей от скролла (GSAP).

Свёрстан с нуля под натяжку на CMS Bitrix.
prod-проектprod-проект

Херсонский аграрный университет

PUG
SCSS
Vanilla JS
jQuery
Сайт университета.

Вёрстка PUG + SCSS + Vanilla JS.

Скоро релиз

prod-проектprod-проект

SKY FISH

Pug
SCSS
Vanilla JS
GSAP
jQuery
Сайт компании добывающей продающей морепродукты.

Я пришёл в проект когда он уже был сделан процентов на 60. Всё остальное делал я. На большинстве страниц присутсвует анимация при скролле.
Страница О компании
Эту страницу и несколько других верстал и анимировал с нуля.
prod-проектprod-проект

ОСК

Pug
SCSS
Vanilla JS
jQuery
Сайт компании ОСК (Объединенная сервисная компания) занимающейся проектированием, изготовлением, монтажом, наладкой, обслуживанием и ремонтом оборудования промышленных предприятий.

Свёрстан весь сайт с нуля под Битрикс.
prod-проектprod-проект
рекомендуюрекомендую

Русский завтрак

Pug
SCSS
Vanilla JS
fetch API
Сайт проекта Русский завтрак, призванного познакомить пользователей с современной русской кухней и сделать её основой сферы гостеприимства.

Сайт работает без CMS, поэтому вся информация получается по API в виде JSON и затем отрисовывается на странице при помощи JS. Функциональная часть, включая пагинацию, фильтрацию и т.д., также реализована на фронте.
prod-проектprod-проект
рекомендуюрекомендую

Hakort

Pug
SCSS
Vanilla JS
GSAP
jQuery
Лендинг российского представаительства магазина автозапчастей.

Весь сайт построен с анимацией (GSAP) зависящей от скролла.
Перейти на сайт
сайт часто бывает недоступен, по независящим от меня причинам. В галерее есть видео, с полным скроллом.
prod-проектprod-проект
рекомендуюрекомендую

Календарь событий

HTML
CSS
Vanilla JS
Календарь событий медиахолдинга.

Весь фронт строится из JSON на чистом JavaScript. Поэтому сортировка, переключение вида и фильтры так же работают на JS. Фильтры строятся автоматически на основании параметров приходящих в JSON, что позволяет легко масштабироваться управляя данными и не копаясь в коде.
prod-проектprod-проект

Калькулятор на React

React
CSS
Chart.js
Framer
Калькулятор окупаемости газопоршневых установок.

Само приложение не большое, просто форма с валидацией, но внутренние рассчёты довольно большие. Результат помимо таблиц содержит диаграммы постороенные на базе этих таблиц.

Дополнительная сложность была в том что нужно было написать React компонент встраиваемый в конструктор Framer. Это наложило некоторые ограничения, которые пришлось обходить.

UPD: Сайт переехал с Framer на самописное решение, пришлось с React переписать проект на js, но проект всё равно интересный. Версия на React у меня осталась, могу показать по запросу.
prod-проектprod-проект

Меридиан

Pug
SCSS
Vanilla JS
GSAP
Сайт производителя промышленого оборудования.
Главная страница
Вообще сайт разрабатывался в команде, я тут делал блок отрасли и блок услуги. Использовал GSAP-анимацию и canvas. Фильтры на js самописные
Внутренние страницы
Делал не одну страницу на этом сайте. Из интересного хочу показать эту. Реализована так же с помощью GSAP.
prod-проектprod-проект

Байк центр

HTML
CSS
Vanilla JS
PHP
Интернет-магазин спортивных товаров на Битриксе. В проект я пришёл когда он уже был натянут на CMS и работал, поэтому вёрстку правил прям в PHP-шаблонах. Моей задачей была перевёрстка под новый дизайн, правки старых багов и вёрстка новых страниц.
Главная страница
Тут можно посмотреть меню которое открывается кнопкой "Каталог" - делал с нуля. большинство блоков я тоже переделывал, но они не столь интересны.
Trade-in
Это пример страницы которую полностью с нуля делал. Из интересного форма с драг-н-дропом и валидацией.
prod-проектprod-проект

Душись

HTML
SCSS
Vanilla JS
Магазин селективных ароматов.

Классическая вёрстка HTML, CSS, JS. PixelPerfect, анимация появления элементов (AOS.js).