Metro 4 - a path length of 6 years. A brief history of Metro UI CSS
3r33140. This story began back in 201? when Windows 8 began its long journey around the planet. Being impressed by the tiled interface of the start page of this operating system, I decided to do the same on HTML, CSS and jаvascript. 3r3141.
3r33140. Then there was no thought to make a library of components, just a set of styles and their use and so that in the browser and so beautiful and that it worked. And rushed. At first there were just tiles (tiles), then they gained various effects, and then this was not enough. On the Internet (just kidding, on the Microsoft website), the Microsoft Developer Guide for Windows 8 UI was found. After reading a bit of this creation of Microsoft engineers, it was decided to start making a library of components, little by little, for personal use, without advertising and hype. 3r3141.
3r33140. Well, as they say, it is said - done. The project was launched under the code name 3r36969. Metro UI CSS
3r33140. The first version of which, by the way, did not get the number ? but remained in the history with the number ??? had basic styles and a dozen components. 3r3141.
3r33140. Sergey Volkov from Russia and Valerio Battaglia from Switzerland joined the project. Immediately, I want to thank them for their work in the project. 3r3141.
3r33140. Although the project was not advertised anywhere, it was nevertheless noticed by the community. The number of visitors to the project page quickly reached the number of 2000 hosts every day, asterisks began to slowly accumulate on the project's GitHub page. 3r3141.
3r33140. After some time, the project was noticed by the managers of the program 3r36969. Microsoft Bizspark
and soon received the corresponding status as a member of the BizSpark program, and we all who worked on the project received buns from Microsoft in the form of software licenses from the software giant. 3r3141.
3r33140. A little later, the project also received support from the company 3r36969. JetBrain
s (the company actively supports open source) in the form of licenses for their wonderful
3r33140. In June 201? it was decided to discontinue work on version ??? and begin developing version 2.0. By this time, some experience had accumulated, it came to the realization that what was done wrong, what needs to be improved and what should be removed completely. General TODO turned out to be so extensive that there was no point in making corrections and additions to version 0.9? and it was more expedient to start development from scratch. 3r3141.
3r33140. So began her life version ???r3r3234. . 3r3141.
3r33140. When developing version 2.? errors and wrong decisions in version ??? were taken into account. The basic styles have been optimized, and the set of components has been expanded 3 times to 30 pieces, the ability to initialize components using the declarative approach has been added through the HTML attribute of the element 3r369. data-role
3r33140. 3r375. 3r3141.
3r33140. Positive feedback from the community showed that this was the right step - to refuse to continue working on ??? in favor of the all-new Metro UI CSS 2.0. 3r3141.
3r33140. Unfortunately, at the beginning of work on version 2.? communication was lost, for one reason or another, with Sergey and Valerio and further the project was written by one person. It was a difficult, but very interesting job. In general, I noticed that if your work brings someone a benefit, it gives the author a profit that you cannot buy for money, and the sensations from this have their own, incomparable psychological coloring. 3r3141.
3r33140. Version 2.0 has existed for 2 years. As everything develops, the project has developed, both in thought and in code. In August 201? it became clear that the project needed to change something and change it radically and so that it would benefit those who used the library for their tasks. 3r3141.
3r33140. One of the key decisions for the release of version 3.0 was the decision to move further away from the functional component initialization and make it as declarative as possible and give people who have no jаvascript programming experience (for example, SEO specialists) the opportunity to impose site pages and that these pages retain their interactivity. 3r3141.
3r33140. The main disadvantage of the declarative approach in version 2.0 was the fact that it works only for pre-built components. If the component was loaded onto the page via Ajax or created by jаvascript code, then the only possibility for its initialization was a call to the corresponding function. 3r3141.
3r33140. 3r3-300. 3r3141.
3r33140. At the end of August 201? I began work on 3r3-105. The 3rd version of Metro UI CSS . 3r3141.
3r33140. As I said above, the main task was to do everything in a declarative style. And if earlier, in order to initialize a component that was loaded via Ajax or created using jаvascript and attached to the DOM, it was necessary to write the corresponding jаvascript code calling the desired initialization function of the component, then in the 3rd version it was decided to correct it, especially that browsers have already begun to support the necessary technology for this (Observer). 3r3141.
3r33140. In the third version, the code of basic styles was strongly optimized, the mechanism for initializing components and tracking their appearance on the page was written, followed by automatic initialization. The set of components and their functionality has been expanded, the component code has been rewritten to support initialization and tracking functions. Innovations were to the point, as indicated by a large number of positive feedback from library users. 3r3141.
3r33140. 3r3119. 3r3141.
3r33140. In April of 201? once again reviewing the source code of Metro UI CSS and sites written in Metro ? I came to the conclusion that a lot of HTML code had to be written by a programmer and we had to do something about it. 3r3141.
3r33140. So it was decided that even if all the extra wrapping HTML code had been, and by that time many components had a wrapper of HTML elements over them to ensure their performance, it was not the programmer who wrote, but the library was coping with it. Another problem was that Metro 3 did not track the change in the values of the key attributes of the components, the change of which entailed the change in the behavior of the component. These two factors led me to write Metro 4.
3r33140. 3r33132. 3r3141.
3r33140. The preparatory work took three months, during which time Metro 3 was restructured, defining what needs to be done and how to do it. In August, I started working on the 4th version, which by that time even changed its name from Metro UI CSS to just Metro 4. The name change was also not just done. The library, although it retained the visual base established in the previous three versions, but was no longer just a stylization of the elements of Windows 8. It became something more. Everything was rewritten from scratch. The number of components has been increased by 2 times to 70+ and continues to increase. Now it has become a self-sufficient product, there is no need for many third-party components and libraries (except jQuery Core, while this is the main and only dependency). 3r3141.
3r33140. So, what is so special about Metro 4 that is not found in other libraries, for example Bootstrap? In fact, I will not even compare! This is my personal vision, this is my world, which I have been building for several years. If you are completely satisfied with Bootstrap or some other library, then you can continue to use them, but if you want to try something new and more in this life (to hell with modesty!), Welcome to the world of Metro 4.
3r3144. Key features of the project: 3r3208.
A set of basic styles - Metro 4 includes various styles to change the appearance of html elements.
70+ components with declarative style of use are available to solve almost all problems.
Tools - various built-in functions and classes will increase your productivity.
Iconic font with a set of more than 500+ icons.
Builder ( [url]Https://builder.metroui.org.ua[/url] ) - with the help of the collector, you can build your own set of Metro 4 components. The source code is available on Github.
Sandbox ( [url]Https://sandbox.org.ua[/url] ) - own sandbox for testing the capabilities of Metro 4 and not only. By the way, the sandbox is written in Metro ? the author of Metro 4 and its source code is available on GitHub.
Quick response to detected errors and their elimination. The new version comes out every week on Sundays, and during the week the Developer Branch is available on GitHub with the currently fixed fixes and extensions.
A detailed description of all the elements of the Metro 4 library (3r3-33214. [url]Https://metroui.org.ua[/url]
Forum - get additional help from the community on the Metro 4 forum.
Metro 4 is an open source toolkit for development using HTML, CSS and JS. Metro 4 allows you to quickly and cost-effectively create page prototypes and full-featured sites, and even without the knowledge of jаvascript.
Metro 4 is currently licensed with MIT and will always remain free for non-commercial open source projects.
3r3192. Special thanks I want to say:
My friend Alexander Zadorozhny, for financial support in the early stages of the project 3-333235.
To my friend and chief Alexander Olshansky for the support and a large number of original ideas for the project 3-333235.
Official site of the project
Sandbox: https://sandbox.org.ua , https://github.com/olton/Sandbox
Builder: https://builder.metroui.org.ua , https://github.com/olton/Metro4-Builder
It may be interesting
This is my first time i visit here. I found such a substantial number of interesting stuff in your blog especially its examination. Really its inconceivable article. Keep it up.Gulf Coast Western Reviews
I can see that you are an expert at your field! I am launching a website soon, and your information will be very useful for me.. Thanks for all your help and wishing you all the success in your business.GSM Solutions
Wow, What a Excellent post. I really found this to much informatics. It is what i was searching for.I would like to suggest you that please keep sharing such type of info.Thanksthc vape juice