Потрібен старший фронт-енд інженер
Обов'язки
Вести проектування архітектури та високоякісну реалізацію основних фронтенд проектів, забезпечуючи продуктивність, стабільність та підтримуваність.
Точно відтворювати дизайни Figma до пікселя, забезпечуючи виняткові деталі взаємодії та візуалізації.
Проектувати та реалізовувати масштабовану систему компонентів UI та модульної розробки для підвищення ефективності та повторного використання коду.
Розробляти та оптимізувати функції, пов'язані з Web3, забезпечуючи безпечні та стабільні взаємодії з блокчейном.
Створювати інтерактивні, високопродуктивні графіки та візуалізації даних за допомогою Canvas.
Тісно співпрацювати з менеджерами продуктів, дизайнерами та бекенд-інженерами для реалізації проектів від концепції до запуску.
Вимоги
Володіння Next.js або Nuxt.js, з практичним досвідом у великих проектах.
Знайомство з Web3.js, Ethers.js або подібними фреймворками, з досвідом у розробці DApp або фронтенд блокчейну.
Сильна експертиза в компонентізації UI та модульній розробці, з досвідом у проектуванні архітектури фронтенду.
Вміння працювати з Tailwind CSS з хорошим розумінням модульних та підтримуваних практик стилізації.
Володіння CSS та техніками макетування, здатність досягати піксельної точності реалізації з дизайнів Figma.
Володіння Canvas розробкою, здатність самостійно створювати високопродуктивні інтерактивні графіки та візуалізації даних.
Сильна обізнаність про якість коду, навички оптимізації продуктивності та досвід адаптації для різних платформ.
Бажані навички
Внески в проекти з відкритим кодом або технічні блоги.
Знайомство з Three.js, WebGL або іншими передовими технологіями візуалізації.
Досвід у складних графіках, інформаційних панелях або фінансових фронтенд проектах.
Архітектура фронтенд UI
Структура папок компонентів
Розмістіть базові компоненти UI, такі як Button, Input, Select та Dropdown, у спеціальній директорії ui/. Вони представляють найосновніші візуальні елементи програми. Компоненти, специфічні для бізнесу або складні, повинні бути розміщені в директорії components/. Ці компоненти вищого рівня створюються шляхом комбінування базових елементів UI з папки ui/ і можуть включати додаткові стилі, поведінку або бізнес-логіку. Це розділення чітко відрізняє повторно використовувані примітиви UI від реалізацій, специфічних для функцій, покращуючи організацію коду та підтримуваність.
Методологія атомарного дизайну
Прийміть методологію атомарного дизайну для структурування інтерфейсу користувача в ієрархічний та масштабований спосіб. Вона розбиває UI на п'ять рівнів гранулярності:
Атоми — це найменші будівельні блоки — базові HTML елементи або примітивні компоненти, такі як Button, Input або Icon.
Молекули формуються шляхом комбінування кількох атомів в функціональну одиницю, наприклад, SearchBar, що складається з Input та Button.
Організми — це більш складні секції UI, що складаються з молекул та/або атомів, такі як Header, Sidebar або UserCard.
Шаблони визначають макети на рівні сторінки, окреслюючи структуру та розміщення компонентів.
Сторінки — це конкретні екземпляри шаблонів, заповнені реальними даними, що представляють фактичні перегляди користувачів.
У цьому проекті директорія ui/ відповідає рівню Атомів, тоді як директорія components/ зазвичай представляє Молекули або Організми.
Дизайн-система та бібліотека компонентів
Папка ui/ слугує внутрішньою, приватною дизайн-системою або бібліотекою компонентів проекту. Вона забезпечує послідовну основу для всього розвитку UI в додатку. Стандартизуючи базові елементи, вона забезпечує візуальну узгодженість, зменшує дублювання та прискорює розробку. Усі компоненти вищого рівня створюються на основі цієї спільної бібліотеки, що сприяє повторному використанню та довгостроковій масштабованості.
Презентаційні та контейнерні компоненти
Застосовуйте розділення між презентаційними та контейнерними компонентами для підтримки чистої архітектури.
Презентаційні компоненти відповідають лише за рендеринг UI та застосування стилів. Вони отримують дані через props і мають мало або зовсім не мають внутрішньої логіки. Компоненти в папці ui/ потрапляють до цієї категорії.
Контейнерні компоненти займаються отриманням даних, управлінням станом та бізнес-логікою. Вони комбінують презентаційні компоненти для створення функціональних, багатофункціональних частин програми. Це розділення обов'язків забезпечує, що UI та логіка не пов'язані, що робить компоненти легшими для тестування, повторного використання та підтримки.
Шаблон розумних та нерозумних компонентів
Цей шаблон тісно пов'язаний з вищезгаданою концепцією.
Розумні компоненти управляють станом, взаємодіють з API або глобальними сховищами (наприклад, Redux) та використовують React Hooks для обробки логіки. Вони зазвичай пов'язані з даними та поведінкою.
Нерозумні компоненти не мають стану, є чисто візуальними елементами, які рендеряться виключно на основі props. Вони можуть бути повторно використані в різних контекстах і спрощують тестування та налагодження.
Hooks та розділення UI
Використовуйте власні React Hooks (наприклад, useForm, usePagination, useAuth) для інкапсуляції бізнес-логіки, стану та побічних ефектів. Залиште шар UI зосередженим виключно на презентації. Цей підхід дозволяє розробникам повторно використовувати логіку в різних компонентах, зберігаючи шар перегляду простим і передбачуваним.
Розробка на основі Storybook
Використовуйте Storybook для розробки, тестування та документування компонентів UI в ізоляції. Пишіть історії для кожного компонента, щоб продемонструвати різні стани, props та варіації. Це дозволяє фронтенд-розробникам створювати та налагоджувати компоненти незалежно від повного додатку. Переваги включають швидшу ітерацію, кращу співпрацю з дизайнерами, покращену документацію та підтримку візуального тестування.
Розробка на основі компонентів (CDD)
Дотримуйтесь робочого процесу, орієнтованого на компоненти, будуючи ієрархію UI знизу вгору. Почніть з атомів, комбінуйте їх у молекули, збирайте організми, а потім створюйте шаблони та сторінки. Цей метод забезпечує узгодженість, зменшує повторну роботу та узгоджує розробку з дизайн-системами, особливо при роботі з Figma або подібними інструментами.
Tailwind CSS та шаблон Headless UI
Використовуйте нестильовані, логічні бібліотеки компонентів, такі як Headless UI або Radix UI для інтерактивних елементів, таких як випадаючі списки, модальні вікна та вкладки. Застосовуйте стилізацію за допомогою Tailwind CSS, щоб зберегти повний контроль над дизайном без написання власного CSS. Цей шаблон повністю відокремлює логіку взаємодії від візуальної презентації, що дозволяє швидку, гнучку та узгоджену розробку UI, зберігаючи доступність та навігацію з клавіатури.
Резюме
Прийміть модульну, масштабовану архітектуру фронтенду на основі наступних принципів:
- Використовуйте атомарний дизайн для структурування компонентів UI за рівнем складності.
- Підтримуйте приватну бібліотеку компонентів у папці ui/ для основних елементів.
- Розділіть презентаційні та контейнерні компоненти для забезпечення чистої архітектури.
- Застосовуйте шаблон розумних та нерозумних компонентів для кращого управління логікою та UI.
- Інкапсулюйте логіку за допомогою React Hooks.
- Розробляйте компоненти UI в ізоляції за допомогою Storybook.
- Дотримуйтесь процесу розробки на основі компонентів (CDD).
- Поєднуйте бібліотеки Headless UI з Tailwind CSS для гнучкої, підтримуваної стилізації.
- За бажанням, використовуйте налаштування Monorepo для спільного використання компонентів між кількома проектами.
Цей підхід сприяє повторному використанню, узгодженості та довгостроковій підтримуваності, що робить його ідеальним для середніх та великих додатків.
-
5 днів53 230 UAH
251 5 днів53 230 UAH# Пропозиція - Старший Frontend Розробник (Web3 & Canvas)
**Привіт!**
Я Денис Грицянов, старший fullstack розробник з 15-річним досвідом та роллю Head of AI Transformation у Deloitte. Спеціалізуюсь на advanced frontend architecture та Web3 applications.
## Ідеальне Відповідність Вашим Вимогам
**Next.js & Експертиза в Архітектурі:**
… - **Enterprise-level Next.js** проекти з advanced performance optimization
- **Atomic Design implementation** - точно відповідно до Вашої архітектури UI
- **Component-driven development** з Storybook та модульними системами
- **Perfect Figma-to-code** точність - pixel-perfect реалізації
**Web3 & Розробка Блокчейн:**
- **DApp frontend development** з Web3.js та Ethers.js
- **Blockchain interactions** - безпечні та стабільні інтеграції
- **Crypto trading platforms** досвід з real-time data
- **Smart contract integration** для складної бізнес-логіки
**Canvas & Візуалізація Даних:**
- **High-performance interactive charts** з Canvas API
- **Financial dashboards** з real-time data visualization
- **Three.js expertise** для advanced 3D visualizations
- **WebGL implementations** для складної графіки
## Відповідність Технічного Стеку
**Ідеальне Відповідність Архітектури:**
- **Tailwind CSS mastery** з Headless UI компонентами
- **Atomic Design methodology** - ui/ та components/ структура
- **Smart/Dumb components** розділення
- **Custom React Hooks** для інкапсуляції бізнес-логіки
- **Performance optimization** - експертиза Core Web Vitals
**Розширені Можливості:**
- **Monorepo setup** для спільних бібліотек компонентів
- **Component testing** з Jest та React Testing Library
- **TypeScript expertise** для type-safe development
- **CI/CD pipelines** для автоматизованого тестування та розгортання
## Доведений Досвід
**Web3 Проекти:**
- **DeFi platforms** з складними торговими інтерфейсами
- **NFT marketplaces** з інтеграціями блокчейн
- **Crypto analytics dashboards** з real-time charts
**Enterprise Frontend:**
- **Scalable component systems** для великих додатків
- **Performance optimization** для high-traffic applications
- **Cross-platform compatibility** та відповідність доступності
## Додаткова Цінність
**Open Source Contributions:** Активний учасник спільнот React та Web3
**Technical Writing:** Досвід з документацією та технічними блогами
**Team Leadership:** Досвід управління frontend командами та архітектурними рішеннями
**Готовий надати pixel-perfect, high-performance Web3 frontend відповідно до Вашої advanced architecture.**
Можу почати
-
22 дні53 230 UAH
97 3 0 1 22 дні53 230 UAHПривіт!
Я побачив ваш проект, і він мені цікавий. У мене є досвід як в аутсорсингу, так і в продуктовій розробці, і я чудово працюю в команді.
🔥 Мої ключові навички:
✅ Розробка SPA та веб-додатків
✅ Оптимізація продуктивності
✅ Ведення та підтримка проектів
✅ Якісний та чистий код
… 💻 Технології: HTML, CSS, JavaScript, React, Vue, Git
Якщо вам важливе якісне та надійне рішення – готовий обговорити деталі. Можна зв'язатися тут або в зручному для вас форматі.
-
29 днів145 939 UAH
15075 32 0 1 29 днів145 939 UAHДобрий день!
Мене звати Валентин, і я представляю Arctic Web Agency. Ми - команда досвідчених веб-розробників, які спеціалізуються на створенні сучасних та ефективних веб-рішень для бізнесу.В особисті повідомлення зможу надати приклади наших схожих робіт. Готові взяти ваш проєкт до роботи!
З повагою
Arctic Web Team
Freelancehunt
-
30 днів66 537 UAH
128 30 днів66 537 UAHПривіт!
Мене зацікавив ваш проєкт — маю відповідний досвід і готовий взятися за виконання. Працюю швидко, відповідально та з увагою до деталей.
🔹 Коротко про мене: маю понад 3 роки досвіду в розробці.
Маю досвід у .NET Core, C#, ASP.NET MVC, Web API, JavaScript/CSS/HTML, React.js, Next.js, MS SQL, Git.
🔹 Готовий: почати одразу, узгодити дедлайн і бюджет, внести правки за потреби.
-
30 днів66 537 UAH
1263 8 0 30 днів66 537 UAHПривіт!
Мене зацікавив ваш проєкт — маю відповідний досвід і готова взятися за виконання. Працюю швидко, відповідально та з увагою до деталей.
🔹 Коротко про мене: маю понад 3 роки досвіду в розробці.
Маю досвід у .NET Core, C#, ASP.NET MVC, Web API, JavaScript/CSS/HTML, React.js, Next.js, MS SQL, Git.
🔹 Готова: почати одразу, узгодити дедлайн і бюджет, внести правки за потреби.
-
30 днів53 274 UAH
920 13 0 30 днів53 274 UAHДоброго дня!
Радий допомогти.
Маю великий досвід у веб та мобільній розробці.
-
14 днів53 230 UAH
304 14 днів53 230 UAHПривіт!
Мене звуть Олексій, я представляю групу розробників – NC-1.
У нашій команді є спеціаліст (full stack, senior) з необхідним для Вас досвідом і знаннями. Ставка за годину – 23 usd
Стек: PHP, Symfony, Laravel, Yii2, Codeigniter. MySQL, OOP. LAMP stack, Javascript, Unit testing, oAuth, Docker, HTML, CSS, TailWind CSS, Javasscript, Vue.js/Nuxt.js, React.js/Next.js. API development.GIT
Кейси - https://1drv.ms/b/c/b7a0d31a9dae1bc5/EeH6JPdpBbpKtrkA1zFQOIMBAmqUcd_Ptx5tt5p9hBNG-g?e=wXDGHh
Портфоліо – https://nc-one.com/case-studies
З повагою, Олексій М.
-
1 день443 583 UAH
93800 1267 1 10 1 день443 583 UAHВітаю.Є великий досвід з Next.js/Node.js.Готовий до співпраці.
-
30 днів53 230 UAH
1887 8 0 30 днів53 230 UAHМи в The Dev Company раді подати нашу заявку на позицію Архітектора Frontend/UI. Наша команда має великий досвід у проектуванні та впровадженні масштабованих, високопродуктивних фронтенд архітектур для складних Web3 додатків, включаючи інформаційні панелі на основі блокчейну, DApps та інтерактивні платформи візуалізації даних.
Ми спеціалізуємося на:
– Next.js / React з акцентом на масштабовану архітектуру компонентів, використовуючи Atomic Design, CDD та розділення презентаційних і контейнерних компонентів.
– Ідеальні реалізації Figma з майстерністю в Tailwind CSS та модульних практиках стилізації.
– Інтеграції Web3 через Ethers.js та Web3.js, включаючи безпечні з'єднання гаманців, взаємодії з блокчейном та відстеження транзакцій.
– Візуалізаціях на основі Canvas для створення інтерактивних, високопродуктивних графіків та аналітичних панелей, включаючи фінансові інтерфейси.
– Безголових шаблонах UI (Radix UI, Headless UI), поєднаних з Tailwind CSS для гнучкості та підтримуваності.
… – Розробці на основі Storybook для ізольованого створення компонентів, документації та візуального тестування.
Відповідний минулий досвід
Ми розробили дизайн для платформи DeFi, побудували повний фронтенд для проекту NFT Web-3 гри та аналітичних інструментів — завжди підкреслюючи продуктивність, модульність та безпеку. Це включає створення повторно використовуваних систем UI, оптимізацію рендерингу для великих наборів даних та забезпечення безперебійної інтеграції зі смарт-контрактами та API блокчейну.
Наш підхід
– Архітектура UI — Atomic Design + приватна бібліотека UI в ui/ для основних елементів.
– Розробка на основі компонентів — побудова від атомів до сторінок з робочими процесами Storybook.
– Продуктивність — розділення коду, ліниве завантаження, мемоізація та оптимізація Canvas.
– Безпека — безпечне оброблення взаємодій з блокчейном, валідація транзакцій та обмеження швидкості.
– Співпраця — тісна узгодженість з командами дизайну для забезпечення бездоганного відтворення специфікацій Figma.
Ми вважаємо, що наша комбінація технічної експертизи, досвіду в Web3 та найкращих практик архітектури UI ідеально відповідає вашим вимогам, і ми впевнені у своїй здатності забезпечити високоякісний, масштабований та підтримуваний фронтенд для вашої платформи.
Ми будемо раді обговорити ваш проект більш детально.
З найкращими побажаннями,
The Dev Company
-
20 днів53 230 UAH
2161 4 2 20 днів53 230 UAH👋Вітаємо!
Ми Skillwave Global LLP — команда з Великобританії, яка допомагає бізнесам запускати ефективні цифрові продукти: від сайтів та онлайн-магазинів до складних систем.
📈Ми підходимо до кожного завдання індивідуально — створюємо не просто гарний сайт, а інструмент, який працює на результат: залучає клієнтів, продає та викликає довіру.
✅Що ми пропонуємо:
• Повна веброзробка (Frontend / Backend / WordPress / CMS)
• UI/UX-дизайн у Figma з акцентом на конверсії
• Швидке завантаження, адаптивність, SEO — за замовчуванням
… • Підтримка та розвиток проєкту після запуску
💼Працюємо прозоро, офіційно та орієнтовано на результат.
Готові обговорити ваш проєкт і вже найближчими днями запропонувати концепцію!
🙌Ось наші роботи та відгуки на них, більше дізнаєтесь у презентації!
Freelancehunt
-
30 днів53 230 UAH
421 30 днів53 230 UAHПривіт, Дхе,
Я радий подати свою пропозицію на посаду старшого фронтенд-інженера в [Назва компанії]. Маючи великий досвід роботи з Next.js/Nuxt.js, Web3.js/Ethers.js та розробкою високопродуктивного інтерфейсу, я впевнений у своїй здатності керувати архітектурою фронтенду, реалізовувати дизайни з точністю до пікселя та оптимізувати взаємодію з блокчейном для ваших проектів.
Будь ласка, напишіть мені в особисті повідомлення, якщо вважаєте, що я підходжу
-
Виталий Я. Galaxy IT
Вже й сюди добрались
-
Актуальні фриланс-проєкти в категорії HTML та CSS верстання
Оновлення дизайну на сайтіПотрібно оновити дизайн існуючого сайту, використовуючи HTML, CSS, JS: освіжити зовнішній вигляд, зробити його сучасним і адаптивним під мобільні пристрої. Потрібно додати плавні анімації та інтерактивні елементи. HTML та CSS верстання, Javascript та Typescript ∙ 23 години 8 хвилин тому ∙ 77 ставок |
Шукаю WordPress/Elementor/Woo спеціаліста який має великий досвід з шаблоном Woodmart
5000 UAH
Потрібно оновити візуал та структуру інтернет-магазину стоматологічних товарів (посилання відправлю в ПП) Сайт працює на зв'язці WordPress + WooCommerce. Шаблон — Woodmart. Завдання: Оновлення шапки (header), підвалу (footer) та контенту на головній сторінці згідно з готовим… CMS, HTML та CSS верстання ∙ 1 день 2 години тому ∙ 31 ставка |
Верстка сайтуТехнічне завдання на верстку сайту. Писав чат гпт Посилання на дизайн - https://www.figma.com/file/bBuR3yG2eSzLpBcBJURNZi?node-id=60:397&t=zQ9Kln2RtyBgNHKw-1&locale=en&type=design Загальна інформація Необхідно виконати адаптивну кросбраузерну верстку сайту на основі наданого… HTML та CSS верстання ∙ 1 день 3 години тому ∙ 106 ставок |
Внесення правок та доопрацювань на сайт згідно з ТЗОпис проєкту Потрібно виконати комплекс доопрацювань сайту zvilnymo.ua відповідно до наданого технічного завдання. Основна мета робіт — підвищення конверсії сайту, покращення користувацького досвіду, оптимізація форми захоплення лідів та посилення довіри потенційних клієнтів.… HTML та CSS верстання, Веб-програмування ∙ 1 день 5 годин тому ∙ 40 ставок |
QA протестувати саит на помили щоб пропутив мерчант цент
700 UAH
QA протестувати саит на помили щоб пропутив мерчант центр саит Опен карт текст переклад помилки на сайтi карточки торава Все що можно перевiрити HTML та CSS верстання, Тестування та QA ∙ 3 дні 1 година тому ∙ 11 ставок |