The building blocks of your front-end
セクションにリンクUI Libraries Ratios Over Time
UI Libraries Ratios Over Time
MUI(別名Material UI)は使用率では依然としてトップですが、shadcn/uiも急速に成長しており、トップの座を奪おうとしています。
セクションにリンク項目数
項目数
ユーザーの大部分はコンポーネントライブラリを全く使用していません。一方で、使用している人は複数のオプションを試している傾向があります。これは、この分野は勢力図がかたまっていなく、新規参入者が存在感を示す余地がまだあることを示唆しています。
💡
技術名をクリックすると、その技術の詳細や、より細かい関連データを見られます。
セクションにリンクOther UI Libraries
Other UI Libraries
Base UIは、非常に競争の激しいヘッドレスUIライブラリ分野への新たな参入者です。ヘッドレスUIとは、コンポーネントの挙動のみを提供し、スタイリングについては開発者に委ねるライブラリのことです。そして、開発チームには多くのRadixのベテランがいるため、この種のライブラリを求めているのであれば間違いなくチェックする価値があります。
What other component libraries have you used?
Freeform
Multiple
セクションにリンクAnimation
Animation
すべてのプロジェクトが派手なアニメーションを必要とするわけではありませんが、必要とする人にとってMotionは有力な選択肢として確立されています。
Which animation libraries have you used?
Multiple
セクションにリンクData Visualization
Data Visualization
React専用のチャートライブラリではないにもかかわらず、Chart.jsは依然としてランキングのトップにいます。
ここにあるチャートに何のライブラリを使っているか、当ててみますか?実はこれ、ひっかけ問題なんです。全部一から手でコーディングして作ったものなんですよ!
Which data visualization and graphics libraries have you used?
Multiple
セクションにリンクForm Libraries
Form Libraries
フォームの扱いが好きな人はいませんが、避けられない場合、React Hook Formsを使うことで苦痛をはるかにやわらげてくれます。
Which libraries have you used to manage forms?
Multiple
セクションにリンクForm Patterns
Form Patterns
制御されたフォームコンポーネントと制御されていないフォームコンポーネントをめぐる議論は、実際には議論にすらなっていません。多くの回答者は状況に応じて両方のパターンを使い分けていますが、選択する必要がある場合、制御されたフォームの方が圧倒的に支持されています。
Which form pattern do you usually prefer using?
セクションにリンクCSS Tools & Libraries
CSS Tools & Libraries
CSS-in-JSは15分間は世界的な有名人でしたが、Tailwindの登場と、ここ数年でのCSS自体の大幅な改善により、その人気に大きな打撃を与えました。
Which libraries or frameworks have you used to style your React apps?
Multiple
セクションにリンクComponent Pain Points
Component Pain Points
開発者はTailwindと愛憎の関係にあるようで、一部の人はそれを問題点として挙げている一方で、UI開発の悩みを一掃してくれる救世主だと考える人もいます。
What pain points have you encountered related to working with components?
Freeform
Multiple
セクションにリンクおすすめのリソース
おすすめのリソース
Enterprise UI Development: Testing & Code Quality
Learn unit testing with Vitest, continuous integration via GitHub Actions, component and accessibility testing with Axe, mocking techniques, and code standard enforcement using ESLint and Husky & Lint-Staged.
The Hard Parts of UI Development
Develop an under-the-hood knowledge of UI dev by learning techniques such as data binding, UI composition, templating, virtual DOM and its reconciliation, and hooks, all from scratch!
パートナーのサポートに感謝しています! 詳細をみる。