Dawosch
Neues Mitglied
Hallo zusammen,
ich bin gerade dabei eine neue Web-Application zu erstellen und wollte nun endlich mal das Framework Material-UI benutzen.
Ich lese immer wieder, dass es quasi das Framework zum erstellen von ReactJS Anwendungen ist.
Zugegeben, ich bin ein Freund des Google Material Designs, vor allem die Icons überzeugen mich schon lange.
Daher habe ich mich auf die Suche gemacht und nach einer ReactJS Umsetzung gesucht.
Gesucht, gefunden. Der Quasi-Standard ist Material-UI.
"Super" dachte ich mir. Kurz installieren, sich aus dem Komponentenbaukasten bedienen und zum Schluss noch etwas stylen.
Los geht's:
Installation - Kein Problem
Komponenten kopieren und einfügen - Kein Problem
Komponenten sinnvoll kombinieren - Uff, jetzt wird’s schwer
Komponenten schnell stylen - VERGISS ES
Als Beispiel:
Ich möchte eine Navbar erstellen. Dazu nehme ich die Komponente App Bar.
Darin benötige ich ein Suchfeld. "Easy", gibt sogar schon ein Template auf der Seite. Also kurz das Code-Fenster öffnen und schauen, wie es funktioniert.
WTF???
200+ Zeilen für ne Navbar mit ein paar Buttons und nem Suchfeld???
Ok dachte ich mir, dann mal schauen wie man ein Suchfeld in der Navbar platziert:
WAS ZUR HÖLLE IST DAS???
Die Lösung ähnelt ja quasi nativem HTML, ist meiner Meinung sogar noch etwas komplizierter als plain HTML.
Und dann noch die Farbe. Im Beispiel ist diese blau. Bei mir lila. Ein schlichtes Grau wäre doch angemessen.
Ok, sei es drum, dann den Style einfach global definieren.
Die Lösung, entweder nen Style in jeder Komponente definieren, oder über eine MUI-Komponente sämtliche Primär, Sekundär und Terizäre Farben und deren Derivate definieren. PUH!!!
EDIT:
Ok, den Punkt mit dem Style nehme ich zurück. Für eine einfache Umsetzung reicht es die Palette auf Root-Ebene zu definieren, sofern man das Farbschema von Material-UI verwendet. Die "Unterfarben" werden dann automatisch gesetzt.
Versteht mich nicht falsch.
Ich bin Entwickler und bin durchaus in der Lage so etwas selbst zu machen bzw. das Framework zu benutzen, aber ich sehe den Vorteil für dieses Framework einfach nicht. Wo nimmt es mir Arbeit ab?
Benutzt jemand von euch Material-UI und findet es gut?
Warum finden Leute Material-UI besser als z.B. React-Toolbox (auch Material Design)?
Grüße
ich bin gerade dabei eine neue Web-Application zu erstellen und wollte nun endlich mal das Framework Material-UI benutzen.
Ich lese immer wieder, dass es quasi das Framework zum erstellen von ReactJS Anwendungen ist.
Zugegeben, ich bin ein Freund des Google Material Designs, vor allem die Icons überzeugen mich schon lange.
Daher habe ich mich auf die Suche gemacht und nach einer ReactJS Umsetzung gesucht.
Gesucht, gefunden. Der Quasi-Standard ist Material-UI.
"Super" dachte ich mir. Kurz installieren, sich aus dem Komponentenbaukasten bedienen und zum Schluss noch etwas stylen.
Los geht's:
Installation - Kein Problem
Komponenten kopieren und einfügen - Kein Problem
Komponenten sinnvoll kombinieren - Uff, jetzt wird’s schwer
Komponenten schnell stylen - VERGISS ES
Als Beispiel:
Ich möchte eine Navbar erstellen. Dazu nehme ich die Komponente App Bar.
Darin benötige ich ein Suchfeld. "Easy", gibt sogar schon ein Template auf der Seite. Also kurz das Code-Fenster öffnen und schauen, wie es funktioniert.
WTF???
200+ Zeilen für ne Navbar mit ein paar Buttons und nem Suchfeld???
Ok dachte ich mir, dann mal schauen wie man ein Suchfeld in der Navbar platziert:
HTML:
<div className={classes.search}>
<div className={classes.searchIcon}>
<SearchIcon />
</div>
<InputBase
placeholder="Search…"
classes={{
root: classes.inputRoot,
input: classes.inputInput,
}}
inputProps={{ 'aria-label': 'search' }}
/>
</div>
WAS ZUR HÖLLE IST DAS???
Die Lösung ähnelt ja quasi nativem HTML, ist meiner Meinung sogar noch etwas komplizierter als plain HTML.
Und dann noch die Farbe. Im Beispiel ist diese blau. Bei mir lila. Ein schlichtes Grau wäre doch angemessen.
Ok, sei es drum, dann den Style einfach global definieren.
Die Lösung, entweder nen Style in jeder Komponente definieren, oder über eine MUI-Komponente sämtliche Primär, Sekundär und Terizäre Farben und deren Derivate definieren. PUH!!!
EDIT:
Ok, den Punkt mit dem Style nehme ich zurück. Für eine einfache Umsetzung reicht es die Palette auf Root-Ebene zu definieren, sofern man das Farbschema von Material-UI verwendet. Die "Unterfarben" werden dann automatisch gesetzt.
Versteht mich nicht falsch.
Ich bin Entwickler und bin durchaus in der Lage so etwas selbst zu machen bzw. das Framework zu benutzen, aber ich sehe den Vorteil für dieses Framework einfach nicht. Wo nimmt es mir Arbeit ab?
Benutzt jemand von euch Material-UI und findet es gut?
Warum finden Leute Material-UI besser als z.B. React-Toolbox (auch Material Design)?
Grüße
Zuletzt bearbeitet: