---
title: "What do you want to build?"
description: "Start with the job you need to do. You do not need to know a library's name."
pagination: false
---

{/* Generated from content/. Edit the catalog, not this page. */}

## Build interfaces

**[Format a date](/tasks/format-a-date)**

Format, parse, and work with dates across locales and timezones.

**[Build a sortable list](/tasks/build-a-sortable-list)**

Reorder a list, move cards between columns, or build a custom drop interaction.

**[Explore a large dataset](/tasks/explore-a-large-dataset)**

Display a large dataset in a table with search, sorting, filtering, and editing.

**[Build a form](/tasks/build-a-form)**

Manage form state, validate fields, and guide users through submissions.

**[Choose and enter values](/tasks/choose-and-enter-values)**

Collect values with selects, autocomplete, sliders, tags, and specialized inputs.

**[Choose a date or schedule events](/tasks/choose-a-date-or-schedule-events)**

Select dates and ranges, display appointments, and navigate event calendars.

**[Build a consistent interface](/tasks/build-a-consistent-interface)**

Find complete component libraries, headless primitives, and copyable UI blocks.

**[Style and theme components](/tasks/style-and-theme-components)**

Compose CSS classes, create design tokens, and build reusable component styles.

**[Arrange a workspace](/tasks/arrange-a-workspace)**

Create resizable panels, responsive layouts, and growing content grids.

**[Show contextual controls](/tasks/show-contextual-controls)**

Build dialogs, contextual menus, popovers, and anchored tooltips.

**[Show progress and feedback](/tasks/show-progress-and-feedback)**

Display toasts, loading indicators, desktop alerts, and browser push notifications.

**[Add interface icons](/tasks/add-interface-icons)**

Find reusable icon collections and React icon components.

## Add interactions

**[Animate an interaction](/tasks/animate-an-interaction)**

Create transitions, gesture effects, parallax, and expressive interface elements.

**[Present interactive media](/tasks/present-interactive-media)**

Display galleries, play audio, generate video, and process images.

**[Build a visual canvas](/tasks/build-a-visual-canvas)**

Create drawings, diagrams, shader effects, and three-dimensional interactions.

**[Visualize a dataset](/tasks/visualize-a-dataset)**

Explain data with charts, heatmaps, timelines, and custom visualizations.

**[Show locations on a map](/tasks/show-locations-on-a-map)**

Render maps, place markers, and work with location or postal data.

**[Let users edit content](/tasks/let-users-edit-content)**

Add rich-text, Markdown, JSON, and code-editing experiences.

**[Explain code visually](/tasks/explain-code-visually)**

Highlight source code and create annotated or animated walkthroughs.

**[Search a collection](/tasks/search-a-collection)**

Find approximate text matches, index documents, and build suggestion interfaces.

**[Add a command palette](/tasks/add-a-command-palette)**

Bind shortcuts and build keyboard-friendly command interfaces.

**[Control a scrolling view](/tasks/control-a-scrolling-view)**

Bring content into view and customize scroll containers.

**[Guide a new user](/tasks/guide-a-new-user)**

Introduce features with guided tours and multi-step onboarding.

**[Render rich content](/tasks/render-rich-content)**

Highlight matching text, balance headings, and embed external content.

**[Preview a shared link](/tasks/preview-a-shared-link)**

Generate social-sharing images and display cards for pasted URLs.

## Manage application data

**[Share application state](/tasks/share-application-state)**

Coordinate local state, shared stores, URL state, and persistent client data.

**[Fetch and update server data](/tasks/fetch-and-update-server-data)**

Call APIs, manage cached responses, and connect interface actions to the server.

**[Navigate between screens](/tasks/navigate-between-screens)**

Connect URLs, navigation state, and application rendering.

**[Validate incoming data](/tasks/validate-incoming-data)**

Check forms, API payloads, and configuration against explicit schemas.

**[Make application logic type-safe](/tasks/make-application-logic-type-safe)**

Express complex types, test declarations, and model application logic.

**[Transform application data](/tasks/transform-application-data)**

Reuse helpers for collections, identifiers, browser behavior, and React integrations.

**[Move structured data](/tasks/move-structured-data)**

Serialize richer JavaScript values and prepare JSON payloads.

**[Translate an application](/tasks/translate-an-application)**

Organize localized messages and language-specific routes.

**[Keep an interface responsive](/tasks/keep-an-interface-responsive)**

Virtualize long lists, reduce repeated work, and inspect rendering costs.

**[Import or export a file](/tasks/import-or-export-a-file)**

Upload files, export CSV, create archives, and work with file paths.

## Connect services

**[Add user accounts](/tasks/add-user-accounts)**

Integrate sign-in, sessions, organizations, and enterprise identity.

**[Handle untrusted input safely](/tasks/handle-untrusted-input-safely)**

Sanitize markup and work with password hashing or cryptographic formats.

**[Store and query records](/tasks/store-and-query-records)**

Choose a database platform, query builder, or object-relational mapper.

**[Add backend capabilities](/tasks/add-backend-capabilities)**

Add databases, content management, APIs, storage, and realtime features.

**[Build an HTTP or realtime service](/tasks/build-an-http-or-realtime-service)**

Handle requests, create WebSocket services, and collect webpage data.

**[Run work in the background](/tasks/run-work-in-the-background)**

Schedule recurring tasks, queue jobs, process webhooks, and offload computation.

**[Deploy an application](/tasks/deploy-an-application)**

Host frontends, run server applications, and configure cloud infrastructure.

**[Build an email template](/tasks/build-an-email-template)**

Compose reusable email interfaces from application components.

**[Build a checkout or subscription flow](/tasks/build-a-checkout-or-subscription-flow)**

Connect storefronts, payments, billing, and customer conversations.

**[Understand product usage](/tasks/understand-product-usage)**

Explore traffic, session behavior, and product adoption.

**[Build an AI-powered feature](/tasks/build-an-ai-powered-feature)**

Connect models, create chat interfaces, and automate tasks with AI.

## Build and ship

**[Design and test an API](/tasks/design-and-test-an-api)**

Describe API contracts, inspect requests, generate clients, and publish references.

**[Test a user workflow](/tasks/test-a-user-workflow)**

Automate browsers, compare screenshots, mock APIs, and generate fixtures.

**[Understand and improve a codebase](/tasks/understand-and-improve-a-codebase)**

Inspect components, analyze dependencies, generate files, and apply code checks.

**[Investigate application failures](/tasks/investigate-application-failures)**

Collect structured logs, track errors, and inspect recorded sessions.

**[Build a command-line workflow](/tasks/build-a-command-line-workflow)**

Parse arguments, prompt users, run processes, and format terminal output.

**[Build and run a project](/tasks/build-and-run-a-project)**

Bundle code, analyze builds, and coordinate development processes.

**[Publish a library](/tasks/publish-a-library)**

Build packages, inspect dependencies, validate exports, and automate releases.

## Explore the ecosystem

**[Start an application](/tasks/start-an-application)**

Compare application frameworks, starter kits, and specialized project scaffolds.

**[Share code across platforms](/tasks/share-code-across-platforms)**

Build native-style applications and coordinate shared web and mobile behavior.

**[Publish a documentation site](/tasks/publish-a-documentation-site)**

Create documentation, technical blogs, and navigable Markdown content.

**[Study a complete application](/tasks/study-a-complete-application)**

Explore real applications and reference implementations.

**[Learn a development concept](/tasks/learn-a-development-concept)**

Find documentation, tutorials, architecture examples, and practice resources.

**[Connect with other developers](/tasks/connect-with-other-developers)**

Find technical communities, discussion spaces, and developer publishing platforms.
