Bootstrap vs Interface utilisateur matérielle pour React?
J'ai utilisé les deux dans mes projets et parfois, je trouve qu'il est nécessaire d'utiliser un composant d'interface utilisateur Matériau dans un composant bootstrap) et l'interface utilisateur s'affiche comme je le pensais. On m'a cependant conseillé de ne pas utiliser Y a-t-il une raison pour laquelle puisque les deux utilisent la grille et peuvent être flexibles?
J'ai tendance à être bavard alors je vais mettre la réponse concise en haut ici:
Conclusion:
Ceux qui ont dit qu'il était mauvais d'utiliser les deux pourraient simplement exprimer leur opinion. En réalité, il est mauvais de dire que l'utilisation des deux manque vraiment de contexte dans ce que vous concevez. @ user3770494 a fait un très bon point, mais le point, bien que valide et véridique quant à la taille de la construction, dépend de la portée de l'application. Si c'est une application intra-bureau avec tout le monde sur un réseau local à fibre optique, tout sera caché dans la mémoire de toute façon ... mais (pas que vous me connaissiez), je ne vous jugerais pas négativement si vous les mélangiez ensemble - à moins que ce ne soit pour un MAJOR million d'applications utilisateur à exécuter sur les appareils mobiles (ordinateurs très bas), ordinateurs de bureau et autres appareils du monde entier nécessitant des mises à jour en temps réel (ish) et la diffusion en continu de contenu dynamique avec 10000 utilisateurs actifs à n'importe quelle heure donnée, 24h/24 et 7j/7.
En vérité, si ce n'est pas la vie ou la mort, je dirais d'utiliser les deux et de faire le vôtre. L’expérience de comprendre plus d’une chose vaut mieux que simplement "s’engager dans une solution unique" pour la croissance personnelle.
La suite de cette lecture est facultative - de rien :)
J'ai personnellement utilisé les deux dans des applications de production (à la fois ensemble et indépendamment) ... J'ai également tout fait à partir de zéro ... (CSS est ma partie préférée des travaux que je fais - heureusement, j'ai un collègue qui est excellent à cela) Voici mes pensées:
Attention: J'ai tendance à être bavard.
Disclaimer:
En tant que personne qui aime la fonction plutôt que la forme, la forme est une réflexion après coup qui n'est pas difficile pour les clients de poser des questions sur de petits changements ténus. Je vais essayer de laisser mon opinion sur "comment chaque option cherche se sent" autant que je peux.
De plus, je regarde votre question dans un choix actuel que je fais - qui utilise ReactJS/create-react-app pour réaliser des projets "de démonstration" pour les systèmes intégrés à écran tactile - je vais donc présenter une demi-douzaine de simulacres. programmes pour les démos rien qui ne fait vraiment rien (CCscanner, scanner de codes à barres, GPS, intégration de webcam, des trucs amusants comme ça). Donc, je recherche ce qui sera facile pour moi de m'engager dans cette action "parce que je m'ennuie et que j'ai un conseil pi3b + pour le plaisir).
Réponse:
Si vous avez le temps, le dévouement et les ressources, il n’ya vraiment rien de mal à les mélanger. Mais vous devez juste penser au temps/au coût/au bénéfice de celui-ci. DIY pour rendre l'utilisateur final heureux, même si vous les mélangez. Totalement, vous refaites la roue, mais vous pouvez toujours ajouter des styles boostrap, etc.
Le risque inhérent est que, si vous utilisez les deux, assurez-vous de ne pas trop les "mélanger", car vous aurez toujours de la difficulté à essayer de faire des changements de version sur l'un ou l'autre.
J'aime beaucoup de choses sur MaterialUI, mais honnêtement, je n'aime pas trop l'apparence de certaines choses (style par défaut). Sur le plan fonctionnel, je l'aime mieux que bootstrap, mais en même temps, je n'aime pas MaterialUIs React le style de programmation (en tant que puriste qui déteste les CSS, mais sait à quel point il est important de devoir utiliser! important pour toujours ... est un gros gros nononononononon) comparé à ce que mes collègues et moi-même utilisons pour les conventions. Ne pas dire que c'est mieux ou pire que ma propre préférence, mais quelques petites choses me contrarient vraiment (même si elles sont faites pour de bonnes raisons).
Bootstrap a beaucoup de choix à utiliser - j'aime son aspect, j'aime bien son jeu avec ReactJS, mais il y a réactstrap contre react-bootstrap (c'est pourquoi j'ai trouvé votre message en train d'essayer de déterminer lequel utiliser pour cette démo que je fais).
Dernièrement (pour les projets de production), j’essaie d’en rester à un seul, mais normalement je crée des systèmes qui fonctionnent par-dessus la forme. Donc, ils ne se soucient pas vraiment des éléments de l'interface utilisateur, mais de la façon de les utiliser pour ne pas les rendre jolis. Donc, je m'en tiens à en utiliser un seul simplement pour faciliter mon travail - et généralement, j'autorise toujours les styles moi-même ... si les styles d'origine me font chier. Mais je ne m'en tiens pas à l'un parce que "c'est une mauvaise forme d'utiliser les deux", je m'en tiens à un pour la raison susmentionnée. En fait, je dirais que si la bande passante n’est pas un problème (c’est une qualité d’utiliser les deux), mais d’en utiliser uniquement les parties que vous utilisez réellement.
(J'ai remarqué que quelqu'un importait jQuery une seule fois alors que la seule chose qu'ils utilisaient était $ .ajax (que ce soit beaucoup mais quand même) ... J'étais comme ... n'est-ce pas exagéré?!) - Donc si vous utilisez les deux et vous voulez garder les choses en place - assurez-vous que lors de la compilation, vous importez seulement ce que vous utilisez. Pythoniquement, je dis: n'utilisez jamais import * à partir du module (cependant, vous exprimez cela en Javascript sous forme de concept - webpack/gulp/whoever devrait s'en charger pour la plupart). En supposant que vous utilisiez du Javascript de style ES6/7.
J'ai rencontré ce scénario récemment et j'ai opté pour les deux, mais pour des tâches spécifiques. Comme il s’agissait d’une application Web réactive Bootstrap était le plus logique à utiliser pour la mise en page et l’Interface Matériau pour les widgets (juste ma préférence personnelle).
Utiliser les deux augmentera la taille de votre production en js.
Material Ui et bootstrap) fournissent tous deux aux composants des styles de base tels que des boutons, choisissez-en un.
Vous pouvez utiliser la grille de démarrage pour la structure uniquement ou même aller avec flex.