Magento 2 Webinar On Frontend & Layout Architecture – Summary

Earlier today there was a Magento 2 webinar covering the revised Frontend and Layout architecture. Due to technical difficulties it was halted prematurely, but the topics discussed so far were really interesting.

Magento UI

Magento 2 will feature an UI library called simply “Magento UI”. People familiar with Bootstrap, Foundation or other CSS frameworks will notice resemblance. Magento UI will contain standard reusable components like buttons, sanely styled forms and navigation elements. One thing which is really neat is that the entirety of Magento UI will be programatically documented. Magento UI is already used in the Magento 2 repository on Github. In fact, Magento UI Documentation is already open for the public.

LESS

One thing to take away from the webinar is that Magento 2 will be heavily influenced by LESS. The entire Magento “UI” CSS Library is defined as LESS instead of CSS which means that styling-definitions have additional features not available in standard CSS – like variables and mixins. Because by default browsers are not capable of using LESS for rendering, it has to be compiled to CSS first. Magento 2 ships all of this functionality. If we understood correctly, it is possible to leverage custom compilers. In theory this means that instead of LESS, developers are free to implement a compiler which is compatible with a stylesheet language of their choice, like SASS.

Schemas

Because XML is the description model in Magento, it has always been a bit of an oddity that there were no XML schema definitions in Magento at all. With Magento 2 this changes. Each and every recurring XML file has a schema to go with it – it does not only apply for frontend matters. Because a schema carries the definition of the structure of an XML document, there should no longer be discrepancies or undocumented features in Magento its description model. A proper XML Schema helps with validation in all sorts of ways. Bonus is that modern IDEs (like PHPStorm) feature dynamic syntax-highlighting depending on a XML Schema which can further assist developers in writing proper XML.

To be continued

The speaker was about to dive deeper into the layout improvements of Magento 2, but as it was picking up steam – [cci][/cci] directive annihilated! – technical issues took the lead and aborted the webinar. Fortunately, Elena Leonova (@elena_a_leonova, Magento Product Manager) has stated that the webinar will be rescheduled in the form of a Q&A. Did we miss anything? Let us know in the comments! As excited as us about Magento 2? Follow us on Twitter! Update – “Resuming with full Q&A tomorrow at 9AM PST (9th of April)” – @Magento on Twitter