I am new in Frontend development, I want to make a really good looking APP using MERN Stack and Im starting developing on REACT JS.
So, I want to use some Styling Framework. My first option was just import in the index.html file the CDN of "BOOSTRAP" and the JavaScript of Jquery and others. Just like working on html.
I work my project just adding "Bootstrap Classes" to my HTML and everything seems to go well... but. When I start to try to make some functionalities like "MODALS", I am having some problems.
I read that this is because BOOSTRAP uses JQuery and manipulates DOM, and REACT makes basically the same. So I Will have some "Bugs" and Issues.
So, Work again all the Styling and rewrite code will be a "Titanic" work and I dont want to make mistakes this time.
I have been researching and I found MDBootstrap REACT (Material Design boostrap) and React-Boostrap alternatives, but I have some complains.. first with MDBootstrap, I seems as a "Scam" or something. It looks nice with material design, but is expensive the pro version, and I dont find in the documentation how to "Modify" the styling of the component if I need to.
Then with React-Boostrap I basically have some concerns about the grade of "Personalization" that it allows or how to do so? I couldnt find documentation about.
What would you take if you where on my shoes? ( I dont want to write my own CSS from Scratch, but I want to be able to personalize some componentes, or theaming if I need to)
All this CSS framework are build for react.
Out of the hundreds of UI frameworks out there, Material UI is one of the best Reactjs based UI frameworks that have the most refined implementation of Material Design.
Semantic UI is a development framework that helps create beautiful, responsive layouts using human-friendly HTML. This framework is more influenced with semantic style of HTML having meaning for every css class.
React Toolbox is a UI library that follows the concepts of Google’s Material Design and is built on top of some of the trendiest proposals like CSS Modules (written in SASS), Webpack and ES6.