Привіт, друзі!
Ну що, я вирішила йти цим тернистим шляхом сама😂
Починаю серію постів моєї боротьби із запуском магазину жіночого одгяу на opencart
Нагадаю хто я
Катерина, шию сукні, бренд називається SVOЯ (Сильна, вільна, особлива Я)
Ручна робота, невеликі партії, ніякого масмаркету.
ТОМУ КАТАЛОГ БУДЕ НЕВЕЛИКИЙ
Продаю через Instagram і Etsy,
Вирішила створити сайт щоб диверсифікувати канали продажу та спробувати, як сама буде працювати ця модель продажів.
Скажу чесно, налаштована скептично, але це моє упередження, бо я сама ніколи не купую через сайт, а лише через існту.
Проблема одна: я не технарка від слова зовсім. HTML, PHP (так я мала уявлення що це), але всі інші розумні слова типу twig — до недавнього це були просто якісь літери підряд 😂
До речі, чому взагалі OpenCart, а не Shopify
Я багато гуглила, спілкувалась із ШІ, бо розуміла, що opencart це дуже багато незрозумілої для мене роботи, і мозок відмовлявся туди йти.
Чому не Shopify - це, звісно, круто, все красиво, зручно, тисячі готових тем. Але коли почала копати глибше — з'ясувалось, що з прийомом оплат в Україні там усе не так просто: локальні способи оплати підключити або взагалі не можна, або треба городити купу костилів через сторонні сервіси й посередників. А мені важливо, щоб дівчатка могла просто оплатити карткою чи накладеним платежем без зайвих танців з бубном.
OpenCart, при всій своїй заплутаності для новачка, дає повний доступ до коду і можна підключити будь-яку українську платіжну систему й Нову Пошту без проблем.
І чому взагалі сама, а не замовила у студії
Чесно, думка "а може, простіше замовити" гуляла в мене в голову не раз, особливо коли сиділа над тим самим dopmenu.twig о першій ночі. Тому вирішила прицінитись, скільки б це коштувало у веб-студії.
Різниця в ціні виявилась досить різна: прості шаблонні магазини на OpenCart в Україні коштують від приблизно 500 дол. США, а нормальний магазин під ключ з індивідуальним дизайном (те, що я, по суті, і роблю) у веб-студій йде десь від 900 -1500 дол. США і вище, залежно від складності й кількості інтеграцій. Якщо додати ще SEO-пакет, мобільну адаптацію, якісь особливі інтеграції — цифра легко йде за кілька тисяч доларів. І колежанки по бізнес моделі взагалі називали мені цифри від 3000 дол.США вони вкидували в розробку сайту. Я м'яко кажучи прифігіла.
Тобто орієнтовно я зараз "економлю" щось у районі 1000 дол.США (а могло бути й більше, зважаючи на кастомний дизайн під бренд, а не готовий шаблон). Звісно, це не зовсім чесне порівняння — я плачу власним часом і нервами замість грошей, і без сумніву роблю купу помилок, яких досвідчений розробник просто б не допустив. Але для мене на старті бізнесу, коли кожна гривня йде або на тканину, або на сайт, це відчутна різниця. Плюс — я тепер сама розумію, як влаштований мій сайт, і зможу далі щось підправляти сама, не бігаючи щоразу до когось за 20 дол.США “поправити один рядочок”
Жаба дуже сильно сіла мені на шию тому я борюсь САМА
Як усе почалось (спойлер: з гугла і сліз)
Почала звичним способом - гуглила "як встановити ocStore", дивилась відео, читала форуми (і, до речі, оцей форум, писала розробникам із ким підтримую особистий зв’язок). У парі з ChatGPT власноруч поставила ocStore на хостинг. Кожен крок перепитувала в нього. Все було зрозуміло на цьому етапі, бо я і з файловими менеджерами мала справу і трохи, і знаю трохи адмінку.
Хостинг обрала, до речі, зовсім не з технічних міркувань - просто там уже був куплений домен, і хотілось, щоб усе жило в одному місці, а не розкидане по десяти вкладках.
І знаєте що? Спочатку все йшло навіть добре! Сайт відкрився, адмінка запрацювала - я вже почувалась трохи хакеркою.🤔
А потім я вирішила поставити шаблон. І ось тут почалось справжнє кіно.
Обрала платний Chameleon 1.8 від @29aleksey (дякую тобі)- виглядав гарно, гнучко, саме під той мінімалізм, який я хотіла. І буквально одразу -помилки, помилки, помилки. Я в ChatGPT, він мені гіпотезу, я перевіряю - не працює, повертаюсь, він мені нову гіпотезу, знову не працює. По колу, як білка в колесі, тільки замість горіха -робочий сайт, який усе ще не робочий.
Стало ясно: просто копіювати команди з чату і вставляти вручну - це не мій темп і точно не мій рівень терпіння.
Тут в гру вступає агент
Пішла шукати щось інше, гуглила дивилась відоси ютуб як створювати агентів, але все було або маркетолог або для створення контенту і різна інша фігня, яка мені зараз не потрібна на цьому етапі.
На цьому етапі я змінила GPT на Claude, і вже він повів мене щляхом на агента (Claude Code), який працює прямо у Visual Studio Code — не просто підказує команди в чаті, а сам лізе у файли проєкту, читає їх, править і одразу показує результат. Тобто я більше не гралась у "зіпсований телефон" з копіюванням команд та безкінечною кількістю скрінів - туди-сюди. Я просто кажу, що хочу, а воно саме йде і робить.
Головне це навчитись ставити задачі, не можу сказати, що це прям складно але треба читнути та подумати перед стартом.
Перша серйозна битва - класична, судячи з форуму, помилка Chameleon:
Could not load template
catalog/view/theme/default/template/common/dopmenu.twig
Я вже подумки попрощалась із проєктом. Виявилось, OpenCart 3 має такий собі вбудований "план Б": якщо файл не знайдено в активній темі - тихенько йде шукати в default (я не розумна, я знаю тепер такі слова завдяки ШІ😂), і якщо там теж пусто - тільки тоді показує помилку саме з шляхом до default. Тобто я марно шукала проблему в кеші й правах (почала написувати Алексею, але ж розробники пташки нічні, тому розібралась сама), а насправді модуль "додаткового меню" Chameleon просто не був встановлений окремо. Я думала, досить залити один загальний архів модифікацій, а виявилось ні.
Структура для агента та мій промт
До речі, покажу структуру, яку я використала для першого "знайомства" з агентом — можливо, комусь стане в пригоді, бо саме чіткість тут врятувала мене від хаосу. Замість "допоможи мені з сайтом" я оформила окремий файл-журнал із такими блоками:
● Мета - що саме треба зробити (одним реченням)
● Поточне середовище - версія ocStore, шаблон, хостинг, домен
● Виконані дії - список того, що я вже спробувала (щоб агент не радив те саме по кол( я скачала файл .md з розмовою з чату гпт)
● Поточна помилка - точний текст помилки, як є, без переказу своїми словами
● Уже перевірено - окремо, щоб не витрачати час на повторну перевірку
● Найімовірніші причини - мої власні здогадки (навіть якщо неправильні)
● Наступна перевірка - що я плюс планувала перевірити
● Завдання для агента - конкретно сформульоване прохання в кінці
Ти мій асистент з розробки сайту для бренду одягу SVOЯ.
**Роль:** ти сервісний інженер та розробник OpenCart з 15-річним
досвідом, оперативно вирішуєш питання з роботоздатністю сайту.
**Проєкт:** https://www.instagram.com/svoya.prostir/
**Про бізнес:**
Виробництво сучасного жіночого одягу, лімітовані колекції власного
дизайну, виключно натуральні тканини, ручна обробка, елементи
вишивки. Сфера діяльності - легка промисловість і торгівля.
Досвід під ТМ SVOЯ - 3 роки (з 2022 року). Починали вдвох, зараз
5 офіційно працевлаштованих працівників та 2 на аутсорсі.
**Технічний стек:** ocStore на базі шаблону OpenCart.
**Формат роботи:** задачі ставлю по черзі, одну за одною.
**Обов'язкова перевірка:** усі зміни перевіряй через Puppeteer
та Node.js перед тим, як звітувати про виконання.
я прописала для агента доступи до адм tools та адмінки окстор
вже в самому кінці роботи бути читати та розбиратись із безпекою та як це влаштовано, та що мені для цього потрібно
Що я зрозуміла по дорозі (шишки, набиті власним лобом)
Одна задача - один файл. Спочатку я казала агенту щось типу "зроби гарний дизайн" — і він кидався правити десяток файлів одразу і щось обов'язково ламав. Коли почала казати чітко: "працюємо тільки над header.twig, ось кольори, ось шрифти, це не чіпай" - усе стало в рази стабільніше.
Скріншот рулить. Замість пояснювати словами "щось не так з хедером" - просто кидаю скріншот. І собі для роздумів, і в чат агенту. Економить купу нервів і часу.
Дизайн - не з голови навмання. Я не дизайнерка, тому кольори й шрифти не вигадувала з нуля. Взяла все прямо з мого власного логотипу - у мене вже були готові бірки з фірмовим зеленим і тоненьким шрифтом. І сайт одразу почав виглядати "своїм", а не як випадковий набір трендів з Pinterest.
Мало товару - це не соромно. У мене всього десь 30 моделей суконь. Спочатку намагалась зробити структуру як у великих магазинів - купа категорій, підкатегорій, фільтрів по сезону, і сайт виглядав, чесно, як покинуте село. Порожньо і сумно. Виявилось, для невеликого асортименту працює навпаки: одна категорія "Сукні", великі фото, менше товару в ряд - усе виглядає цілісно й навіть багато.
Де я зараз
Хедер майже готовий: логотип, коротке меню (Сукні, Новинки, Sale), трішки фірмового зеленого в деталях. Демо-товари з коробки OpenCart (той самий MacBook і iPhone, який, підозрюю, бачив кожен, хто хоч раз встановлював цю CMS) - прибираю, бо скільки можна вже їх продавати. Далі - банер на головній, картка товару, сторінка товару, футер. І тільки в самому кінці, коли весь каркас готовий, буду заводити реальні 30 суконь, щоб не переробляти все двічі.
А ось із модулями я поки що взагалі не розбиралась свідомо. Спершу хочу довести до ладу структуру сайту й каталог: щоб усе виглядало і працювало як треба, без жодного модуля зверху. А вже коли ця база буде стояти рівно, тоді піду розбиратись, які модулі реально потрібні (доставка, оплата, ще щось корисне).
Що б я сказала собі місяць тому
Не бійся, що "нічого не розумієш у коді" - головне вміти чітко сформулювати, чого хочеш, а не боятись здатись "нетехнічною". Перевіряй базу (яка тема реально активна, чи не сипляться помилки) ДО того, як почнеш фантазувати про дизайн, інакше все ляже криво на кривий фундамент. І референси бери з реальних сайтів у своїй ніші, а не вигадуй з голови, це реально економить нерви.
Цікаво, чи є рішення простіше за моє. І взагалі, якщо в когось є поради чи запитання - welcome в коментарі, буду рада!
Коротка роудмапа для таких же новачків, як я
Щоб не загубитись у всій цій історії, зібрала для себе (і для вас) короткий чек-лист, куди дійшла на цей момент:
1. Погуглити базу : як взагалі ставиться ocStore, почитати форуми, подивитись відео. Без паніки, просто орієнтація на місцевості.
2. Купити домен + хостинг (бажано в одному місці, собі ж легше).
3. Встановити ocStore власноруч, у парі з ChatGPT ,по кроках, не соромлячись перепитувати одне й те саме кілька разів.
4. Обрати CMS свідомо, а не "бо всі так роблять" , у мене це був вибір OpenCart замість Shopify через оплату в Україні.
5. Встановити шаблон , і тут, скоріш за все, у вас теж посиплються помилки, це нормально.
6. Перейти на роботу через AI-агента, якщо чат туди-сюди вручну вже виснажує - це змінило все.
7. Зібрати візуальну базу бренду до старту дизайну: кольори з логотипу, шрифти, референси з вашої ніші.
8. Продумати структуру каталогу під РЕАЛЬНУ кількість товару, а не під те, як роблять великі магазини.
9. Верстка по блоках: хедер → банер → картка товару → сторінка товару → футер
Далі в планах: банер, картка товару, а потім модулі, у яких поки взагалі не розбираюсь. Буде цікаво, тож стежте за наступними статтями, розповім як воно піде!
https://www.svoyaprostir.com/
згодом перенесу на інший домен, якщо @29aleksey мене нах…р не пошле 😂 БО Я ЙОГО ДЕРГАЛА багато разів
Буду рада читати ваші коментарі як хороші так і гівняні, бо без них у нас ніяк😂
я чесно дуже приємно здивона та вдячна вам хлопці ❤️🙏 отримала пропозициї і в особисті і публічно про надання модулів, ви навіть не уявляєте як це круто та важливо для мене ваша підтримка буду з понеділка розбиратись із модулями всім напишу всіх відмічу чекаєте продовження історіі