Логіка сітки на ReactJS

Э недопрацьований плагін для After Effects:https://drive.google.com/drive/u/0/folders/1Nq9a672OK6ep9Com1lqelUhZxbx3_3f1 це, якщо я правильно розумію, CEP-плагін (Adobe Extension) для After Effects. Це HTML/JavaScript-панель через Adobe CSXS, яка взаємодіє з After Effects через ExtendScript. На меті було автоматизувати процес створення відео в "maze challenge" стилі, референс на ютубіGOALRUSH-f8x або аналог. Відео ручного монтажу: https://drive.google.com/file/d/1Ylzvax6w2JGDwaBqeCdbD49jh5wB5buY/view?usp=sharing Файл одного з проекту: https://drive.google.com/file/d/15vKd1L9VfHtDqK2wtLQdYEmDpH1d8Jvy/view?usp=sharing Окрім "багованості" системи через вайбкодинг (тому вайбкодери мимо), не влаштовували накприлад такі деталі (реальні правки): https://docs.google.com/spreadsheets/d/18Svc6GoQ34PgLe1HY7gNX5tPLH0Cpv9E4mfjCRBCMFU/edit?gid=0#gid=0 Треба зробити систему яка буде генерувати проекти в After Effects зі всіма необхідними компонентами відео які написані в База.pdf, більш детальна логіка у вигляді фото, тектсового документу, та mind map для розуміння всіх можливих варіацій на диску: https://drive.google.com/drive/folders/1Uf4Pnw3SKmwpmhL7sjPZFnfAbN0arUjr?usp=sharing Ще більш детально (з більш поглибленою описовою частиною, та силками на таймкоди в референсах) тз буде фікусуватись в робочій області проекта Кінцевий результат це система яка створює відео: від 40 секунд до 1 хвилини, повністю унікальний контент кожне створення, без метаданих ШІ в фійлі відео, в ньому повинен бути зрозумілий сюжет (ловушки, тупіки, різні емоції песронажів-знаменитостей в результаті якихось сюжетних поворотів в відео), саунд дизайн під сюжет (крики та інші емоції, вибухи і тд), стилістично не відрізнялись від відео референса з каналу

