M-am apucat un pic de React și am câteva neclarități.
Ce framework-uri pentru UI folosiți în React? Care este considerat standardul de facto? Care sunt considerate cele mai mature și mai complete?
Am găsit și eu liste de framework-uri, am văzut că exista Material și Boostrap, dar mă interesează și experiența voastră.
Oricare din cele mentionate, as mai adauga ant design si chakra-ui.
Tailwind e in voga acum, tailwind cu tailwind-styled-components/tailwind-macro. Dar daca vrei ceva mai elegant vezi chakra.
Eventual sunt cateva framework-uri care au componente si pentru native si pentru react js.
Hmm, deși tailwind mi se pare în general o idee proastă, în React s-ar putea să fie de fapt o idee foarte bună, pentru că acolo oricum de multe ori creezi componente care sunt styled inline, right?
Scopul lui tailwind e sa iti dea un design system al saracilor, adica de exemplu ai un design, iei culorile si dimensiunile pe elementele din kitchen sink-ul facut in Xd/Sketch/Figma, le aplici pe tailwind si dupa orice face designer-ul tu folosesti doar acele clase de dimensiuni, culori ca sa iti stilizezi componentele.
Nu mai intrii in CSS sa faci ceva ce cere designerul lui peste prajit daca design-ul nu respecta spatiile/culorile din design system. Ii zici direct sa iti dea design dupa ce si-a facut el in kitchen sink. In acest mod o sa fie usor si sa implementezi teme fiindca faci override la setarile la tailwind si totul o sa fie consistent.
In react mai exista pattern-ul de styled components care pune stilurile din css/js inline. Chiar si cu css clasic sau scss e foarte frecventa utilizarea unei librarii numite classnames ca sa ai css conditional, fata de utilizarea css-ului cu styled components nu pierzi mai nimic cu tailwind. Doar daca ai folosi CSS simplu pe langa react ai castiga caching si ceva viteza, fiindca JS-ul nu evalueaza si stilul, respectiv CSS-ul se poate incarca asincron cu JS-ul. Daca ai folosit styled components sau tailwind cu conditionale tot stilul necesita sa se incarce din logica de JS. La tailwind e oarecum putin mai complicat de fapt, ca poti sa il folosesti cu compilator in timp real care iti face un fisier de css care e mai ok ca si styled components fiindca se poate pune ca si .css pe langa cod. (compilatorul se asigura sa iti puna in fisierul css doar ce ai folosit din tailwind)
Cum fiecare componenta in mod normal trebuie sa respecte SOLID, in special single responsibility, tu nu prea ai motive sa mai intrii si sa modifici o componenta odata creata si stilizata, faci alta componenta. Daca nimeresti ditamai linia de inline style cu tailwind asta e, asa ramane pana moare sau faci alta componenta din componenta de dinainte dandu-i alt prop la style. Nu e o problema ca nu se poate citi, in mod ideal tu nu vrei sa intrii si sa modifici o componenta deja finalizata, vrei doar sa o extinzi sau sa o inlocuiesti. (asta in lumea super ideala, ca toti ne bagam in componente deja facute in loc sa facem altele)
Da, exact așa văd și eu treaba cu componentele. Componenta trebuie să fie o chestie opacă, eu folosesc componenta Button, nu (prea) mă interesează cum e făcută intern. Iar ca să modific modul în care arată butonul mai degrabă prefer să intru în buton și să modific acolo decât să sap în milioane de linii de cod scss ca să găsesc unde naiba sunt stilurile butonului.
Nu intrii in buton, creezi un CustomButton sau Button.Custom in care pui butonul de dinainte doar ca ii schimbi clasele de tailwind din props.
In mod ideal o componenta ori ii facuta sa poata fi doar extinsa, ori il faci direct cu shadow dom sa nu te poti atinge de ea, dar ca sa intrii direct si sa o modifici e urat fiindca nu stii niciodata exact in cate locuri e folosita si ce alte componente depind de componenta deja existenta. (bine ai find usages in mod normal din IDE) Daca scopul tau e sa schimbi fiecare buton existent din aplicatie, atunci da, modifici/inlocuiesti.
Evident, vorbeam componente create de mine sau vreun coleg de proiect. În niciun caz nu aș modifica direct componenta unui framework, nu de alta dar la un eventual update dispar toate modificările.
Apropo de chakra, pare un framework foarte apetisant, scris special pentru React. Ai idee dacă versiunea community e suficientă pentru majoritatea usecase-urilor?
Nu am lucrat cu chakra, eu cu framework-urile/librariile existente am problema ca e prea usor sa cazi in capcana cu estimarile. Crezi ca ai ceva ce de fapt e mult prea complicat de utilizat si nu e ce trebuie si dupa stai zile sa faci ceva de la 0 pe ceva ce ai estimat maxim o zi de munca.
De multe ori e mai safe sa faci ceva de la 0 si sa estimezi cum trebuie decat sa te duci pe ceva ce teoretic e deja facut si doar trebuie integrat.
Right, am mai pățit-o și eu. Vezi demo-uri mișto, dar când încerci să te pliezi pe aplicația ta îți blestemi zilele 
Va trebui să fac un mic proiect să văd dacă mi se potrivește.
Mersi pentru info.