--- author: 1 caption: "Фото: Дженніфер" date: "2017-06-12" intro: "Коли ми випустили ядро freesewing наприкінці березня, моя увага одразу ж переключилася на створення нашого фронтенду, щоб freesewing.org міг повністю замінити makemypattern.com ." title: "Ми JAMstack, ми JAMstack, ми JAMstack, ми JAMstack, ми JAMstack, ми JAMstack, ми JAMstack, ми JAMstack, ми JAMstack, ми JAMstack, і я сподіваюся, що вам теж подобається JAMstack" --- Коли ми випустили ядро freesewing наприкінці березня, моя увага одразу ж переключилася на створення нашого фронтенду, щоб [freesewing.org](/) міг повністю замінити [makemypattern.com](https://makemypattern.com/). Я вважаю, що цінність фріскейтингу полягає в основній платформі та наших патернах. Але без зручного для користувача способу показати цю цінність, її здебільшого ігноруватимуть. Тож нам потрібен був веб-сайт, який би дозволяв людям створювати патерни. Makemypattern.com — , мабуть, найкраще порівняння чогось подібного — працює на Drupal 7, а моя початкова ідея була запустити новий сайт на Drupal 8. Я пішов цим шляхом досить далеко, щоб бути впевненим, що зможу змусити його працювати і підключити його до нашого бекенду. Тоді я переключився і звернув увагу на те, що зараз називається фріскейтинговим ядром. На створення ядра пішло близько 7 місяців, і з того часу багато чого змінилося. Або, можливо, я змінився, я, безумовно, багато чому навчився на цьому шляху. Так чи інакше, я вирішив зробити все по-іншому. ## Проблема з CMS Я не маю жодних претензій до Drupal, але ідея керувати вільно поширюваним сайтом через будь-яку систему управління контентом (CMS) мене не приваблює. Однією з головних причин є те, що багато інформації зберігається під непрозорим шаром бази даних, що ускладнює управління нею. Це стосується контенту, де публікації, метадані, зображення тощо розподілені по різних таблицях, місцях і папках. Але є також тема, яка містить купу всього, є кастомні модулі Drupal для підключення до бекенду, і так далі, і так далі, і так далі. > Я хотів, щоб такий самий підхід був і на веб-сайті. За винятком того, що він не може бути статичним, тому що він повинен, знаєте, щось робити. Коли ми завершували роботу над ядром, я створив для нього сайт документації на основі [Jekyll](https://jekyllrb.com/). У порівнянні з ним це було як ковток свіжого повітря. Просто купа файлів розмітки, з додаванням SASS, зображень та JavaScript, і все це компілюється в акуратний статичний веб-сайт. Ним легко керувати, і він чудово інтегрується з робочим процесом, орієнтованим на GitHub, який буде знайомий потенційним дописувачам. Я хотів, щоб такий самий підхід був і на веб-сайті. За винятком того, що він не може бути статичним, тому що він повинен, знаєте, щось робити. ## Альтернативний підхід: JAMstack Я вперше дізнався про JAMstack, коли почав шукати хостинг для згаданого сайту з основною документацією. Спочатку він був розміщений на сторінках GitHub, який надає безкоштовний хостинг. Вони також мають SSL або власне доменне ім'я, але ви не можете мати і те, і інше. Це було свого роду розривом угоди. Шукаючи альтернативи, я натрапив на [Netlify](https://www.netlify.com/), які роблять як SSL, так і кастомні домени, і мають безкоштовний рівень для проектів з відкритим кодом (дякую, хлопці). Крім того, [це відео генерального директора Netlify Матіаса Білманна (Mathias Biilmann)](https://vimeo.com/163522126) змусило мене по-справжньому захопитися JAMstack. Якщо ви не знайомі з JAMstack, я пропоную вам подивитися відео, але суть зводиться ось до чого: - **J** = JavaScript - **A** = API - **M** = Розмітка Ідея полягає в тому, що ви створюєте статичний сайт (розмітку), який потім робите інтерактивним за допомогою JavaScript, що підключається до одного або декількох API. Тож у нашому випадку, замість того, щоб створювати простий сайт документації з легкою для редагування розміткою і складною CMS для обробки динамічних речей, давайте просто створимо один простий сайт, який буде статично згенерований, але використовуватиме JavaScript і API для виконання розумних речей. ## Біг до того, як навчишся ходити Мушу визнати, що у своєму ентузіазмі прийняти цей новий підхід я трохи забіг наперед. Раптом я вже не створював простий сайт, а по вуха занурився в ізоморфний рендеринг, маршрутизацію на стороні клієнта, React і Redux, Node.js і трансполювання ES6. > Якщо ви не знаєте, що все це означає, то можете собі уявити, яке розчарування я відчував, намагаючись приручити всіх цих нових звірів. > > Якщо ти знаєш, що все це означає, то де ти був у квітні, коли я йшов долиною Реакції смерті? Справа в тому, що я не розробник, і це було вище моїх сил. Хоча я щодня вивчала щось нове, я не досягала значного прогресу у виконанні поточних завдань і відчувала розчарування через свою нездатність робити навіть найпростіші речі. Після місяця розчарувань, безлічі спроб і, здавалося б, ще більшої кількості помилок, я кинув рушник. Не зважаючи на цей новомодний блискучий JavaScript, яким користуються всі молоді люди, я буду дотримуватися того, що я знаю. Це, по суті, основи jQuery. Іншими словами, речі, які були досить крутими 10 років тому. ## Варення, якому 10 років, все ще залишається варенням, чи не так? Отже, freesewing.org - це сайт, що працює на JAMstack. І знаєте що, здається, він робить те, що має робити. Ми використовуємо Jekyll для створення статичного сайту, і коли ми переносимо його на головну гілку, він автоматично розгортається на Netlify. > Ефект від цього новомодного блискучого JavaScript, яким користуються всі молоді люди У нас є [новий API даних](https://github.com/freesewing/data) , побудований на [фреймворку Slim](https://www.slimframework.com/). Він обробляє всі дані користувача. Такі речі, як рахунки, вимірювання, моделі та чернетки, а також коментарі на цьому веб-сайті тощо. Вона також зв'язується з ядром, і кожного разу, коли ви створюєте викрійку, ми не просто надаємо вам її, а й порівнюємо її з низкою стандартних розмірів, що дуже круто. А ще у нас є інші круті штуки, наприклад, можливість розгалужувати або переробляти вже існуючий проект. ## Це відправна точка Я сподіваюся, що користувацький досвід/інтерфейс не буде перешкодою для людей. Я доклав багато зусиль, щоб зробити процес складання максимально інтуїтивно зрозумілим, і я думаю, що в порівнянні з нашою демо-версією (або інтерфейсом makemypattern, якщо вже на те пішло) це величезне покращення. Знову ж таки, я впевнений, що речі будуть ламатися наліво чи направо, або що комусь із вас не сподобаються кольори чи ще щось. Справа в тому, що я поставив собі за мету створити щось, що може замінити makemypattern.com, щоб я міг розповісти всім вам _Гей, заходьте і пограйтеся з цією новою штукою_. Думаю, якщо не більше, то зараз я можу це зробити. І якщо ви бачите можливості для покращення, будь ласка, [приєднуйтесь до зусиль](/contribute), ми тільки починаємо. PS: Для тих, хто здивувався назві цього посту: