Olena Boiko Quest CV
New Game — Frontend Quest

Я — Олена Бойко

Junior Frontend Developer

Створюю адаптивні вебінтерфейси за допомогою HTML5, CSS3, SCSS та JavaScript. Зараз активно вивчаю React, розширюю практичні навички та прагну розпочати кар'єру в команді, яка працює над реальними вебпроєктами.

🎮 Main quest: отримати першу позицію Junior Frontend Developer, застосовувати свої знання на реальних проєктах і професійно розвиватися в команді.
⚡ Power stack: HTML5 • CSS3 • SCSS • JavaScript (ES6+) • React (Basic) • Git • GitHub • Vite.
🤖 AI Workflow: використовую Cursor, ChatGPT та Claude для аналізу коду, рефакторингу, налагодження, пошуку рішень і створення технічної документації під час розробки.
💻 GitHub 📩 Let's Connect
HTML
JS
CSS
React
GitHub
Quest 01 — Origin Story

Мій шлях у Frontend

Я розпочала свій шлях у Frontend-розробці з вивчення HTML, CSS та JavaScript. Після завершення навчання в Lemon School створила кілька власних проєктів, серед яких адаптивні вебсайти та Chrome Extension з інтеграцією Monobank API. Зараз поглиблюю знання React, розвиваю практичні навички, працюю над новими проєктами та вдосконалюю якість коду. Моя мета — приєднатися до команди, працювати над реальними продуктами та професійно зростати як Frontend Developer.

💻 Frontend SkillsМаю практичний досвід розробки адаптивних вебінтерфейсів із використанням HTML5, CSS3, SCSS та JavaScript (ES6+), створюю семантичну та кросбраузерну верстку.
⚛️ React LearningВивчаю React, працюю з компонентами, props, state та застосовую сучасний підхід до побудови користувацьких інтерфейсів.
🤖 AI-Assisted DevelopmentВикористовую Cursor, ChatGPT та Claude для аналізу коду, пошуку рішень, рефакторингу, налагодження та створення технічної документації, що допомагає ефективніше працювати над проєктами.
🤝 Ready to ContributeШукаю можливість розпочати кар'єру Junior Frontend Developer у команді, де зможу застосовувати свої знання, розвиватися на реальних проєктах і робити внесок у створення якісних вебзастосунків.
Quest 02 — Collect Power-ups

Мої технічні навички

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

HTML5
Створюю семантичну, доступну та логічно структуровану HTML-розмітку відповідно до сучасних вебстандартів.
CSS3 / SCSS
Розробляю адаптивні інтерфейси, використовуючи Flexbox, CSS Grid, SCSS, методологію BEM і підхід Mobile First.
JavaScript (ES6+)
Реалізую інтерактивність вебзастосунків, працюю з DOM, Fetch API, REST API, Local Storage, обробкою подій та сучасним синтаксисом ES6+.
React
Вивчаю React, працюю з компонентами, props і state та створюю навчальні застосунки для розвитку практичних навичок.
Git / GitHub
Використовую Git для контролю версій, працюю з GitHub, веду репозиторії власних проєктів і публікую їх за допомогою GitHub Pages.
Quest 03 — Practice Map

Від перших проєктів до React

Мій практичний шлях у Frontend-розробці — від створення адаптивних вебсторінок до розробки інтерактивних застосунків із використанням JavaScript, Git та React.

Landing PagesПочала з розробки адаптивних лендінгів, опановуючи семантичну HTML-розмітку, структуру сторінок і сучасну верстку.
Responsive layoutСтворюю адаптивні інтерфейси, які коректно працюють на мобільних пристроях, планшетах і десктопах.
JavaScript logicРеалізую інтерактивність вебзастосунків, працюю з DOM, подіями, Fetch API, REST API та логікою взаємодії користувача з інтерфейсом.
Component ApproachВивчаю компонентний підхід у React, працюю з компонентами, props і state, створюючи навчальні застосунки.
React DevelopmentПоступово поглиблюю знання React, застосовую сучасний підхід до створення користувацьких інтерфейсів і розвиваю практичні навички.
Git WorkflowВикористовую Git для контролю версій, працюю з GitHub, веду репозиторії власних проєктів і публікую їх за допомогою GitHub Pages.
Quest 04 — GitHub Portal

Мої проєкти

Marketing Agency Website "Positivus" Адаптивний сайт для digital-агентства з сучасним інтерфейсом, секціями послуг, кейсів та закликами до дії. HTML5 • CSS3 • SCSS
Live GitHub
CrossFit Landing Page Адаптивний лендінг із версткою за макетом, сучасною структурою сторінки та оптимізованими стилями. HTML5 • CSS3
Live GitHub
Bakery Business Website Сайт сучасної пекарні з навігацією, інформацією про команду, формою заявки та адаптивною версткою. HTML5 • CSS3 • SCSS • JavaScript
Live GitHub
CloudSyns Адаптивний вебсайт хмарного сервісу зі статистикою, тарифами, блоками переваг і сучасним UI. HTML5 • CSS3 • SCSS • JavaScript
Live GitHub
Band Website "Grim ta Grim" Сайт музичного гурту з розкладом концертів, інформацією про учасників, контактною формою та Google Maps. HTML5 • CSS3 • JavaScript
Live GitHub
Chrome Extension — Currency Converter Розширення для Chrome, яке отримує актуальний курс валют через Monobank API та конвертує USD ↔ UAH. JavaScript • HTML5 • CSS3 • Monobank API • Chrome Extension API
GitHub
Contact Form (In Progress) Форма з валідацією, обробкою введених даних і сучасним користувацьким інтерфейсом. Після завершення JavaScript-версії буде реалізована також на React. HTML5 • CSS3 • JavaScript • React (planned)
GitHub
Vibe Coding Project Проєкт створений у форматі Vibe Coding з використанням Cursor та ChatGPT. Розробка здійснювалася через постановку задач AI: я описувала функціонал, інтерфейс і бажаний результат, а AI генерував та змінював код відповідно до цих вимог.
GitHub
Колесо миші / клавіші ← → або A/D