Bootstrap与Material UI for React? [英] Bootstrap vs Material UI for React?

问题描述

我在我的项目中一直使用这两个工具，有时我发现需要在Bootstrap组件和UI显示中使用Material UI组件，这与我期望的一样.有人建议我不要使用这种方法.因为两者都在使用网格并且可以伸缩，所以有什么理由吗?

I have been using both in my projects and sometimes I find the need to use a Material UI component within a bootstrap component and the UI displays as I would expect. I have been advised though not to use this approach. Is there any reason why since both are using the grid and can be flexed?

推荐答案

我倾向于冗长，因此我将简洁的答案放在这里:

I tend to be verbose so I'll put the concise answer up top here:

结论:

无论谁说都不好用，可能只是在表达他们的意思 意见，实际上是说同时使用这两种方法确实很缺乏上下文，这很不好 在您的设计中. @ user3770494提出了一个很好的观点-但 要点，虽然有效且真实地了解构建大小，但这确实取决于 应用范围.如果是办公室内部应用程序 光纤本地的每个人都将被缓存在内存中 反正...但是(不是你认识我)我不会否定地评价你 如果您将它们混合在一起-除非是针对百万主要用户 在移动设备(非常低的设备)，台式机和其他设备上运行的应用程序 世界各地需要实时更新的设备，以及 在任何条件下以10000s的活跃用户流式传输动态内容 时间24/7.

Whoever said it was bad to use both might just be expressing their opinion, in reality saying it's bad to use both really lacks context in what you're designing. @user3770494 made a very good point- but the point, while valid and truthy about the build size, it does depend on the scope of the application. If it's an intraoffice application with everyone on a fiber network local it'd all be cached in memory anyways... but (not that you know me) I would not judge you negatively if you mixed them together-- unless it was for a MAJOR million user application to run on mobile (an very low devices), desktop, and other devices around the world requiring real(ish) time updates, and streaming dynamic content with 10000s of active users at any givin time 24/7.

说实话-如果不是生死攸关的话-我会说同时使用-和 自己做.多了解一件事的经验是 更好，然后针对个人进行致力于单一解决方案" 增长.

In all truth- if it's not life or death-- I'd say use both- and also do your own. The experience of understanding more then one thing is better then just "committing to a single solution" for personal growth.

---

此阅读的其余部分是可选的-不用客气:)

---

The rest of this reading is optional - you're welcome :)

我个人在生产应用程序中都使用过(两者同时使用，并且独立使用) ...我也从头开始使用了这一切... (CSS是我最不喜欢的部分我所做的工作-幸运的是我有一个很擅长的同事)这是我的想法:

I personally have used both in production applications (both together, and independently)... I've also done it all from scratch... (CSS is my least favorite part of job things I do - luckily I have a coworker who is great at it) Here are my thoughts:

警告::我倾向于冗长.

免责声明:

作为一个喜欢功能胜于形式的人，形式是一种事后挑剔的选择，客户可以借此询问微小的细微变化.我将尽我所能，对每个选项如何寻找感觉"发表自己的看法.

As someone who likes function over form, form is an afterthought that is nit picky for clients to ask about tenuous little changes. I am going to try to leave my opinion on "how each option looks for feels" out of this as much as I can.

我也在当前选择中查看您的问题-使用ReactJS/create-react-app为触摸屏嵌入式系统制作演示"项目-因此，我将推出一半十二个用于演示的模拟程序，什么也做不了(CCscanner，条形码扫描器，gps，网络摄像头集成，类似这样的有趣东西).因此，我正在研究对于我来说，因为我很无聊并且得到了pi3b + board来取乐，这很容易".

Also I'm looking at your question in a current choice I'm making- which is using ReactJS / create-react-app to make "demo" projects for touch screen embeaded systems- so I am going to roll out half a dozen mock programs for demos nothing that really does anytihng exactly (CCscanner, barcode scanner, gps, webcam integration, fun stuff like that). So I'm researching what will be easist for me to just commit to for this "beacuse I'm bored and got a pi3b+board for fun).

答案:

