programing

React를 위한 부트스트랩과 머티리얼 UI의 비교

instargram 2023. 3. 18. 08:16
반응형

React를 위한 부트스트랩과 머티리얼 UI의 비교

프로젝트에서는 두 가지를 모두 사용하고 있으며 부트스트랩 컴포넌트 내에서 머티리얼 UI 컴포넌트를 사용해야 하는 경우가 있어 UI가 예상대로 표시됩니다.그러나 나는 이 접근방식을 사용하지 말 것을 충고받았다.둘 다 그리드를 사용하고 있어 굴곡할 수 있는 이유가 있습니까?

저는 장황한 편이기 때문에 간결하게 대답하겠습니다.

결론:

두 가지를 모두 사용하는 것이 나쁘다고 말한 사람은 자신의 의견을 표현하는 것일 수 있습니다. 실제로는 두 가지를 모두 사용하는 것이 디자인하는 데 있어서 문맥이 매우 부족하다고 말합니다.@user3770494는 매우 좋은 지적입니다.그러나 빌드 크기에 대해서는 타당하고 알기 쉬우나 어플리케이션의 범위에 따라 다릅니다.파이버 네트워크에 접속되어 있는 모든 사람이 로컬로 접속되어 있는 사내 어플리케이션이라면, 어쨌든 모두 메모리에 캐시되어 있을 것입니다.그러나 (당신이 나를 아는 것은 아닙니다) MAJOR 백만 명의 사용자 애플리케이션이 모바일(매우 낮은 디바이스), 데스크톱 및 기타 전 세계 디바이스에서 실행되고 실시간(약) 업데이트가 필요한 경우, 그리고 언제든지 10,000 명의 활성 사용자가 있는 스트리밍 다이내믹 콘텐츠를 24시간 365일 사용할 수 있는 경우를 제외하고, 이러한 애플리케이션을 함께 사용한다고 해서 부정적으로 판단하지는 않을 것입니다.

사실, 삶과 죽음이 아니라면 둘 다 사용하고 네 것도 할 수 있어개인의 성장을 위해서 「단일 솔루션에 전념한다」보다, 복수의 것을 이해하는 것이 더 좋습니다.


나머지 내용은 옵션입니다.천만에요:)

저는 개인적으로 프로덕션 애플리케이션(동반독립)에 모두 사용하였습니다.저는 이 모든 것을 처음부터 해왔습니다.(CSS는 제가 하는 일에서 가장 싫어하는 부분입니다.다행히 그것을 잘하는 동료가 있습니다.)다음은 제 생각입니다.

경고:저는 장황한 편이에요.

면책사항:

형태보다 기능을 좋아하는 사람으로서, 형태는 고객이 사소한 변경에 대해 질문하는 것을 까다롭게 하는 잔상입니다.「각 선택사항의 느낌」에 대해서는, 가능한 한 의견을 피하려고 합니다.

또, 현재의 선택에서는, ReactJs/create-react-app을 사용해 터치 스크린 전용의 「데모」프로젝트를 만들고 있습니다.따라서, 실제로 어떠한 조작도 실시하지 않는 데모(CCScanner, 바코드 스캐너, GPS, Web 카메라 통합등)를 위한 6개의 모의 프로그램을 전개합니다.그래서 저는 이 "지루하고 재미로 pi3b+ 보드를 얻었기 때문에"를 위해 무엇을 해야 할지 알아보고 있습니다.

