React MDL Merges React con Material Design Lite

Google recientemente lanzó una biblioteca llamada Material Design Lite, que es un recurso de interfaz para desarrolladores. Estiliza automáticamente cualquier sitio web utilizando las pautas de diseño del material con CSS y JS pre-construidos..

Este es un marco popular para proyectos de desarrollo simple. React MDL combina el marco de Google con la biblioteca React para crear un recurso frontend completo..

El diseño de material de Google es claramente el futuro de UI / UX en el mundo de Google. Y con Material Design Lite, es más fácil que nunca implementar estas características en cualquier sitio web con una biblioteca de código abierto patentada.

React también es, con mucho, el marco de JS frontend más popular utilizado para los componentes de vista frontend. Con React MDL puede combinar estos componentes de React con la biblioteca de MDL para obtener una vista similar a la que encontrará en la documentación en línea de Google..

Aquí hay una muestra de plantilla de artículo para que puedas ver cómo se ve esto..

Esta página no tiene muchos componentes React, pero demuestra la estética del diseño del material. Encontrará mucha más acción en esta demostración construida con componentes React..

Puede encontrar más información sobre Material Design Lite en el repositorio de GitHub si tiene curiosidad por saber más. Desde allí puede descargar el CSS y JS sin formato para implementar en su página, que admite automáticamente todos los navegadores modernos y la degradación elegante..

Desafortunadamente, ya que React MDL todavía es bastante nuevo, no tiene soporte completo para todos los componentes.

Pero puedes ver una lista completa aquí que incluye pequeñas demostraciones para cada una. Esto también incluye bits de código fuente que puede copiar / pegar en sus propios proyectos según sea necesario.

me gustaría no Recomiende aprender React MDL hasta que ya se sienta cómodo con ambas bibliotecas.

El paquete Material Design Lite es bastante simple de comenzar, pero React es mucho más complejo..

Para obtener más información sobre MDL, consulte la página de preguntas frecuentes en su sitio oficial. Ofrece consejos sobre dónde usar MDL, qué características ofrece y cómo puede encajar en un flujo de trabajo típico de webdev.

Pero la verdad es que incluso si no comprende React puede hacerlo con todas las muestras en la página de componentes. Por ejemplo, la página del campo de texto tiene campos de texto que funcionan utilizando el diseño del material pero con fragmentos de código React.

Siéntase libre de jugar y ver lo que puede construir. Ambas bibliotecas son completamente gratuitas y de código abierto para todos los proyectos, ya sean personales o comerciales..

Puede obtener más información en la página React MDL GitHub si desea estudiar la fuente y sumergirse.