Портфолио и кейсы фрилансеров в категории Сайт «под ключ»

Сайт-конфигуратор для производства подарочной упаковки. Клиент сам собирает свой вариант: 2 конструктива, 24 размера, 12 вариантов оформления. Загружает логотип — тот сразу ложится на превью коробки с учётом наклона грани, размер и положение настраиваются ползунками. Стоимость и цена за штуку пересчитываются мгновенно, тираж даёт скидку. Чистые HTML, CSS и JavaScript, без библиотек и конструкторов. Превью — SVG, логотип читается прямо в браузере, без отправки на сервер. Форма проверяет поля и собирает готовый состав заказа для менеджера. Полный адаптив.

Каталог дверей и фурнитуры: разделы со счётчиком товаров, фильтры по материалу и цене, поиск по названию и артикулу, сортировка, карточка товара с запросом наличия. Главная особенность — заказчик обновляет каталог сам. Все товары лежат в обычной таблице CSV, которая открывается в Excel: меняете цену или добавляете позицию, сохраняете файл, заливаете на сайт — каталог обновился. Разделы и фильтры собираются из этой же таблицы автоматически, программист не нужен и абонентской платы за CMS нет. Чистые HTML, CSS и JavaScript, без библиотек. Изображения товаров рисуются кодом в SVG, поэтому страница грузится мгновенно. Полный адаптив.

Разработал сайт-визитку с собственной CMS для сферы услуг (HAPPY PRAZDNIK) под ключ для мастера по оформлению праздников воздушными шарами (Самара, на рынке 10+ лет, рейтинг 5.0). Задача была не просто сверстать сайт, а дать владельцу бизнеса инструмент, которым он пользуется сам — без обращения к разработчику за каждой правкой. Что сделано: - Главная страница с УТП, ценами "от" и статистикой (рейтинг, подписчики) - Каталог работ с фильтрацией по категориям (дни рождения, корпоративы, фотозоны и другие) - Калькулятор стоимости — клиент сайта считает примерную цену в реальном времени - Раздел "Покупателю": доставка, гарантия, информация о мастере - Собственная админ-панель: владелец редактирует весь контент сайта (тексты, цены, фото, услуги) сам, без доступа к коду Стек: Node.js, Express, HTML/CSS/JS, JSON как хранилище данных. Результат: сайт работает автономно у клиента и обновляется им самим — это снижает затраты на дальнейшую поддержку и делает сайт по-настоящему "своим" для владельца бизнеса.

Проект: [Кофеня] Учебный проект с адаптивной вёрсткой. Код написан с фокусом на результат и понятную структуру, при этом есть зоны для улучшения — они указаны ниже. Реализовано Вёрстка по макету (мой макет из figma). Адаптив для мобильных и планшетов. Базовые интерактивные элементы (меню, кнопки, формы). Текущий статус и точки роста Адаптив работает, но некоторые мелкие отступы на узких экранах требуют доработки. Часть стилей можно вынести в переменные или компоненты. Планирую добавлять интерактив(JS) Технологии HTML5, CSS3, JS, Json, Flexbox.

Проект: [NR - Fitness] Учебный проект с адаптивной вёрсткой. Код написан с фокусом на результат и понятную структуру, при этом есть зоны для улучшения — они указаны ниже. Реализовано Вёрстка по макету (мой макет из figma). Адаптив для мобильных и планшетов. Базовые интерактивные элементы (меню, кнопки, формы). Текущий статус и точки роста Адаптив работает, но некоторые мелкие отступы на узких экранах требуют доработки. Часть стилей можно вынести в переменные или компоненты. Планирую добавить автоматическую проверку качества кода (linting) и тесты. Технологии HTML5, CSS3, JS, Json, Flexbox.

Проект: [Увильды - сайт о путешествиях] Учебный проект с адаптивной вёрсткой. Код написан с фокусом на результат и понятную структуру, при этом есть зоны для улучшения — они указаны ниже. Реализовано Вёрстка по макету (мой макет из figma). Адаптив для мобильных и планшетов. Базовые интерактивные элементы (меню, кнопки, формы). Текущий статус и точки роста Адаптив работает, но некоторые мелкие отступы на узких экранах требуют доработки. Часть стилей можно вынести в переменные или компоненты. Планирую добавить автоматическую проверку качества кода (linting) и тесты. Технологии HTML5, CSS3, JS, Json, Flexbox.

NIKROXL — сайт-портфолио Мой персональный сайт-визитка, где я представляю свои проекты, рассказываю о себе и принимаю заявки на разработку. 🎯 Цель проекта — Создать работающий сайт-портфолио для фриланса. — Показать навыки вёрстки, адаптивного дизайна и работы с данными. — Привлекать клиентов через личный бренд и визуально аккуратный интерфейс. 🛠️ Технологии HTML5 CSS3 JavaScript JSON Figma ✅ Реализовано Вёрстка по собственному макету в Figma Адаптив для мобильных, планшетов и десктопов Подгрузка контента через JSON Анкета для заявок на разработку Страница с блогом и модальными окнами 🔄 Планы по доработке Подключить анимации Доработать фильтрацию проектов Добавить возможность комментирования статей Автоматизировать сборку проекта

Задачи проекта Верстка макета проекта, макет в формате Figma Template Подключение плагина Gsap Scrolltriger для секции с кейсами с эффектом плавной волны Кастомизация курсора при наведении на секцию с кейсами Передача проекта заказчику

Собственный проект, веду полгода. Медиа о релокации: сайт, поисковый трафик, платный продукт. Что сделано: структура разделов и шаблоны страниц, сбор семантики и кластеризация запросов, вёрстка, мета-теги и перелинковка, контент, техническая часть — индексация, скорость, разбор каннибализации. Отдельно — приём оплаты через Робокассу и продажа платного гайда по переезду из 13 разделов. Здесь я одновременно владелец и исполнитель, поэтому смотрю на сайт не как на набор страниц, а как на источник выручки: важно не количество визитов, а сколько из них дошло до покупки. Стек: Astro, HTML/CSS/JS, headless-CMS, Робокасса, Claude Code, Chrome MCP для съёма выдачи и работы с Wordstat.

Интернет-магазин средств гигиены под собственный бренд заказчика. Сделал целиком: структура каталога, категории, карточки товаров с галереей и вариантами, корзина, избранное, страницы доставки и возврата, отдельный раздел для оптовых клиентов. Отдельная задача — админка, в которой владелец сам меняет товары, цены и тексты, без обращения ко мне за каждой правкой. Адаптив под мобильные, базовая SEO-разметка на этапе сборки, деплой на хостинг. От первого обсуждения до работающего сайта — 3 дня. Стек: Astro, HTML/CSS/JS, headless-CMS, Claude Code, Timeweb. Код открыт: github.com/Basiton/hygieia