- Будівництво - нова структура каталогів
- Бланк і LUMA: нові теми Magento 2
- Успадкування тем в інтерфейсі Magento 2
- Макет в Magento 2
- Модульність і можливість повторного використання
- Інтерфейс Magento 2 підвищує продуктивність
- Перевага: Magento 2 сприяє і вимагає професіоналізму
Минулого тижня мій колега Маттіас поділився своїми враженнями Модулі Magento 2 повідомляється як серверний розробник. Нова система магазинів також приносить певні зміни для розробників інтерфейсу. Робота з темами Magento 2 створює нові вимоги. Оскільки передбачається, що все ще будуть незначні зміни у версії 2.1, щоб згладити кілька процесів, ці зміни не повинні бути остаточними. Поточний статус:
Будівництво - нова структура каталогів
Що відразу кидається в очі, якщо ви з Magento 2 запускається, є відмінностями в структурі каталогів. Якщо шаблони та файли макета раніше виконувалися під додаток / дизайн і таблиці стилів під шкірою , всі файли тепер лежать разом в папці Magento 2 і підрозділяються відповідно до модулів . Це вимагає трохи звикнути, але це полегшення мати все в одному місці - особливо в складних магазинах, які включають велику кількість різних елементів компонування. Більш того, це є вигідним і зрозумілим для спеціально розроблених модулів.
Бланк і LUMA: нові теми Magento 2
Magento 2 поставляється з двома темами. Порожня тема, яка вже реагує і, безумовно, підходить для подальшого налаштування. Тема LUMA - чудовий приклад власної теми на основі порожнього. Основна ідея полягає у продуктивному використанні властивостей пустої теми як батьківської. Розробляючи власні теми Magento 2, варто звернути увагу на структуру LUMA. Magento також надає деякі демо-дані разом з LUMA. Наприклад, тизери для початкової сторінки або екземпляри віджетів та інші елементи вмісту, які дають гарне уявлення про можливості користувацької теми.
Успадкування тем в інтерфейсі Magento 2
Резервний принцип реалізується дещо інакше, ніж у Magento 1, але нагадує це в основній ідеї. Основою є шаблони стандартних модулів Magento. Magento 2 Blank Theme є основою стандартного магазину з усіма основними стилями. Виходячи з цього, ви можете створити будь-яку кількість реагуючих тем Magento 2. \ t Залежності між батьківськими і дочірніми темами можна легко визначити за допомогою файлу конфігурації.
Макет в Magento 2
Magento 2 також реструктурує макет. Відтепер існують два типи елементів компонування, відомі блоки та нові контейнери. Контейнери є заповнювачами для вмісту. Вони служать лише для розташування блоків і не містять самої логіки. На практиці це означає, наприклад, що ви більше не визначаєте навігацію як таку в певній області сторінки, а замість цього призначте навігацію контейнеру, який містить позиціонування і стилі.
Джерело: Magento
Макет все ще можна налаштувати за допомогою прямих втручань у шаблонах. Тим не менш, має більше сенсу налаштувати за допомогою Layout XML-файлів. Magento 2 пропонує ще більше опцій, ніж його попередник, який рідко залишає причину для перезапису шаблонів. З одного боку, це знижує ризик конфліктів і стабільності, з іншого боку, платформа електронної комерції Magento залишається модернізованою, незважаючи на значні корективи.
Модульність і можливість повторного використання
Magento явно здобуває модульність з введенням бібліотеки UI Magento . У бібліотеці Magento UI існує широкий спектр інтерфейсних елементів і функцій (наприклад, шрифти, таблиці, кнопки, рейтинги, навігація тощо). Стилізація елементів не входить до складу спеціальної теми, але більшу частину дизайну можна легко налаштувати за допомогою змінних у бібліотеці UI. Це також допомагає перезаписати основний код Magento застарілим і забезпечити можливість оновлення системи. Крім того, можливість повторного використання стилів поліпшується, якщо ви використовуєте бібліотеку за призначенням і далі розвиваєтеся з власними елементами вмісту.
Приклад різних варіантів конфігурації кнопки через бібліотеку UI для Magento; Джерело: Nexcess
Крім того, інтерфейс Magento 2 використовує JavaScript у поєднанні з RequireJS . RequireJS обробляє завантаження окремих модулів JavaScript-додатків. Особливість: RequireJS завантажується при відкритті сторінки тільки "необхідних" скриптів - замість всього - що значно скорочує макет сторінки.
Таким чином, замість того, щоб інсталювати необхідний скрипт окремо і виділити необхідні бібліотеки або інтегрувати все скрізь, в модулі посилаються необхідні модулі RequireJS, що спрощує роботу і спрощує код.
Інтерфейс Magento 2 підвищує продуктивність
Завдяки модульній структурі Magento 2 поставляється зі значно меншими змінами ядра і CSS-деклараціями, і тепер ви можете простіше, ніж раніше, тільки конкретні блоки, необхідні для запису файлу CSS. Це допомагає їй бути струнким і швидше завантажується.
Послідовне впровадження принципу Mobile First у Magento сприяє ефективності роботи на мобільних пристроях:
Структура передбачає, що стили-m.css, тобто таблиця стилів для мобільного компонування, завантажується спочатку. Лише якщо це не мобільний пристрій, додаткові стилі завантажуються зі стилів-l.css (l = large).
Для того, щоб використовувати ці потенціали продуктивності, це має бути Команда розробників раніше, але інтенсивно з більш складною архітектурою frontend справа.
Mobile First і responsive також задоволені Google.
Перевага: Magento 2 сприяє і вимагає професіоналізму
Неминуче пляма відокремлюватиметься від пшениці: фронтенд Magento 2 є більш складним за своєю структурою та можливостями, ніж у Magento 1. Якщо треба відхилятися від стандартних тем, відмінних результатів неможливо досягти за допомогою невеликої майстерності та доброї волі ,
- Magento 2 вимагає, щоб найсучасніші розробники розробляли дуже структурований спосіб роботи та широкий ноу-хау, щоб зберегти зусилля, спрямовані на постійне орієнтування користувача. Це може бути успішним лише за умови чіткого розмежування між розробкою backend і frontend. За допомогою таких інструментів, як Task Runner Grunt, ця робота також полегшується.
- Для цього ви отримуєте систему, з якою налаштування інтерфейсу можуть бути реалізовані надзвичайно точно, без конфліктів і тим самим швидко, що обіцяє короткий час завантаження і може бути легко оновлено.
