Component Library

React's Context API provides a way to pass data through the component tree without manually threading props through every intermediate level. You create a context with `createContext`, wrap a subtree with a `Provider`, and consume the value anywhere below with `useContext`. It's ideal for global concerns like themes, authentication state, or locale, but should be used judiciously since any change to context value re-renders all consuming components.

Semantic HTML means using HTML elements that clearly describe their meaning and purpose, such as `<article>`, `<nav>`, `<header>`, and `<section>`, instead of generic `<div>` tags. This practice improves accessibility for screen readers, boosts SEO by helping search engines understand page structure, and makes code far more readable for other developers. It's considered a foundational best practice in modern web development.

Deep linking is the ability to direct users to a specific screen or content within a mobile or web application via a URL, rather than just opening the app's home screen. In React Native and Flutter, this involves configuring URL schemes (e.g., `myapp://profile/123`) or universal/app links that work across platforms. Deep linking is essential for push notification routing, marketing campaigns, sharing content between users, and creating seamless web-to-app transitions.

CSS Animation uses `@keyframes` rules and the `animation` property to create complex, multi-step animations entirely in CSS without JavaScript. Combined with CSS transitions for simple state changes, these tools handle most UI animation needs performantly since browsers can optimize them on the GPU compositor thread. Properties like `transform` and `opacity` are particularly efficient to animate because they don't trigger layout recalculations or repaints.

CSS Custom Properties (also called CSS Variables) let you define reusable values with `--my-variable` syntax and reference them anywhere using `var(--my-variable)`. Unlike preprocessor variables in Sass or Less, they are live in the browser, cascade through the DOM, and can be updated dynamically with JavaScript. They're essential for theming systems, dark mode implementations, and maintaining consistent design tokens across large stylesheets.

Drag and drop is an interaction pattern that lets users move, reorder, or transfer UI elements by clicking (or touching), holding, and dragging them to a new position. It's used for file uploads, kanban boards, sortable lists, and layout builders. The HTML Drag and Drop API provides native browser support, while libraries like dnd-kit and react-beautiful-dnd offer more polished, accessible, and touch-friendly implementations.