react-mdl
react-mdl copied to clipboard
tleunen
Question: react-mdl vs material-ui
Hey everyone
I am planning to start a new project and am debating between the react-mdl and material-ui. I am not however sure which way to go. It appears that this react-mdl is leveraging the google's material-design-lite project, which sounds great. OTOH material-ui appears to be built independently.
My front-end skills are not the greatest and I am worried about spending hours upon hours tweaking the CSS files and layout issues. Also I care about extensibility e.g. it should be possible for me to add a logo to the App Bar.
I appreciate any thoughts and guidance on this topic.
Vivek
I've been playing with both a lot recently and so far I'm leaning toward react-mdl myself. Right now Material-UI has a lot of components that are really great and are super easy to work with. But in the current version of the package Material-UI has no support for layouts which this one does. So it's basically up to you on which one you choose. Material-UI doesn't really provide you with any CSS to tweak (that I could find) as most of the design is put into React components directly (from what I can tell)
There are so many trade offs that it is impossible giving a generic answer
if you do not want to spend time tweaking CSS and just use a framework then use Material UI
if however you want to get better at Web Development (outside just React-frontend-JS styling development), and expect to cherry pick components from around the web and tweak them into a global custom theme (you will need CSS skills) then react-mdl is the clear way to go
Here you are two screenshots of the code generated for a button (MDL vs Material-UI) and decide which one you want to customize.
The Material UI way:
The React MDL way:
Material UI looks great until you actually try to use it. Then the "awesome" inline styles kick you in the groin, and the bugs + the people maintaining it not caring about issues kick you in the Coccyx. After wallowing in horrible JS/React code pain, you realize you'll never have a production ready app using Material UI, unless you fix it all by yourself... and I don't think you want to do that, do you?
Thanks. The code indeed looks much cleaner on the react-mdl.
I also noticed that react-mdl v2 branch has not had a commit since June. Is the v2 no longer interesting?
what about react-md? I read somewhere that it is the best and most accurate implementation of material design for react. Just tried react-mdl and wonder why it doesn't show the ripple effect?
It's definitely not the best and most accurate :) Not anymore at least.
I'd suggest using these ones from Google: https://github.com/material-components/material-components-web, or something like React-Toolbox