Є діючий production-сайт з каталогом товарів, картками моделей та інформаційними сторінками. Стек frontend: — Next.js; — React; — TypeScript; — існуюча компонентна система; — staging та production середовища. Є погоджене візуальне напрямок і дизайн нової головної сторінки. Необхідно впровадити його в існуючий проект, адаптувати під desktop/tablet/mobile та привести всі основні типи сторінок сайту до єдиної оновленої стилістики. Повний редизайн продукту та зміна бізнес-логіки не потрібні. ОБОВ'ЯЗКОВИЙ SCOPE 1. Нова головна сторінка — реалізувати головну сторінку за наданим дизайном; — зберегти існуючу функціональність, посилання та маршрутизацію; — коректно підключити погоджені секції та CTA; — використовувати існуючі дані та API; — передбачити коректне відображення динамічного контенту. Основні типи секцій: — header/navigation; — hero; — інформаційні блоки; — картки моделей/пропозицій; — аналітичні або market insight блоки; — CTA-секції; — footer. Точний склад секцій буде надано обраному виконавцю разом з макетом. 2. Responsive Необхідно реалізувати: — desktop; — tablet; — mobile; — проміжні роздільні здатності; — коректну поведінку сіток, карток, меню, кнопок та типографіки; — відсутність горизонтального скролу та візуальних конфліктів. 3. Типографіка та загальні стилі — впровадити нові погоджені шрифти; — привести розміри, ваги, line-height та інтервали до єдиної системи; — оновити стилі кнопок, карток, полів, бейджів та заголовків; — за можливості використовувати загальні design tokens або CSS variables; — не дублювати стилі окремо для кожної сторінки без необхідності. 4. Уніфікація існуючих сторінок Перевірити та привести до нової стилістики основні типи сторінок: — каталог; — картка моделі / PDP; — інформаційні сторінки; — header; — footer; — форми; — модальні вікна; — існуючі CTA; — loading / empty / error states, якщо вони вже присутні в проекті. Йдеться про візуальну уніфікацію існуючих компонентів, а не про повний індивідуальний редизайн кожної сторінки. 5. Каталог Перевірити: — сітку карток; — зображення; — назву, reference та ціну; — фільтри та сортування; — кнопки та посилання; — desktop/mobile відображення; — loading та empty states; — відсутність візуальних зсувів під час завантаження. 6. PDP Перевірити: — галерею; — основний інформаційний блок; — ціну та CTA; — аналітичні секції; — таблиці та метрики; — About Watch; — desktop/mobile компоновку; — довгі назви, references та відсутні дані. Необхідно зберегти поточну функціональність та існуючі контракти API. 7. Header та Footer — єдина стилістика на всіх сторінках; — responsive navigation; — mobile menu; — коректні active/hover/focus states; — відсутність розбіжностей між головною, каталогом та PDP. 8. Стану інтерфейсу Для динамічних блоків перевірити: — loading; — empty data; — API error; — insufficient data; — відсутнє зображення; — відсутня ціна; — довгий текст; — мобільне відображення. Не потрібно розробляти нову складну бізнес-логіку. Необхідно коректно візуалізувати вже існуючі стани. 9. Якість та продуктивність — не погіршити SEO та поточну індексацію; — зберегти коректні metadata та semantic HTML; — не створювати критичних layout shifts; — оптимізувати зображення та шрифти; — враховувати reduced motion для анімацій; — перевірити базову доступність: focus states, contrast, keyboard navigation; — не підключати важкі бібліотеки без обґрунтованої необхідності. 10. Staging та QA — розгорнути зміни на staging; — перевірити основні типи сторінок; — перевірити desktop, tablet та mobile; — усунути візуальні та responsive-баги; — після приймання виконати production deployment; — забезпечити виправлення багів за реалізованим scope не менше 7 календарних днів після викладки. РЕЗУЛЬТАТ РОБОТИ — Pull Request з frontend-кодом; — реалізована нова головна; — responsive desktop/tablet/mobile; — єдині шрифти, картки та базові UI-компоненти; — візуально погоджені каталог, PDP та інформаційні сторінки; — staging deployment; — виправлення знайдених візуальних помилок; — production deployment; — короткий опис змінених компонентів; — 7-денний bug-fix period після приймання. КРИТЕРІЇ ПРИЙМАННЯ 1. Головна відповідає наданому дизайну. 2. Усі секції коректно працюють на desktop, tablet та mobile. 3. Header та footer єдині на всіх сторінках. 4. Каталог та PDP візуально відповідають новій системі. 5. Поточна функціональність сайту не порушена. 6. API-контракти та backend-логіка не змінені без погодження. 7. Немає горизонтального скролу та критичних layout shifts. 8. Шрифти та зображення завантажуються коректно. 9. Loading, empty та error states відображаються без поломки layout. 10. Зміни перевірені на staging та розгорнуті в production. 11. Виправлені візуальні помилки, виявлені під час приймання в рамках погодженого scope. ЩО НЕ ПОТРІБНО — розробка backend; — зміна бізнес-логіки; — створення нового каталогу або CMS; — розробка нового API; — повний редизайн кожної інформаційної сторінки; — нові користувацькі функції, відсутні в макетах; — розробка складної дизайн-системи з нуля; — створення нового проекту замість доопрацювання існуючого; — зміна SEO-структури без окремого погодження. ВИМОГИ ДО ВИКОНАВЦЯ — впевнений Next.js / React / TypeScript; — досвід роботи з існуючими production-проектами; — якісна responsive-верстка; — досвід впровадження дизайну з Figma; — компонентний підхід; — впевнена робота з CSS / CSS Modules / Tailwind або існуючою системою проекту; — розуміння Core Web Vitals; — Git / Pull Request workflow; — вміння працювати через staging. В ОТКЛИКУ ОБОВ'ЯЗКОВО ВКАЗАТИ 1. Фіксована ціна за повний обов'язковий scope. 2. Термін виконання в робочих днях. 3. Оцінку в годинах. 4. Коли готові почати. 5. Посилання на 2–3 релевантних проекти на Next.js/React. 6. Чи є досвід роботи з каталогами, картками товарів або аналітичними інтерфейсами. 7. Що знадобиться для точної оцінки до початку роботи. 8. Входять чи в ціну: — staging; — responsive QA; — production deployment; — виправлення багів; — 7-денний bug-fix period. Шаблонні відповіді без перегляду вимог і без конкретної оцінки розглядатися не будуть. Доступ до production на першому етапі не надається. Робота починається після обмеженого code review і розгортається через staging.

