Categories: Мадженто 2

Що нового в Magento 2 (у порівнянні з Magento 1.x)?

Magento 2 значно відрізняється від свого попередника Magento версій 1.х. Розробники внесли масу змін, щоб поліпшити продуктивність та масштабованість цієї платформи. Але в новому двигуні є маса змін, які варто виділити особливо, і в сьогоднішній статті ми приділимо цьому увагу.

Основні зміни:

  • Підтримка HTML5, CSS3, jQuery, LESS
  • Файлова структура
  • Макети
  • Контейнери та Блоки
  • Документація (Wiki, DevDocs)

Деякі з поліпшень включають додавання тегів HTML5, вбудованих в шаблони, використання в стилях технік CSS3, а також вбудований препроцесор LESS. На стороні JavaScript хорошою зміною є перехід від Prototype до jQuery в якості основної бібліотеки. Тепер дуже активно використовується jQuery UI і доданий цілий набір готових користувальницьких віджетів jQuery UI, які можна використовувати на своєму сайті. Всі завантаження JavaScript обробляються RequireJS і тепер не потрібно турбуватися через неправильну черговість підключення скриптів.

  1. CSS

В Magento 2 додавати CSS стало простіше, для цього потрібен тільки файл-джерело CSS стилів. Раніше доводилося додавати CSS або через XML, або шляхом додавання коду <link> в секцію <head> через файл шаблону.

Якщо ви розширюєте одну з вбудованих тем (наприклад, blank тему або Luma), щоб налаштувати CSS, ви просто пере визначаєте .LESS-файл з оригінальними стилями використовуючи еквівалентні ім’я/шлях у вашій власній темі. Наприклад, вам потрібно перевизначити CSS-стилі Кошика, які спочатку визначені в наступному файлі:

app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/_module.less

Вам потрібно скопіювати вміст цього файлу і створити новий файл в своїй темі з тим же шляхом. Таким чином, це буде виглядати приблизно так:

app/design/frontend/Company/Theme/Magento_Checkout/web/css/source/_module.less

Ви також можете додати свої власні CSS-файли. Це робиться в файлі default_head_blocks.xml, який знаходиться в папці Magento_Theme у вашій темі, наприклад:

app/design/frontend/Company/Theme/Magento_Theme/layout/default_head_blocks.xml

  1. Файлова структура

Файлова структура тем і модулів сильно відрізняється від Magento 1.x. Кожна папка з шаблоном імен <Package>_<Module> є компонентом сайту. Всі складові папки skin перенесені в ці компоненти (окремо в темі, і окремо в модулі), що дозволяє тримати всі ресурси разом, а це значно полегшує використання користувальницької теми. Всі картинки (медіа-ресурси) перенесені з папки media в папку pub/media. Всі системні та сторонні модулі тепер знаходяться в кореневій папці vendor (якщо вони були встановлені через Composer). Якщо ви створюєте свій модуль, вам потрібно, як і раніше, робити це в папці app/code/ (правда, без розділення на середовища розробки).

  1. Макети

В Magento 2 більше немає файлу local.xml. Замість цього використовується весь потрібний XML в кожному модулі. Якщо ви хочете змінити XML-файл для модуля, вам потрібно буде створити новий XML-файл з тою ж назвою в еквівалентній структурі модуля у вашій темі і внести туди зміни (пам’ятайте, що всі атрибути і визначення з вихідного модуля будуть успадковані в цей файл) .

Ще одна чудова особливість нового XML в Magento 2 – це дія move (переміщення). Раніше, якщо ви хотіли кудись перемістити блок, вам потрібно було відключати дочірній елемент, а потім вставляти його назад в XML-макеті. В Magento 2 для цього потрібен лише один рядок. Щоб перемістити елемент, ви просто посилаєтеся на нього через його ім’я, а потім вказуєте пункт призначення (це може бути Контейнер або Блок).

Приклад інструкції: <move element="catalog.leftnav" destination="content.top" after="-"/>

  1. Контейнери та Блоки

Контейнер являє собою структуру без контенту (тобто, без вмісту, просто структуру), яка містить інші Блоки і Контейнери. Ви можете вказати атрибути і теги HTML і задати їм ідентифікатор і/або клас. Це означає, що ви можете створювати HTML структуру за допомогою макета, що було неможливо в Magento 1.x. Для розширення макета використовуються ноди referenceBlock і referenceContainer (іншими словами, це посилання на потрібні Блоки і Контейнери).

Більш детальна інформація про контейнери і блок міститься в нашій попередній статті.

  1. Документація по Мадженто 2

Творці Magento 2 розробили дуже детальну документацію по новій платформі. Настійно рекомендується ознайомитися з нею за наступною адресою.

Короткий підсумок

В цілому, Magento 2 без сумніву є великим поліпшенням у порівнянні з версіями Magento 1.x. Є багато великих поліпшень, таких як нова модульна структура коду і перевизначення контенту і XML-макета. Покращення в JavaScript є одним з найбільших змін, оскільки тепер ви можете легко додавати нові, і розширювати існуючі скрипти, не турбуючись про всіх залежностях файлів.

Звісно, що ми розглянули не всі нововведення, але для цього недостатньо однієї сторінки. Ми будемо публікувати окремі статті по найбільш цікавих моментам нової платформи, тож слідкуйте за оновленнями на сайті!

Якщо у вас є корисна інформація по даній темі, не соромтеся ділитися нею в коментарях нижче. Також напишіть свою особисту думку про нову платформу.

Recent Posts

Опалення і гаряча вода коли треба, а не коли включать

Тепло в домі і гаряча вода в будь-який час для багатьох мешканців багатоквартирних та приватних… Read More

19/09/2020

Що краще: цифрове телебачення Т2 чи інтернет-телебачення

Сучасне життя неможливо уявити без телебачення. Воно дозволяє дізнаватися про події в Україні та світі,… Read More

02/09/2020

Гіпоалергенна подушка. Чому вона важлива?

Зараз знайдеться мало людей, в яких немає алергії на продукти або пилок рослин. Вважається, що… Read More

28/08/2020

Футбольний Інстаграм – що нового у топових футболістів

Деякі відомі футболісти ретельно приховують свої особисте життя, а інші – активно постять фотографії з… Read More

24/08/2020

Види та типи компресійних панчіх

Вироби називають компресійними, коли їх застосовують для лікування, а також профілактики порушень кровотоку в нижніх… Read More

22/08/2020

Як правильно замінити оливу у двотактному гідроциклі?

Гідроцикли – це класний плавзасіб, який може подарувати вам незліченні години приємного проведення часу на… Read More

19/08/2020