Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Material Web Components vs Material Components Web

Is there any difference between Material Web Components (link) and Material Components Web (link)?

Material Web Components doesn't have much of an explanation other than

Built on top of the Material Components Web project and LitElement, the Material Web Components enable a reliable development workflow to build beautiful and functional web projects.

Whereas material Components Web is

Material Components for the web (MDC Web) helps developers execute Material Design. Developed by a core team of engineers and UX designers at Google, these components enable a reliable development workflow to build beautiful and functional web projects.

Is it an just an re-implementation of all MDC components with web components in LitElement?

Documentation on Material Web Components is extremely sparse for now, therefore it's been hard to compare using them in test applications.

As an aside, this naming is awful, hopefully they change the name during pre-release.

like image 597
I should change my Username Avatar asked Sep 02 '19 06:09

I should change my Username


People also ask

What is material Web Components?

Material Web is Google's UI toolkit for building beautiful, accessible web applications. Material Web is implemented as a collection of web components. The Material team is currently working on Material You (Material Design 3) support for Material components.

What is material MDC?

Introduction. Material Components (MDC) help developers implement Material Design. Created by a team of engineers and UX designers at Google, MDC features dozens of beautiful and functional UI components and is available for Android, iOS, web and Flutter.


Video Answer


1 Answers

Material Components Web Components project (link) is building on top of the Material Components Web project (link) to create Custom Elements (link).

When using Material Components Web you have to include the CSS and javascript provided by the project in your web pages.

Material Components Web Components defines new HTML tags using the Custom Elements specification. Examples of such tags are <mwc-drawer>, <mwc-icon>.

The new tags are Custom Elements and are completely self-contained. The CSS and javascript are part of the component and isolated from the rest of the page.

like image 80
koma Avatar answered Oct 02 '22 05:10

koma