Resources to set up environment for Material.io?

Question

I'm very new to web development, but with a school project a group member of mine suggested using Material.io, which in itself was not hard to understand. However, I am severely struggling with setting up a dev environment to even take advantage of Material Components. I believe that I have to use Babel, Webpack, and React through Node.js and npm to fully set up the environment. Anyone know any good sources to help me with this? I appreciate any feedback.

I've used these resources already with no luck: https://codelabs.developers.google.com/codelabs/mdc-101-web/#1

https://www.freecodecamp.org/news/how-to-use-reactjs-with-webpack-4-babel-7-and-material-design-ff754586f618/

Answer 1

The first thing I'd like to clarify is that Material Design (material.io) is a guideline of the look-and feel of various widgets. Material Design does not dictate the technology stack that you use to implement widgets that follow Material Design. Therefore we cannot answer your question what tools you need. For example, you can build your Material Design app with React, but you could equally build your app with Angular.

Here are a few libraries that implemented Material Design components for different technology stacks:

• Material Design component library for React
• Material Design component library for Angular
• Material Design component library implemented with Web Components
• Material Design component framework implemented in plain CSS & JavaScript

So first you need to decide which stack you want to build your app with, and then you can look at what tools/libraries you need to implement Material Design on that stack.