Real-World React Examples: Apps, Websites & Open-Source Projects Built with React

Most “React examples” lists are really template galleries. This one is different. Below are real products you use every day, production websites, and open-source projects whose source code you can actually read — all built with React. It’s the fastest way to see what React looks like at scale, borrow proven patterns, and decide how to structure your own app.

We’ve grouped them into three lenses: household-name apps, marketing and commerce websites (mostly on React’s most popular framework, Next.js), and open-source repositories you can clone and study line by line. If you just want a head start on your own build, jump to the React admin dashboard templates at the end.

Apps and products built with React

React was created at Facebook to solve exactly this problem — keeping a fast, complex interface in sync with constantly changing data. A decade later it powers a huge share of the apps you open daily. Here’s what’s actually React in each one.

Facebook and Instagram

The original React example. Meta built React for Facebook’s web interface and still uses it across the product, and Instagram’s web app is built with React too — component-based rendering keeps image-heavy feeds, stories, and reels updating without full page reloads. If you want to see React’s design philosophy applied at the largest possible scale, this is it.

WhatsApp Web

WhatsApp Web mirrors the mobile messaging experience in the browser using React, handling real-time message delivery, contact lists, and media sharing as reactive components. It’s a clean example of a real-time app where state changes constantly and the UI has to keep up.

Netflix

Netflix uses React across its web experience, notably on the server to pre-render HTML for fast first loads. It’s also famous for a performance lesson worth learning: on some pages the team trimmed client-side React in favor of vanilla JavaScript to cut the bundle and speed up interaction. A great reminder that “built with React” doesn’t mean “ship React everywhere.”

Discord

Discord’s web and desktop clients are built with React, coordinating a genuinely hard state problem — channels, voice indicators, server lists, and inline embeds all updating at once. If you’re building anything real-time and collaborative, Discord is the app to study.

Notion

Notion’s editor is a showcase for component thinking: every block — text, table, kanban, database, calendar — is a React component, which is what makes drag-and-drop composition feel seamless. It’s the go-to example for anyone building a block-based or document-style interface.

Figma

Figma’s toolbars, property panels, and layer management are built with React (the drawing canvas itself runs on WebGL). It’s a strong example of using React for the “chrome” around a high-performance canvas — a pattern you’ll reuse in any design or editor tool.

Stripe

Stripe uses React for its developer dashboard and its interactive documentation, with live code examples and account management wrapped in polished, responsive components. It’s the benchmark for what a developer-facing product built with React can feel like.

Shopify

Shopify’s merchant admin — where millions of store owners manage products and orders — is built with React using its Polaris design system, and its Hydrogen framework (built on React) powers custom storefronts. Polaris is also worth a look as a real, open design system you can learn component API design from.

More products built with React

Once you start looking, React is everywhere. A few more you’ll recognize:

• Reddit — its web redesign is built with React.
• Pinterest — gradually migrated major web surfaces to React for performance and scale.
• Twitch — React drives its dynamic playlists, recommendations, and playback UI.
• Asana — its project-management web app runs on React.
• Trello — React powers its drag-and-drop boards and the real-time updates users expect.
• Jira and Confluence (Atlassian) — React across their web apps.
• PayPal — a React-based implementation of Fluent Design spanning dozens of internal products.
• Khan Academy and Coursera — large learning platforms built with React.
• Cloudflare dashboard — React for its control panel.
• The WordPress block editor (Gutenberg) — built entirely in React. If you edit posts in modern WordPress, you’re already using a React app.

Websites and marketing sites built with React and Next.js

Beyond apps, a huge share of high-traffic marketing and commerce sites run on Next.js, the most popular React framework, which adds server rendering, static generation, and routing on top of React. These are standout examples worth studying for structure, performance, and SEO.

OpenAI

OpenAI’s marketing and product surfaces run on Next.js — a good look at a fast-moving, heavily-trafficked site that stays quick under load thanks to static generation and server rendering.

Anthropic

Anthropic’s site is a clean, content-rich Next.js build — a strong reference for a modern AI-company marketing site with fast pages and sharp typography.

Cursor

Cursor’s marketing site is a polished Next.js example, pairing product storytelling with the kind of fast, animated pages developers expect from a dev-tools brand.

Linear

Linear’s site is a reference for clean, fast, modern React marketing pages — precise typography, subtle motion, and excellent performance.

Framer

Framer — itself a React-based design and site-building tool — ships a marketing site that shows off smooth, interactive React pages built for conversion.

Audible

Audible is a content-heavy commerce site using Next.js for fast, SEO-friendly pages across a huge catalog — a good large-scale e-commerce example.

Hashnode

Hashnode, the developer blogging platform, is built with Next.js and is a nice example of a content platform optimized for performance and reader experience.

More sites built with React and Next.js

Plenty of household names run on the same stack — including Nike‘s global store, Sonos, Hulu, TikTok, Target, Marriott, McDonald’s, Vercel, and Perplexity. The official Next.js showcase is the best living gallery if you want to keep exploring. Browsing a few of these with your dev tools open is one of the best ways to learn how production React sites handle rendering, image optimization, and Core Web Vitals.