• 如果您有时间，奉献精神和资源，那么真的有 将它们混合在一起没有错.但是你只需要思考 关于它的时间/成本/收益. DIY使最终用户满意- 即使将它们混合在一起.完全是您自己在重新制造车轮，但是您 可以随时添加boostrap样式等.

• If you have the time, dedication and resources, there is really nothing wrong with mixing them together. But you just need to think about the time/cost/benifit of it. DIY to make the end user happy- even if you mix them. Totally yourself is remaking the wheel- but you can always pull in boostrap styles etc.

与生俱来的风险是，如果同时使用两者-请确保不要将它们大量混合"-因为那样一来，您尝试尝试时总会遇到问题 可以对其中任何一个进行版本更改.

The inherent risks is that if you use both- make sure you don't "Mix them" to much- because then you will always have issues with trying to ever do version changes on either one.

我喜欢很多MaterialUI的东西，但老实说，我不喜欢一些东西的外观(默认情况下为样式明智)-从功能上讲，我更喜欢 然后进行引导，但同时，我不喜欢MaterialUIs React 编程风格(作为一个讨厌CSS的纯粹主义者，但知道它的重要性 它是-必须使用！重要的永远...很大很大很大 与我和我的同事使用的任何方式相比 约定.不说我自己好还是坏 偏好-但是关于它的一些事情真的让我很生气(即使它们是 是有原因的.)

I like a lot of MaterialUIs things, but I honestly dislike how a few things look (style wise by default)- functionally I like it better then bootstrap, but at the same time, I do not like MaterialUIs React programming style (as a purist who hates CSS But knows how important it is- having to use !important ever ever ever ... is big big big nonononononononon) compared to whatever way my coworkers and I use for conventions. Not saying it's better or worse then my own preference- but a few things about it really irk me (even if they are done for good reasons).

Bootstrap有很多选择可以使用-我喜欢它看起来更好，我喜欢它与ReactJS一起玩的方式-但是有 reactstrap vs. react-bootstrap(这就是为什么我发现您的帖子试图 来确定我要在演示中使用哪一个).

Bootstrap has a lot of choices to use for- I like how it looks better, I like how it plays with ReactJS better- but there is reactstrap vs. react-bootstrap (which is why I found your post trying to figure which one to use for this demo thing I'm doing).

最近(对于生产项目)，我确实尝试只坚持一种，但是通常我会制作功能超越形式的系统.所以 他们并不太在乎UI元素，而是关于 如何使用它不能使它漂亮.所以我坚持只用一个 只是为了让我的工作更轻松-而且通常我自己仍然会忽略样式 ...如果原始样式惹恼了我.但是我不坚持 因为同时使用这是一种不好的形式"，我只是坚持使用一个 上面提到的原因.我实际上是说带宽不是 问题-同时使用两者的质量-但只能使用其中一部分 您实际使用的.

Most recently (for production projects) I do try to stick just with one but normally I'm making systems that are function over form. So they don't really care that much about the UI elements, it's about how to use it not make it pretty. So I stick with using a single one just to make my job easier- and usally still override styles myself ... if the original styles piss me off. But I do not stick with one because "It's bad form to use both" I just stick with one for that reason mentioned above. I'd actually say if bandwidth is not an issue- it's quality to use both- but only use the parts of them that you actually use.

(我注意到有人曾经导入完整的jQuery，当时他们从中使用的唯一东西是$ .ajax(尽管很多，但仍然如此)……我想……那不是矫kill过正?！) -因此，如果您同时使用两者并希望保持精简-只需确保在编译时就导入了您正在使用的内容即可.用Python的方式来说，我是说-永远不要从模块中使用import *(但是，您可以将Java语言作为一种概念来表达-webpack/gulp/whomever应该为您解决大部分问题).假设您使用的是ES6/7样式的Javascript.

(I noticed someone once importing full jQuery when the only thing that they used from it was $.ajax (all be it a lot but still) ... I was like... is that not overkill?!) -- So if you use both and want to keep things slim- just make sure on compilation you're only importing what you're using. Pythonically I'm saying- never use import * from module (however you express that in Javascript as a concept - webpack/gulp/whomever should take care of most of that for you). Assuming you're using ES6/7 style Javascript.

这篇关于Bootstrap与Material UI for React?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！