답변:

  • 시간, 헌신, 자원이 있다면, 그것들을 함께 섞는 것은 전혀 문제될 것이 없습니다.하지만 당신은 단지 그것의 시간/비용/베니핏에 대해 생각할 필요가 있다.DIY를 통해 최종사용자가 만족할 수 있습니다.혼재하는 경우에도 마찬가지입니다.휠을 리메이크하고 있지만 부스트랩 스타일 등은 언제든지 사용할 수 있습니다.

  • 본래의 리스크는, 어느쪽인가를 「혼합」하지 않게 하는 것입니다.그것은 어느쪽이든 버전을 변경하려고 하면 항상 문제가 생기기 때문입니다.

  • 나는 많은 재료를 좋아한다.UI도 그렇지만, 솔직히 몇 가지 (디폴트로는 스타일리시함)가 마음에 들지 않습니다.기능적으로는 부트스트랩보다 마음에 들지만, 동시에 재료는 좋아하지 않습니다.UIs React 프로그래밍 스타일(CSS를 싫어하는 순수주의자로서! ever ever ever...를 사용해야 하는 것은 크고 큰 nononononononon입니다)은 동료와 제가 컨벤션에서 사용하는 방법과 비교됩니다.내 취향보다 좋거나 나쁘다고 말하는 것이 아니라, 그것에 대해 몇 가지는 정말 짜증난다(좋은 이유가 있다고 해도).

  • Bootstrap에는 많은 선택지가 있습니다.Resact JS와의 연계도 좋지만 리액트스트랩과 리액트 부트스트랩의 차이도 있습니다(그래서 이 데모에 어떤 것을 사용해야 할지 고민하고 있는 당신의 글을 발견했습니다).

  • 최근에는 (생산 프로젝트의 경우) 한 가지 방식만 고집하려고 하지만, 보통은 형태가 아닌 기능을 하는 시스템을 만들고 있습니다.따라서 UI 요소는 그다지 신경 쓰지 않고 예쁘게 만들지 않는 것이 중요합니다.그래서 저는 일을 더 쉽게 하기 위해서 한 가지를 계속 사용하고 있습니다.그리고 보통 여전히 제 스타일을 무시합니다.원래 스타일이 저를 짜증나게 한다면요.다만, 「둘 다 사용하는 것은 좋지 않다」라고 하는 이유로, 한쪽을 고집하는 것은 아닙니다.대역폭이 문제가 되지 않는다면, 둘 다 사용하는 것이 품질이지만 실제로 사용하는 부분만 사용합니다.

(한 번은 풀 jQuery를 Import한 적이 있습니다.그때 사용한 것은 $.ajax뿐이었습니다(많지만 그래도).난…...이 두 가지를 모두 사용하여 슬림하게 하고 싶다면 컴파일을 할 때 사용하는 것만 Import하도록 하세요.Pythonic하게 말하자면, "import * from module" (하지만 Javascript에서는 "webpack/gulp/whoors"라는 개념으로 표현하고 있습니다) "webpack/gulp/whoors"가 그 대부분을 담당합니다."ES6/7 스타일의 Javascript를 사용하고 있다고 가정합니다.

최근에 이 시나리오를 접한 적이 있으며, 특정 작업을 제외하고 둘 다 사용하기로 결정했습니다.Bootstrap은 응답성이 뛰어난 웹 앱이기 때문에 레이아웃과 위젯에 재료 UI를 사용하는 것이 가장 현명했습니다(개인적인 취향입니다).

반드시 둘 다 사용할 수 있지만 다음 사항에 유의해야 합니다.

  • 각 라이브러리에서 요소를 신중하게 선택하여 관리하는 데 시간과 노력을 들이지 않는 한 제공되는 기능에는 중복이 많이 발생합니다.그리고 심지어 당신은 겹치는 것을 피할 수 없는 상황에 직면하게 될 것이다.이는 기본적으로 더 큰 번들로 이어집니다.
  • 두 시스템이 앱 전체에서 일관된 프레젠테이션을 하려면 주제 변수를 유지해야 합니다.그래도 테이블 확인란이 다른 라이브러리의 확인란과 다르게 보일 수 있습니다.
  • 두 시스템을 모두 배우고 이해해야 합니다.그것은 때때로 특정 버그의 원인을 찾는 것이 더 힘들다는 것을 의미합니다.또한 어떤 컴포넌트에 어떤 라이브러리를 사용할지 결정하는 데 더 많은 시간을 할애할 수 있습니다.

전체적으로 보면, 2개의 다른 시스템으로 작업하는 것이 더 중요하기 때문에, 일관성이 없어 보일 가능성이 높아집니다.그렇다고는 해도, 그리드 시스템 등, 제한적으로 혼재하는 것도 나쁘지 않을지도 모릅니다.

가능하다면 한 가지 시스템을 선택하여 계속 사용하시기 바랍니다.

둘 다 사용하면 생산 js 사이즈가 커집니다.

머티리얼 Ui와 부트스트랩은 모두 버튼과 같은 기본 스타일의 컴포넌트를 제공하므로 선택해주세요.

부츠랩 그리드는 구조에만 사용할 수도 있고 플렉스에도 사용할 수 있습니다.

언급URL : https://stackoverflow.com/questions/50831331/bootstrap-vs-material-ui-for-react

반응형