Episode Details

Scott and Wes explore UI Components, discussing functionality, styling, accessibility, and theming. From headless components to styled starters, they share valuable insights to elevate your UI game.

• 00:00 Welcome to Syntax!
• 02:39 We’re on YouTube.
• 03:14 The four categories of UI libraries or frameworks.
• 03:46 What does a UI component need to do?
  • 04:14 Must be functional.
  • 06:20 They must fit styling.
  • 06:33 They must be accessible.
  • 08:09 “Internationalizationable.”
  • 09:29 They must handle theming and variants.
• 10:05 A few common UI components.
  • 10:14 Date Pickers.
  • 12:10 Dropdowns.
  • 13:21 Toast message.
  • Svelte French Toast
  • 15:11 Some honorable mentions.
• 16:10 Headless components.
  • 18:54 React Aria.
  • Behavior, Accessibility, Internationalization
  • 19:34 Radix UI Primitives.
  • 20:16 Downshift JS.
  • 21:29 Tanstack Table and Forms.
• 26:00 Unstyled components.
  • 28:04 Shoelace.
  • 32:47 React Aria Components.
  • 33:00 Headless UI.
  • 33:04 Radix UI.
  • 37:12 Base UI.
• 38:23 What’s up with Google’s design?
• 40:22 Styled Starters.
  • React Aria Components Starter
  • ShadCN
  • Tailwind Catalyst
  • MeltUI
• 47:50 What is the process for overriding with custom elements.

• Listen Now