profile

Build UI

by Sam Selikoff

Subscribe to stay updated on all the latest content from Build UI.

Posts
Featured Post

🎥 Instant Search Params with React Server Components

Learn all about Search Params with React Server Components in our latest blog post, and check out our most recent podcast episode for our thoughts on React 19's upcoming features. Instant Search Params with React Server Components Read now → Out-of-order streaming in React Watch now → Asset loading in React Watch now → Podcast - Blog Post Club: React Labs – What We’ve Been Working On Watch now → Podcast - Instant URL search params in Next.js Watch now → Podcast - React Deep Dive:...

about 2 months ago • 1 min read

Dive into free videos on Radix, Remix, and Server Components, and catch our latest podcast episode where we talk through React's new cache function. Building an Elastic Slider with Framer Motion and Radix Watch now → Why you can't set cookies in Server Components Watch now → React's new cache function Watch now → Optimistic UI in Remix Watch now → Podcast - React Cache Deep Dive Watch now → Podcast - Advanced Radix UI and Blog Post Club React Server Watch now → And in case you missed it, last...

3 months ago • 1 min read

Hey there! I've got some exciting news to share today: Advanced Radix UI – my newest course – is now live! Clocking in at 2 hours and 13 minutes across 35 chapters, you’ll learn how to use Radix to build four completely custom UI components: a Switch, a Selector Group, a Toast, and a Slider: Each component has a completely custom design using Tailwind, and there's also some slick animation and interactions we build with React and Framer Motion to enhance what Radix gives you out of the box....

3 months ago • 1 min read

I'm wrapping up our Radix course and came across a neat use case for Tailwind's new `has` modifier. If you haven't used it yet, `has` lets you style parent elements based on the state of their children: Here we're giving the root div a green border if it has any children in the :checked pseudostate. Pretty neat! So this came up when I was working on the focus state for my Radix <Slider> demo. Typically sliders render a <Thumb> control, which is perfect for showing focus: But this demo doesn't...

4 months ago • 1 min read

Happy Friday! We've been working hard on our Radix UI course and I wanted to share a slick hidden feature I discovered while building out this demo: The demo is built with Radix's <Switch> component. When you render a <Switch> by itself, here's the HTML you get: <Switch.Root> renders a button with all the proper ARIA Switch attributes, and <Switch.Thumb> includes the checked state via a data attribute. Neat! But look what happens if we wrap it in a <form>: <Switch> has automatically detected...

4 months ago • 1 min read

Hey! We've been working on some demos for our newest course, and we wanted to share this slick Animated Toast component we just finished: It's built with Radix, Tailwind CSS, and Framer Motion. Three different libraries, each tackling one concern – behavior, styling, and animation – but all composing together for one seamless developer experience. This is why we love Radix. Sure, there are libraries that give you a single <Toast> you can drop into your app. But as soon as you want to change...

5 months ago • 1 min read

Hey there, We've got some exciting news today! Ship an app with Remix – our latest course – is now fully complete! Clocking in at exactly 5 hours across 19 lessons, you’ll learn how to build a full-stack Work Journal application using Remix. I got the idea for this project from my own work journal that I made for my personal site. It's been a useful tool over the years to document my journey as a developer, and it's a fun way to share weekly updates with other folks. When I started using...

6 months ago • 2 min read

Happy Wednesday! Last week we finished Build UI's third complete course, Data fetching with React Server Components: In 9 lessons you'll learn the fundamentals of how to fetch data in a Next.js app using React Server Components. You'll build a URL-driven data table that supports searching and pagination, just the kind of thing that you'd see in a typical dashboard application. You'll also see how this new paradigm lets you interleave client-side features (like providing instant feedback after...

7 months ago • 1 min read

Happy Wednesday! We've got some exciting news today – our Data fetching with React Server Components course is now fully complete! In 1 hour and 15 minutes you’ll learn how to build a server-driven data table with React Server Components. I got the idea for this course from a Next.js dashboard app I work on. It's filled with data tables that have pagination, searching, and filtering. Originally I built these tables with client-side React, but six months ago I refactored them using React...

7 months ago • 3 min read

This week we've got three new lessons on Build UI – all free to watch from now through Sunday, no login required. We also have a new YouTube video on using Tailwind and Framer Motion together, and two new code recipes. Adding Loading UI Watch now → Adjusting the loading boundary Watch now → Adding an authenticated state Watch now → Responsive Framer Motion with Tailwind CSS Watch on YouTube → Highlight Apply a temporary visual treatment whenever a React prop changes. View the code → Animated...

8 months ago • 1 min read
Share this page