Відкрита до нових проєктів

Створюю сайти, які працюють — а не лише виглядають.

Платошин Марина, front-end розробниця з 4–5 роками досвіду. Адаптивні сайти, інтернет-магазини та вебзастосунки для малого бізнесу й стартапів.

Дивитись проєкти ↓ Написати мені
  • 5робочих проєктів
  • 100%адаптивна верстка
  • 1 деньвідповідаю на запит
Портрет Платошин Марини

Дизайн із сенсомі увага до деталей

Про мене

Чистий код, зрозумілий інтерфейс, вчасна здача.

Я працюю з front-end: перетворюю макети та ідеї на швидкі адаптивні сайти й застосунки, якими зручно користуватися з телефона.

Кожен проєкт нижче — не картинка, а працюючий продукт: можна клікати, фільтрувати, додавати в кошик, входити в кабінет і перевіряти це на мобільному. Код лежить на GitHub із зрозумілою інструкцією запуску.

Технології, які я реально використовую

  • HTML5
  • CSS3 · Flex / Grid
  • JavaScript (ES6+)
  • REST API
  • Адаптивний дизайн
  • localStorage
  • Git + GitHub
  • Figma

Що я можу зробити для вас

Послуги

  • Сайт-візитка та лендінг

    Кілька сторінок, навігація, форма зворотного зв’язку, швидке завантаження.

  • Інтернет-магазин (front-end)

    Каталог, фільтри, пошук, кошик і підрахунок вартості. Підключення оплати та бази — за потреби.

  • Вебзастосунок

    Кабінет, таблиці, графіки, робота з даними та зовнішніми API.

  • Верстка за макетом

    Акуратна верстка за макетом із Figma, адаптив під телефон, планшет і десктоп.

Обрані роботи

П’ять проєктів, які можна відкрити й випробувати.

Це навчальні демо-проєкти без реальних клієнтів і платежів: усі функції працюють у браузері, дані зберігаються лише у вас.

Сайт кав’ярні KAVA: темна шапка, чашка кави та меню

01 · Бізнес-сайт

KAVA — сайт кав’ярні

Проблема. Малому бізнесу потрібна візитка, яка за 10 секунд показує меню й години роботи та дозволяє забронювати столик.

  • Меню з перемиканням категорій
  • Статус «відкрито / зачинено» за поточним часом
  • Форма бронювання з валідацією полів і дат
  • Мобільне меню та адаптивна верстка
  • HTML5
  • CSS3
  • JavaScript
Живе демо ↗Код на GitHub
Як запустити

Склонуйте репозиторій і відкрийте projects/cafe/index.html у браузері. Збірка й залежності не потрібні.

Інтернет-магазин рослин «Листок»: каталог товарів із фільтрами

02 · Інтернет-магазин

Листок — магазин рослин

Проблема. Покупець має швидко знайти товар, порахувати суму з доставкою й знижкою та не втратити кошик після перезавантаження.

  • Пошук, категорії та сортування
  • Кошик: кількість, видалення, підсумок, безкоштовна доставка від 1000 ₴
  • Промокод DEMO10 (−10%)
  • Кошик зберігається в браузері; тестове оформлення
  • HTML5
  • CSS3
  • JavaScript
  • localStorage
  • SVG
Живе демо ↗Код на GitHub
Як запустити

Відкрийте projects/store/index.html. Для оформлення замовлення з оплатою потрібен backend — у демо оплата тестова.

Кабінет менеджера Orderly: показники, графік і таблиця замовлень

03 · Вебзастосунок

Orderly — кабінет менеджера

Проблема. Менеджеру потрібно бачити ключові цифри, швидко знаходити замовлення й змінювати їхній статус без Excel.

  • Вхід (демо: demo@portfolio.dev / demo1234)
  • Показники та графік виручки за 7 днів
  • Таблиця: пошук, фільтр, сортування, пагінація
  • Зміна статусів і експорт у CSV
  • HTML5
  • CSS3
  • JavaScript
  • SVG-графіки
  • localStorage
Живе демо ↗Код на GitHub
Як запустити

Відкрийте projects/dashboard/index.html і ввійдіть із підставленими демо-даними. Авторизація імітована на клієнті — реальний сервер можна підключити через REST API.

Менеджер завдань: список із пріоритетами та прогресом виконання

04 · Логіка та дані

Tasks — менеджер завдань

Проблема. Потрібен простий список справ, який не губить дані, не дозволяє додати порожнє й дає скасувати випадкове видалення.

  • Додавання, редагування, видалення, позначка «виконано»
  • Пріоритети, терміни, підсвітка прострочених
  • Фільтри, пошук, прогрес виконання
  • Валідація, скасування видалення, обробка помилок сховища
  • HTML5
  • CSS3
  • JavaScript
  • localStorage
Живе демо ↗Код на GitHub
Як запустити

Відкрийте projects/tasks/index.html. Завдання зберігаються у вашому браузері.

Застосунок погоди: поточна температура та прогноз на тиждень

05 · Інтеграція API

Погода — застосунок на REST API

Проблема. Користувач хоче за секунди дізнатися погоду в будь-якому місті — з поясненням, якщо щось пішло не так.

  • Пошук міста через публічний API Open-Meteo (без ключа)
  • Поточна погода та прогноз на 7 днів
  • Геолокація та запам’ятовування останнього місця
  • Тайм-аут, офлайн, «місто не знайдено» — зрозумілі повідомлення
  • HTML5
  • CSS3
  • JavaScript
  • REST API · fetch
  • Geolocation
Живе демо ↗Код на GitHub
Як запустити

Відкрийте projects/weather/index.html — потрібне лише інтернет-з’єднання для запитів до API.

Як я працюю

Прозоро й без сюрпризів.

  1. 01

    Бриф

    З’ясовую задачу, аудиторію й терміни. Пропоную обсяг робіт і вартість.

  2. 02

    Макет

    Погоджуємо структуру та вигляд — у Figma або на основі вашого макета.

  3. 03

    Розробка

    Роблю поетапно й показую проміжний результат за посиланням.

  4. 04

    Здача

    Перевірка на телефоні й десктопі, чистий код, інструкція та правки в межах домовленості.

Ваш наступний крок

Є ідея? Зробімо її.

mariweess246@gmail.com ↗

Розкажіть коротко, що плануєте, — відповім протягом одного робочого дня. Працюю напряму та через фріланс-платформи (Upwork, Useme).

Telegram ↗ GitHub ↗ Email ↗