Open-source React projects you can learn from

This is where React examples get genuinely useful: real, production-grade apps whose full source code is on GitHub. Instead of a toy to-do app, you can read how experienced teams structure state, components, routing, and data. Here’s an at-a-glance guide, followed by the details.

Project	What it is	Great for studying
Excalidraw	Hand-drawn diagram tool	Canvas work, pragmatic state without Redux
Cal.com	Scheduling (Calendly alternative)	Next.js App Router, monorepo SaaS
Appsmith	Low-code app builder	Organizing a very large React codebase
Twenty	Open-source CRM	Modern React + GraphQL, data-heavy UI
Documenso	Document signing (DocuSign alternative)	Focused full-stack Next.js + Prisma
Formbricks	Survey / experience platform	Clean, approachable TypeScript + Next.js
Sentry	Error monitoring	Large, mature TypeScript React app at scale
Supabase	Backend platform (Studio dashboard)	Data-dense admin UI, real-time features
Grafana	Observability & dashboards	Dashboards, panels, data visualization
Outline	Team wiki / knowledge base	Rich-text and document editing
Backstage	Developer portal platform (Spotify)	Plugin architecture, internal tooling
Rocket.Chat & Element	Team chat platforms	Real-time, message-driven interfaces

Excalidraw

The popular hand-drawn diagram tool, and one of the cleanest examples of a production React app. Modern function components with Hooks and TypeScript, state lifted and persisted to local storage instead of Redux, real tests. Ideal for learning canvas work and pragmatic state management.

Cal.com

An open-source scheduling platform (a Calendly alternative) built on Next.js. A great look at a real SaaS: monorepo structure, the App Router, integrations, and authentication.

Appsmith

A large low-code app builder with a substantial React front end. Good for seeing how a big, long-lived React codebase is organized and kept maintainable.

Twenty

An open-source CRM built with modern React and GraphQL. A clean, current codebase to study for data-heavy interfaces and complex tables.

Documenso

An open-source document-signing tool (a DocuSign alternative) on Next.js and Prisma; a focused, readable full-stack React example.

Formbricks

An open-source survey and experience platform built with TypeScript and Next.js — well-structured, approachable, and a good mid-size codebase to learn from.

Sentry

The error-monitoring product’s front end is a large, mature TypeScript React app (Emotion for styling, react-router, Redux). Excellent for studying React at real scale.

Supabase

Supabase Studio — the dashboard for the popular open-source backend — is built with Next.js. A practical example of a data-dense admin UI with tables, editors, and real-time features.

Grafana

The observability platform migrated its frontend to React; an excellent large-scale example of dashboards, panels, and data visualization.

Umami

A privacy-friendly web-analytics app built with Next.js — small enough to read in an afternoon, real enough to learn from.

Outline

A polished team knowledge base (wiki) built with React, great for studying rich-text and document-editing patterns.

Typebot

A visual chatbot builder built with Next.js — a nice example of a drag-and-drop builder interface with a real backend.

Backstage

Spotify’s open-source developer-portal platform, now widely adopted. A big, influential React codebase built around a plugin architecture for internal tools.

Bluesky

The social app’s front end is built with React (and React Native for mobile via React Native Web), a modern look at a cross-platform, real-time codebase.

Rocket.Chat

A large open-source team-chat platform with a substantial React front end. Like Discord, a strong reference for real-time, message-driven interfaces at scale.

Strapi

The leading open-source headless CMS; its admin panel is built with React and is worth studying for content-management UIs and extensibility.

Medusa

An open-source commerce engine with a React admin dashboard — a good study for product- and order-management interfaces.

Element

A Matrix chat client built with React, another strong reference for real-time messaging and end-to-end-encrypted app UIs.

Plane

An open-source project-management tool (a Jira/Linear alternative) built with Next.js, with a readable, modern codebase.

Tip: clone one or two, run them locally, and trace a single feature end to end — how a click flows through components, state, and the API. That single exercise teaches more than a dozen tutorials. For a broader view of the ecosystem these apps lean on, see our guide to React UI frameworks.

React example and starter projects for learning

If you’re earlier in the journey and want smaller, purpose-built examples to learn from, start here:

• RealWorld (“Conduit”) — a Medium-style app built to one shared spec across dozens of frameworks. The React implementations are perfect for comparing patterns and seeing a complete, realistic app rather than a snippet.
• The official React examples — the interactive tutorials and example projects in the React documentation are the canonical, up-to-date starting point for core concepts.
• TodoMVC and small build-alongs — humble but effective for isolating one idea (state, forms, routing) without the noise of a full app.

Want to build your own React app?

Studying real apps is the best way to learn — but when it’s time to ship, you rarely want to start from a blank page. A production-ready template gives you authentication, routing, charts, tables, and dozens of pre-built screens on day one, so you can focus on your product instead of rebuilding the same admin plumbing.

Prefer utility-first styling? Many of the apps above are built with it — see our shadcn/ui templates too.

Frequently asked questions

The best way to learn React is to see it working in the wild — then read the source. Bookmark a few of the open-source projects above, and when you’re ready to build, start from a React admin template instead of a blank page.