Є діюча production-платформа з каталогом та автоматичним оновленням зовнішніх пропозицій і цін. Стек: — Node.js / TypeScript; — PostgreSQL; — існуючий сервіс оновлення цін і cron; — окремий готовий Python-модуль валідації та вибору пропозицій; — staging і production. Необхідно точково доопрацювати існуючий pipeline оновлення цін без повного переписування backend. ОБОВ'ЯЗКОВИЙ СКОП 1. Інтеграція Python-модуля — Python-модуль залишається окремим компонентом; — повертає структурований результат: offers, selected offer, statuses та risk flags; — Node.js валідує результат і виконує запис у БД; — передбачити обробку помилок і partial/failed runs; — legacy pipeline не відключається до завершення QA. 2. Запуск оновлення за списком Додати запуск: — по одному slug/id; — по переданому списку slug/id. Допустимо CLI або існуючий службовий API. Новий користувацький інтерфейс не потрібен. 3. Shadow Mode Нові результати повинні записуватися окремо і не впливати на production до QA. Потрібні shadow-поля: — price; — selected offer ID; — direct URL; — offer status; — risk/QA flags; — checkedAt; — engineVersion. 4. Розширення існуючої таблиці offers Додати: — source; — external_offer_id; — last_seen_at; — last_checked_at; — engine_version; — risk flags або зберігання в існуючому JSON; — unique constraint для захисту від дублів. Нову паралельну систему пропозицій створювати не потрібно, якщо існуючу таблицю можна безпечно розширити. 5. UPSERT, STALE і транзакція БД Замінити поточну схему DELETE → CREATE: — UPSERT існуючих і нових пропозицій; — відсутні в повному успішному snapshot пропозиції переводяться в STALE; — при API error, partial result або незавершеному snapshot активні пропозиції не повинні ставати STALE; — оновлення пропозицій, metadata вибраної пропозиції та shadow fields по одній моделі виконується всередині однієї транзакції БД; — при помилці виконується повний rollback. 6. Canonical-safe refresh Оновлення цін не повинно змінювати: — brand; — reference; — model; — collection; — name/title; — slug; — descriptions; — images; — SEO fields. Оновлюються тільки offer, price і shadow data. 7. Збереження поточної cron-логіки Зберегти: — existing cron; — rolling batches; — cooldown; — перевірку PRICE_REFRESH_MIN_DAYS до виклику зовнішнього API; — legacy production pipeline до завершення Shadow QA. 8. Audit output Достатньо одного варіанту: — shadow-колонки в існуючій admin table; або — CSV export. Мінімальні дані: — model/reference; — production price; — shadow price; — delta; — production/shadow URL; — status; — risk flags; — checkedAt; — engineVersion. Новий складний dashboard не потрібен. 9. Staging і QA — DB migrations; — staging deployment; — smoke test на 5 переданих моделях; — потім Shadow Mode приблизно на 50 моделях; — виправлення технічних помилок, виявлених під час цих прогонів; — коротка документація контракту Python → Node.js та rollback procedure. ОПЦІОНАЛЬНО ОЦІНИТИ ОКРЕМО Простий технічний promotion без нового UI: — promotion однієї моделі по slug; — promotion списку slug; — перенесення підтверджених shadow values в production; — технічна перевірка після rollout. РЕЗУЛЬТАТ — Pull Request; — DB migrations; — робоча інтеграція Python → Node.js; — Shadow Mode; — UPSERT, STALE і транзакційне оновлення; — запуск по slug/id; — staging deployment; — smoke-test results; — коротка документація; — не менше 7 днів виправлення багів по реалізованому scope після приймання. В ОТКЛИКУ УКАЗАТИ 1. Фіксована ціна за обов'язковий scope. 2. Окрему вартість механізму promotion. 3. Термін. 4. Оцінку годин. 5. Коли готові почати. 6. Досвід з PostgreSQL transactions, migrations та ingestion pipelines. 7. Які питання потрібно уточнити до початку. 8. Включені чи staging, QA, migrations та період виправлення помилок. Шаблонні відповіді без конкретної оцінки розглядатися не будуть. Доступ до production на першому етапі не надається. Робота починається з обмеженого code review та staging.

Доброго дня , 1) оновити jQuery** до актуальної версії (3.x) з підключенням jQuery Migrate 2) Ретельно протестувати функціональність додатку 3) і усунути можливі помилки, щоб скрипти всі були сумісні між собою за версіями тут потрібно повністю переписати https://filtry.in.ua/assets/libs/libs.js під нову версію jquery, так як там і бутстрап старий і багато функцій кастомних прописано

Опис: Необхідно створити JavaScript-скрипт для розширення Tampermonkey. Скрипт працюватиме у внутрішній робочій CRM-системі.Логіка роботи: Скрипт має зчитувати унікальний текстовий ID поточного активного діалогу на сторінці (всього є 5–10 різних ID). Залежно від ID, скрипт бере відповідну текстову інструкцію (System Prompt) з налаштувань. Мапу параметрів по ID потрібно винести в окреме зручне вікно налаштувань скрипта. При появі нового повідомлення у вікні чату, скрипт відправляє цей текст разом із промптом через API OpenAI (модель gpt-4o-mini). Отриману відповідь скрипт вставляє в поле введення тексту та ініціює відправку з рандомною затримкою в 20–45 секунд для імітації природної роботи оператора.Робота суто з текстом. Бюджет — 6000 грн. Чекаю на пропозиції від розробників із досвідом роботи з OpenAI API та написанням скриптів автоматизації браузера.