Frontend Development Task – Business & E-Commerce Website (Directus CMS)
18 034 UAHBuild the first iteration (7 pages) of a responsive business website whose content will be managed in Directus CMS. All front-end work is to be done with Vue 3 (Vite) and Tailwind CSS and must reproduce the supplied Figma design pixel-perfect.
Technical Requirements & Stack:
Framework: Vue.js (Vue 3 with Composition API is strongly preferred).
CSS Framework: Tailwind CSS. You must be proficient in using a utility-first approach to match the design.
CMS Integration: All dynamic content (product data, text, images, etc.) must be fetched from our Directus Headless CMS via its REST or GraphQL API.
State Management: Use a modern state management library like Pinia for managing global state (e.g., shopping cart, user authentication).
Routing: Vue Router for handling navigation between pages.
Build Tool: Vite is preferred for its speed and modern architecture.
Nice to Have (but highly valued):
Experience with Nuxt.js for Server-Side Rendering (SSR) or Static Site Generation (SSG) to improve SEO and performance.
Experience with testing frameworks like Vitest for unit tests and Cypress or Playwright for end-to-end tests.
Direct experience with Directus.
Quality Standards & Deliverables (Crucial):
Pixel-Perfect Implementation: The final output must be a visually exact match of the provided Figma design across all specified breakpoints. Mobile and desktop designs are included in the Figma file.
Extreme Responsiveness: The application must be fully responsive and adapt flawlessly from super-small screens (~320px) to super-large screens (2K/4K monitors). Layouts should not break, and usability must be maintained at all sizes.
Clean & Maintainable Code:
Code must be well-structured into logical, reusable Vue components.
Code must be well-commented, especially for complex logic, API integrations, and state management.
Follow best practices for Vue.js and modern JavaScript (ES6+).
Rigorous Testing: The developer is responsible for thorough testing to ensure the application is bug-free and works as expected. This includes:
Cross-Browser Compatibility: Latest versions of Chrome, Firefox, Safari, and Edge.
Cross-Device/OS Compatibility: Windows, macOS, iOS (iPhone/iPad), and Android.
Functional Testing: All interactive elements (buttons, forms, filters, cart logic) must work perfectly.
Performance: The website must be optimized for fast load times (optimized images, code splitting, efficient API calls).
Deliverables:
Access to a Git repository (e.g., GitHub, GitLab) with the complete frontend codebase.
A running version of the application deployed to a staging environment (e.g., Netlify, Vercel) for review.
-
8 днів24 732 UAH8 днів24 732 UAH
Привіт,
Я розробник Full-Stack, готовий створити ваш 7-сторінковий сайт з Vue 3 та Tailwind CSS.
Я спеціалізуюся на створенні піксель-ідеальних, адаптивних інтерфейсів з дизайнів Figma. Маю глибокий досвід у Tailwind CSS та інтеграції платформ безголових CMS, таких як Directus, через REST/GraphQL API.
Хоча моя основна рамка — React, моя компетентність у сучасній компонентній архітектурі (подібно до Composition API у Vue) та управлінні станом робить мене дуже ефективним у цьому стеку. Мій досвід з Next.js безпосередньо переноситься у середовище Nuxt.js, яке ви цінуєте.
Я прагну надавати чистий, добре задокументований та ретельно протестований код, що відповідає вашим високим стандартам якості. Можете переглянути моє портфоліо на www.revazgoguadze.com. Я впевнений, що зможу перевищити ваші очікування.
-
10 днів21 641 UAH10 днів21 641 UAH
Привіт,
Я фронтенд-розробник з досвідом у адаптивній верстці та точному HTML/CSS/JS.
Я уважно прочитав ваше завдання і можу реалізувати ваш дизайн точно так, як він наданий у Figma, з чистим кодом, анімаціями та повною адаптивністю.
Я працюю без фреймворків (тільки HTML, SCSS і ванільний JS), тому ваш стек мені ідеально підходить.
Буду радий почати роботу над цим проектом і можу показати вам першу частину макету дуже скоро.
З нетерпінням чекаю вашої відповіді.
… З найкращими побажаннями,
Олександр М.
-
5 днів18 034 UAH5 днів18 034 UAH
Ми готові розробити ваш ідеальний у піксель, повністю адаптивний сайт на Vue 3 + Tailwind з інтеграцією Directus, чистим компонентним кодом та повним розгортанням на staging — саме так, як зазначено.
-
1 день18 034 UAH
11616 44 0 1 день18 034 UAHВітаю, маю досвід на Vue.js та роботи з Nuxt.js. Варто більш детально обговорити проєкт в особистих. Буду радий Вам допомгти!
-
1 день18 034 UAH
319 1 день18 034 UAHНаша команда спеціалізується на веб-розробці та цифровому маркетингу повного циклу. Ми надаємо комплексні послуги з розробки та просування онлайн-рішень:
💻 Розробка вебсайтів і додатків:
Верстка сайтів на HTML / CSS / PHP
Розробка на фреймворку Laravel
Створення сайтів на WordPress (індивідуальні рішення, інтеграції)
… Розробка мобільних застосунків для iOS та Android
📈 Інтернет-маркетинг та просування:
Налаштування реклами у Google Ads, Facebook, TikTok
Seo та копірайтинг
Просування через push-сповіщення та in-app рекламу
Маркетингова аналітика, A/B тестування, оптимізація кампаній
🎨 Дизайн-рішення:
Власний відділ дизайну
UI/UX-дизайн, брендинг, рекламні креативи
Ми маємо весь цикл реалізації — від розробки до залучення аудиторії.
Будемо раді обговорити співпрацю або підготувати для вас індивідуальну пропозицію.
З повагою,
-
4 дні18 034 UAH
1117 4 0 4 дні18 034 UAHПривіт!
Я створюю додатки на Vue 3 з Tailwind, які гарно інтегруються з платформами headless CMS, і мені подобається робити дизайн настільки живим на екрані, наскільки він є у Figma.
Для цього проекту я б зробив компоненти максимально модульними та структурованими з самого початку, щоб згодом було легше розширювати їх за межі цих 7 сторінок. Також я додав би шар попереднього перегляду, який витягує чернетки контенту з Directus, щоб ви могли бачити редагування перед публікацією.
Під час розробки я тестую все на реальних малих і великих екранах, щоб виявити дрібні зміщення макету на ранніх стадіях. Мені дуже важливі плавні переходи між точками перелому та баланс контенту на всіх пристроях.
Ви можете переглянути два мої фронтенд-проекти тут:
- https://elsione.com
- https://zolochivlis.kyiv.ua.
… Дякую!
-
5 днів18 034 UAH
99 5 днів18 034 UAHПривіт, я працюю з Vue та Tailwind щодня і дуже переймаюся тим, як сайт відчувається на кожному екрані, а не лише як він виглядає. Я ретельно переглянув Figma і вже бачу, як я розділю кожен розділ на чисті компоненти, зберігаючи чіткість макету на всіх розмірах. Щоб полегшити оновлення контенту в довгостроковій перспективі, я пропоную формувати поля CMS безпосередньо навколо того, як дихає дизайн, а не просто копіювати текстові блоки, а думати про простір, масштаби зображень і дрібні варіації, які можуть змінюватися залежно від продукту. Також я запущу збірку в реальному часі на Vercel з першого дня, щоб ви могли бачити зміни по мірі їх виникнення і виявляти будь-які проблеми раніше. Якщо це звучить як хороший шлях, я з радістю розпочну.
-
10 днів18 034 UAH
875 9 2 10 днів18 034 UAHПривіт, я маю досвід роботи з Nuxt. Готовий працювати
------------------------------------------------------------------
-
10 днів18 034 UAH
713 11 2 10 днів18 034 UAHВітаю, я з радістю допоможу вам з вашим проектом. Маю понад 4 роки досвіду роботи з Vue 3.
Ми можемо використовувати Nuxt, оскільки він має відмінну інтеграцію з Directus CMS. Для бібліотеки UI я рекомендую Shadcn.
Напишіть мені в особисті повідомлення, щоб обговорити деталі.
-
8 днів18 034 UAH
318 11 1 2 8 днів18 034 UAHПривіт 👋
Проєкт повністю вивчив — стек, логіка, вимоги та рівень деталізації мені близькі. Працюємо на Vue 3 + Vite + Tailwind CSS, CMS — Directus, Figma-референс зрозумілий, адаптив під усі екрани зроблю піксель у піксель, без перекосів. Інтеграція по REST або GraphQL, стан — через Pinia, маршрутизація — Vue Router. Код структурую у переиспользовувані компоненти, прокоментований і чистий, як і очікується.
Зроблю чисто, швидко, з фокусом на респонсивність, швидкість, тести та стабільність. Можу зібрати staging на Vercel, залити в GitHub, плюс можу підтянути Nuxt SSR, якщо це посилить проєкт. Приклади коду та схожих збірок — за запитом. Готовий включатися, технічно все зрозуміло, відрисую точно, як у дизайні.
-
1 день18 034 UAH
93973 1266 1 10 1 день18 034 UAHПривіт. Я працював з Nuxt. я готовий співпрацювати
Актуальні фриланс-проєкти в категорії HTML та CSS верстання
Доопрацювання сайту Bropack на WordPress (виправлення верстки, налаштування форм та SEO)Опис завдання:Шукаємо досвідченого WordPress-розробника/верстальника для оперативного завершення проекту https://bropack.com.ua/. Сайт вже сверстан і посажений на WordPress, але у зв'язку зі зривом термінів попереднім виконавцем, необхідно закрити технічну частину, налаштувати… HTML та CSS верстання, PHP ∙ 11 годин 32 хвилини тому ∙ 24 ставки |
Інтернет-магазину одягуПотрібен розробник для інтернет-магазину одягу Шукаю досвідченого розробника для створення повноцінного інтернет-магазину одягу з дроп-моделлю продажу. Що потрібно зробити: 6 сторінок: головна, товар, кошик, оформлення, акаунт, адмін панель Вхід через Google акаунт Кошик і… HTML та CSS верстання, Javascript та Typescript ∙ 1 день 7 годин тому ∙ 81 ставка |
Комплексне доопрацювання WooCommerce-магазину (UX, адаптивність, функціонал)Потрібно завершити розробку інтернет-магазину на WordPress (WooCommerce). Поточний сайт: https://lerise.com.ua/ Референс по рівню функціоналу та зручності користування: https://katysoho.com.ua/Важливо Кардинально змінювати дизайн сайту не потрібно. Основний акцент - на… CMS, HTML та CSS верстання ∙ 3 дні 1 година тому ∙ 38 ставок |
Сайт для весільних фотографів під ключ: дизайн + текст + запускШукаємо спеціаліста (або студію) для створення сайту-портфоліо під ключ - повний цикл від концепції до публікації. Хочемо мінімум участі з нашого боку: ви берете завдання і доводите до готового результату. Що входить у роботу «під ключ»: • Дизайн у стилі premium / editorial /… HTML та CSS верстання, Дизайн сайтів ∙ 3 дні 7 годин тому ∙ 114 ставок |
Шукаємо веб-дизайнера / верстальника на WordPress (конструктор Divi)https://annalecat.com/corporate-training/ Що треба зробити:У нас є одна сторінка на сайті, яка зараз виглядає погано. Треба переробити її дизайн і заверстати так, щоб вона виглядала красиво, сучасно та акуратно. Що ми вже маємо для роботи: Текст: Повністю готовий і розбитий… HTML та CSS верстання, Дизайн сайтів ∙ 5 днів 4 години тому ∙ 37 ставок |
Рига