UI / Frameworks interview questions

Build an accordion component with stacked sections whose content panels expand and collapse on click.

Build a row of overlapping avatars that collapses the overflow into a plus-N badge.

Build an autocomplete input that filters a static list and lets you pick a suggestion.

Build a breadcrumb trail from a path array, separating crumbs and marking the current page.

Build a textarea with a live character counter that warns as it nears a maximum length.

Build a swatch color picker where clicking a swatch selects it and previews the chosen color.

Build a contact form that posts the user's name, email, and message to a backend endpoint.

Build a button that copies text to the clipboard and shows a transient copied confirmation.

Build a countdown timer that ticks down from a start time and can start, pause, and reset.

Build a counter component that increments a displayed number each time a button is clicked.

Build a list of FAQ questions that each expand to reveal an answer on click.

Build a small form that books either a one-way or return flight, with validation tying the two date fields together.

Build a component that renders a table of sequential numbers given a row count and a column count.

Build the classic holy grail page layout with a header, footer, and three columns of content.

Build a Like button that toggles between liked and unliked states with matching visual feedback.

Build a reusable modal dialog component that you can open from a trigger and close with a button.

Build a calculator that computes the monthly payment for a loan based on principal, rate, and term inputs.

Build pagination controls with previous/next and numbered pages that report the current page.

Build a password field with a live strength meter that scores the input as you type.

Build a progress bar component that visualizes the percentage completion of an operation.

Build a component that renders a list of progress bars which animate from empty to full as they mount.

Build a segmented control where clicking a segment selects it and highlights the active option.

Build a widget that converts between Celsius and Fahrenheit, updating either field as the other changes.

Build a toast that appears on trigger and auto-dismisses after a few seconds, with manual close.

Build an on/off toggle switch that flips state on click and slides its knob to reflect it.

Build a tooltip that shows on hover/focus of a trigger and hides on leave/blur.

Build a traffic light that cycles green to yellow to red on a timer and loops indefinitely.

Build a static tweet component that mirrors the layout of a single post on Twitter.

Build an accordion component with the correct ARIA roles, states, and properties for screen readers.

Build an analog clock whose hour, minute, and second hands move smoothly to reflect the current time.

Build an autocomplete that debounces typing, fetches matching results from an API, and handles loading and stale responses.

Build an image carousel that auto-advances on a timer, pauses on hover, and has manual controls.

Build a widget that fetches birth year data from an API and renders it as a histogram of bucketed counts.

Build an editable combobox that filters options as you type and supports full keyboard selection.

Build a keyboard-driven command palette with fuzzy search and arrow-key navigation.

Build a two-player Connect Four game where discs fall to the lowest empty slot and four-in-a-row wins.

Build a currency converter with two linked amount fields that recompute from an exchange rate.

Build a users data table that paginates rows with page-size and page-navigation controls.

Build a users data table that lets you sort by any column in ascending or descending order.

Build a calendar date picker that renders a month grid, navigates between months, and selects a day.

Build a dice roller that lets you pick a count of six-sided dice, roll them, and display the resulting faces.

Build a 7-segment style digital clock that updates to display the current time.

Build an accessible dropdown menu that opens on click, closes on outside-click and Escape, and supports arrow-key navigation.

Build an emoji picker with category tabs and a search filter that inserts the chosen emoji.

Build a file explorer that renders a nested folder hierarchy and lets you expand and collapse directories.

Build a file explorer that exposes the correct ARIA tree roles, states, and properties for assistive tech.

Build a file explorer that renders the tree as a flat DOM list while preserving nested visual structure.

Build a grid of cells that light up on click and then deactivate one by one in the reverse order they were activated.

Build a contribution-style heatmap calendar that colors each day cell by its activity value.

Build an image carousel that lets you page through a sequence of images with previous and next controls.

Build an image carousel with smooth slide transitions between images.

Build a list that loads more items as the user scrolls near the bottom using an observer.

Build a job board that fetches and renders recent Hacker News job postings with paginated loading.

