2017-08-29 1 views
0

Je travaille actuellement avec ReactJS. Je suis à la recherche d'un framework CSS qui ira parfaitement avec réagir et aider dans la conception d'un excellent web.Quels frameworks CSS fonctionnent parfaitement avec React?

+0

Matériel UI est bon, j'aime aussi la version de réaction de l'interface utilisateur sémantique – TimCodes

+0

Il y a tellement de [framework CSS] (https://github.com/troxler/awesome-css-frameworks) que vous pouvez choisir. Chacun a des avantages et des inconvénients, donc nous ne pouvons pas vraiment vous aider à choisir le cadre «parfait». – str

Répondre

3

React fonctionne particulièrement bien avec le style basé sur les composants, ou solutions "CSS dans JS". Ils résolvent beaucoup de problèmes CSS communs, comme les conflits de style.

Alors qu'il n'y a pas clairement gagnant en ce moment. et styled components fonctionnent parfaitement avec React et sont faciles à utiliser. Par ailleurs, vous pouvez parfaitement utiliser les modules CSS avec des fichiers CSS (ou même SASS), vous avez donc le meilleur des deux mondes.

Vérifiez le CSS Modules github repo pour une bonne introduction. Vous avez juste besoin d'ajouter un chargeur Webpack, et importer vos fichiers de style dans votre code JS. Voici un sample react app vous pouvez vérifier, il utilise CSS Modules + SASS.

+1

ya, vous avez raison. Je suis fan de réagir. J'utilise habituellement la base et le bootstrap à des fins stylistiques. Mais ils ne sont pas entièrement prêts à réagir. Je vais regarder dans votre suggestion, ils peuvent être utiles pour mes projets. –

+0

D'accord. Si vous avez besoin de quelque chose de plus haut niveau, vous pouvez Material-UI ou React Toolbox. Je n'ai pas encore utilisé le dernier, mais il est construit sur des modules CSS. – elas

0

Personnellement, je ne suis pas un fan de l'approche JS tout. Bien sûr, React pourrait être conçu avec "CSS in JS" à l'esprit, mais l'outil disponible pour travailler avec des feuilles de style ordinaires est simplement beaucoup plus mature (et mieux documenté). Ainsi, j'obtiens le meilleur des deux mondes en combinant React et JSX avec les préprocesseurs CSS (et post).

Ce n'est pas aussi "révolutionnaire" que d'autres options qui existent, mais SASS est toujours un cadre fantastique, qui soulage beaucoup la peine de travailler avec des feuilles de style.

Un avantage majeur est que, grâce aux importations, vous êtes libre de diviser et de compartimenter vos styles, mais vous obtenez toujours un seul fichier css dédié par composant. Ainsi, vous évitez le problème si commun des feuilles de style spaghetti.