Build a three-column board where cards drag between columns and each column's count updates.

Build a memory card-matching game where players flip cards to find matching pairs.

Build a modal dialog with the correct ARIA roles, states, and properties for assistive technology.

Build a modal dialog that closes via the close button, backdrop click, and the Escape key.

Build a multi-select where chosen options become removable chips and the rest stay in the list.

Build a wizard form with next/back navigation, per-step validation, and a progress indicator.

Build a threaded comments tree where each comment can be replied to and collapsed recursively.

Build a notification center with an unread badge, mark-as-read, and dismiss.

Build a one-time-code input of separate boxes with auto-advance, backspace, and paste handling.

Build a pixel art editor where you pick a color from a palette and paint individual cells on a grid canvas.

Build a list of progress bars that fill in sequence, each one starting only after the previous bar finishes.

Build a list of progress bars that fill concurrently with at most three running at the same time.

Build a dual-handle range slider that picks a min and max value by dragging each handle.

Build two panes split by a draggable divider that resizes them within min and max bounds.

Build a cart where quantity changes update line totals and a grand total live.

Build a signup form that validates user details on submit and posts them to a back-end API.

Build the classic snake game on a grid with keyboard control, growth on eating, and game over.

Build a list whose items reorder by dragging, with a live drop indicator.

Build an interactive star rating with hover preview and half-star support.

Build a star rating component where users click a star to set the rating shown by filled icons.

Build a stopwatch widget that measures elapsed time with start, stop, and reset controls.

Build a tabs component that shows one panel at a time based on the currently selected tab.

Build a tabs component with the correct ARIA roles, states, and properties for assistive tech.

Build a two-player tic-tac-toe game that detects wins and draws on a 3x3 board.

Build a Todo List component with add and delete actions, with focus on functionality over styling.

Build a component that moves selected items back and forth between two side-by-side lists.

Build a counter that keeps a history of values so you can undo and redo each change.

Build a CRUD interface to list, filter, create, edit, and delete users backed by local state.

Build the arcade game where moles randomly appear in a grid and players click them to score.

Build a fully accessible accordion with keyboard navigation per the ARIA authoring practices guide.

Build a six-cell auth code input that handles typing, paste, backspace, and arrow-key navigation across fields.

Build a production autocomplete with async fetch, debounce, keyboard navigation, caching, and match highlighting.

Build a week-view scheduler where events render in time slots and can be added by clicking a slot.

Build a generic, reusable data table that supports column-driven sorting and pagination for any dataset.

Build a generalized data table component that supports pagination, column sorting, and per-column filtering.

Build a data table with sortable columns, pagination, and row selection over a dataset.

Build a Gantt chart that renders tasks as bars positioned across a timeline by start and duration.

Build an image carousel that smoothly transitions between images while keeping the DOM footprint minimal.

Build an image cropper with a draggable, resizable crop region over an image.

Build a collapsible tree that lazily loads a node's children the first time it is expanded.

Build Minesweeper with flood-fill reveal, flagging, and win/lose detection.

Build a fully accessible modal dialog with focus trapping, focus restoration, and keyboard support.

Build a nested checkbox tree where parent state reflects its children and toggling a parent cascades down.

Build progress bars that fill concurrently up to three at a time, and let the user pause and resume each one.

Build a search box that caches results per query and dedupes in-flight requests.

Build a contenteditable rich-text editor with bold/italic/list formatting and a live toolbar state.

Build a grid where you click and drag across cells to select a rectangular range of them.

Build a grid of cells with formula evaluation and dependent-cell recalculation.

Build a fully accessible tabs component with arrow-key navigation per the ARIA authoring guide.

Build Tetris with falling tetrominoes, rotation, line clears, and scoring.

Build a generalized tic-tac-toe game on an N x N board where M consecutive marks wins.

Build a transfer list with bulk select, deselect, and the ability to add new items to either side.

Build a windowed list that renders only the visible rows of a large dataset for smooth scrolling.

Build the Wordle word-guessing game with row-by-row guesses and per-letter color feedback.