NextJS examples: 60 popular websites built with headless CMS  

By Arso Stojović
Read time 10 min
Posted on January 24, 2024
Share it on:
NextJS examples

NextJS examples in this article prove that CMS for NextJS is a great option for building content-driven, high-performance websites.

Headless CMSs separate your content from your presentation, whereas NextJS is a React framework that makes creating server-rendered and static web pages simple.

How to do that?

These 60 examples will resolve the mystery much better than I do.

Let’s explore all popular websites that leverage the capabilities of NextJS CMS across various categories.

When to use NextJS and headless CMS

Using Next.js and headless CMS together is a perfect choice if:

  • The content will be updated frequently or needs to be up-to-date at all times.

  • Real-time publishing support is necessary

  • Fast page load times

  • Friendly interface and a great user experience

  • Possibility to add content effortlessly

  • SEO efficiency

  • Seamless maintenance

These are just some reasons why many companies have chosen Next.js and CMS to create modern and scalable websites.

NextJS examples: Large multi-user websites using NextJS and headless CMS

There are many users on these sites, heavy traffic, and data are generated constantly. Such websites must, therefore, meet the following requirements:

  • Website performance - so the website won't slow down with more users

  • Website scalability – so traffic spikes won't crash your site

  • Constant rendering - so the most current data is always available

Hulu

Hulu is a streaming service that offers a wide variety of on-demand content, including TV shows, movies, documentaries, and original programming. It is one of the major streaming platforms in the United States and is known for its extensive content library.

Hulu website

Why Hulu uses NextJS and headless CMS

According to the Hulu Case Study, this company migrated to Next.js because of server-side rendering.  With data coming from many sources and a fundamental need for SEO, server-side rendering was a must for Hulu; on the other side, using a headless CMS to manage all those different data sources and make TV and movies easily accessible online.

Which headless CMSs does Hulu use?

Hulu tech stack:

  • Next.js

  • Salesforce

  • WordPress

  • Craft CMS

  • Shopify

Airbnb

Airbnb is a website that connects people who want to rent out their homes with people looking for lodging in specific areas.

Airbnb website

Why Airbnb uses Next.js and headless CMS

Design travel websites with destination guides, reviews, and booking options. The CMS manages travel information, while Next.js ensures a smooth booking experience and multimedia-rich pages.

Which headless CMS does Airbnb use?

Airbnb tech stack:

  • WordPress

Spotify for Artists

Spotify for Artists is a platform musicians and music labels use to manage their profiles and track analytics. Through it, artists can take control of their music on Spotify, gain insights into their audience, and engage with their fans.

Spotify for Artists website

Why Spotify for Artists uses Next.js and headless CMS

Spotify used Next.js and CMS to create a dynamic and content-rich website. Next.js and headless CMS integration allow Spotify to design a website with videos, podcasts, and live events. The CMS handles media content, while Next.js provides an interactive and engaging interface.

Which headless CMS does Spotify for Artists use?

Spotify for Artists tech stack:

  • Next.js

  • Khoros

  • Contentful

  • WordPress

  • Salesforce

TikTok

TikTok is a popular social media platform for sharing short-form mobile videos with millions of daily users.

TikTok website

Why TikTok uses Next.js and headless CMS

TikTok uses Next.js and CMS integration to develop a social network with user profiles, posts, comments, and notifications. The CMS manages user-generated content, while Next.js delivers real-time interactions.

Which headless CMS TikTok use

TikTok tech stack:

  • Next.js

  • WordPress

  • Docusaurus

Twitch

Another social media platform that allows users to chat, interact, and enjoy different types of content and entertainment together.

Twitch website

Why Twitch uses Next.js and headless CMS

Next.js App Router supports streaming by default. It improves both the initial page loading performance and UI rendering that relies on slower data fetches that would block rendering the entire route. On the other hand, headless CMS APIs enable consistent content delivery across different platforms. And that makes live streaming even more effortless.

Which headless CMS does Twitch use

tech stack:

  • Next.js

  • Salesforce

  • Jekyll

  • Discourse

NextJS examples: Client-side rendered applications using NextJS and headless CMS

Single-page applications are websites or web applications that dynamically rewrite the current page rather than reloading it. In SPA, the initial HTML, JavaScript, and CSS resources are loaded with the first request, and subsequent interactions with the application are handled by making API requests to the server (the part that CMS slays) and dynamically updating the content on the page.

Requirements for SPA:

  1. No full-page reloads: SPAs avoid full-page reloads, which can lead to a smoother and more responsive user experience.

  2. Client-side routing: Client-side routing is often used to manage different views or components within the same page.

  3. Faster load times: SPAs can provide shorter load times for subsequent interactions once the initial resources are loaded because they only fetch and render the necessary data.

Marvel

Marvel is the official Next.js website for Marvel films, characters, comic books, and television shows.

Marvel website

Why Marvel uses Next.js and headless CMS

Responsive user experience. Is there a better way to display Marvel heroes than a responsive user design? Grid systems that allow Marvel heroes to expand or contract based on screen size make the same heroes more real and vivid. Also, media elements (in this case, heroes) can scale and resize gracefully to remain clear and visually appealing on different devices.

Also, touch-based interactions provide great responsive UX, making customers connect with the product even more and want to buy it.

Which headless CMS does Marvel use

Marvel tech stack:

  • Next.js

  • Zendesk

Ticketmaster

Ticketmaster is a website where you can buy and sell tickets for concerts, sporting events, plays, and other similar events.

Ticketmaster website

Why Ticketmaster uses NextJS and headless CMS

The Ticketmaster website operates on large amounts of data and implements many integrations. Payment processors, analytic tools,  user feedback collectors, customer data platforms, A/B testing, and personalization all cooperate seamlessly, with no-bugging performance thanks to Next.js and headless CMS integration.

Which headless CMS does Ticketmaster use

Ticketmaster tech stack:

  • Jekyll

  • WordPress

  • Drupal

  • Salesforce

  • Zendesk

  • Next.js

Condé Nast Publications

Condé Nast is a media company that creates and distributes every type of media today: print, video, film, digital, audio, and social media content.

Conde Nast website

Why Condé Nast uses NextJS and headless CMS

Condé Nast uses CMS as a tool for media storage and content delivery. Thanks to CDNs, Condé Nast can distribute media files globally, ensuring fast loading times for users in different geographical locations. Next.js can retrieve relevant media files directly from the media server or CDN when content is requested, ensuring efficient and optimized delivery.

Which headless CMS does Condé Nast use

Condé Nast tech stack:

  • Next.js

  • Contentful

  • Webflow

  • Gatsby

NextJS examples: Content-heavy websites using Next.js and headless CMS

As I mentioned in the previous category, media companies, it is time to list websites that use Next.js and a headless CMS to improve their online presence. Unlike the earlier sections, in this one, I will only mention the general requirements needed for media websites, which Next.js and the CMS fulfill. How do I know it's fulfilling? The following is a list of world-famous media outlets that have opted for this tech stack.

Content-heavy websites, such as news portals, blogs, and media websites, have unique requirements due to the volume and diversity of content they handle.

Here are the key requirements for building and maintaining content-heavy websites:

  1. Scalability - Content-heavy websites must handle many articles, videos, images, and other media. The architecture should be scalable to accommodate increasing content.

  2. User-friendly content creation - Content creators and editors need user-friendly tools to create and update content easily.

  3. Performance optimization - Website performance needs to handle the large volume of content. Techniques like lazy loading images, content caching, and pagination must come out of the box.

  4. Content Delivery Network - CDNs quickly deliver media content, such as images and videos, to users worldwide.

  5. Mobile responsiveness- Media websites must be fully responsive and provide a great user experience on various devices, including smartphones and tablets.

  6. Multi-channel publishing: Media websites must adapt content for different channels and platforms, including mobile apps, email newsletters, and social media.

The New York Times

NY Times website

Which headless CMS does The New York Times use

New York Times tech stack:

  • Shopify

  • Medium

  • Next.js

  • Visual Studio

  • Tumblr

  • WordPress

  • Gatsby

  • Zendesk

  • Laravel

National Geographic

NG website

Which headless CMS does National Geographic use

National Geographic tech stack:

  • Magento

  • Salesforce

  • Zendesk

  • Adobe Experience Manager

BBC Sport

BBC website

Which headless CMS does BBC Sport use

BBC Sport tech stack:

  • Shopify

  • Hugo

  • Gatsby

  • Next.js

  • Visual Studio

CNN

CNN website

Which headless CMS does CNN use

CNN tech stack:

  • Shopify

  • WordPress

  • Drupal

  • Next.js

Bloomberg

Bloomberg website

Which headless CMS does Bloomberg use

Bloomberg tech stack:

  • Next.js

  • WordPress

  • Ruby on Rails

The Guardian

Guardian website

Which headless CMS does The Guardian use

The Guardian tech stack:

  • Craft CMS

  • WordPress

  • Concrete5

  • Laravel

Wired Vogue

Wired Vogue Website

Which headless CMS does Wired Vogue use

Wired Vogue tech stack:

  • WordPress

  • Squarespace

  • Umbraco

  • Ning

Time

Time website

Which headless CMS does Time use

Time tech stack:

  • WordPress

  • Zendesk

National Public Radio (NPR)

NPR website

Which headless CMS does NPR use

NPR tech stack:

  • WordPress

  • Drupal

  • SilverStripe CMS

  • Salesforce

  • Tumblr

  • Laravel

New Yorker

New Yorker website

Which headless CMS does New Yorker use

New Yorker tech stack:

  • Shopify

  • WordPress

  • Squarespace

  • Umbraco

  • Gatsby

  • Next.js

Washington Post

Washington Post website

Which headless CMS does the Washington Post use

Washington Post tech stack:

  • Next.js

  • Methode

  • WordPress

  • Shopify

  • Drupal

Reuters

Reuters website

Which headless CMS does Reuters use

Reuter's tech stack:

  • Arc Publishing

  • Laravel

  • Next.js

  • Django

Reuters CMS

New York Magazine

New York Magazine website

Which headless CMS does New York Magazine use

NY Magazine tech stack:

  • WordPress

Vanity Fair

Vanity Fair website

Which headless CMS does Vanity Fair use

Vanity Fair tech stack:

  • Shopify

  • Umbraco

  • Laravel

Wall Street Journal

Wall Street Journal website

Which headless CMS does the Wall Street Journal use

WSJ tech stack:

  • WordPress

  • Next.js

Vice

Vice website

Which headless CMS does Vice use

Vice tech stack:

  • Shopify

  • Next.js

  • Craft CMS

  • Webflow

  • Discourse

  • Gartsby

  • Squarespace

  • Ruby on Rails

NextJS examples: E-commerce websites using NextJS and headless CMS

The bigger the E-commerce website is, the more significant the impact of the conversion rate on revenue. In other words, the customer journey and shopping experience should result in sales as often as possible.

E-commerce website requirements

  • Fast page load speed – so browsing and shopping is possible

  • Ability to make frequent changes – so the online store is always up to date

  • Third-party systems – to incorporate your webshops with systems like PIM, ERP, and marketing automation tools

  • Security - to protect against common e-commerce security threats, such as SQL injection and cross-site scripting.

  • Product reviews and ratings - User-generated product reviews and ratings are possible.

  • Payment processing - Integration with secure payment gateways

Adidas

Adidas website

Which headless CMS does Adidas use

Adidas tech stack:

  • Salesforce

  • Next.js

  • Visual Studio

  • Ruby on Rails

  • Drupal

Deliveroo

Deliveroo website

Which headless CMS does Deliveroo use

Deliveroo tech stack:

  • Next.js

  • Concrete5

Freshii

Freshii website

Which headless CMS does Freshii use

Freshii tech stack:

  • Next.js

  • Zendesk

AT&T

ATT website

Which headless CMS does AT&T use

AT&T tech stack:

  • Shopify

  • Next.js

  • ATG Web Commerce

  • Crafter CMS

  • WordPress

  • Drupal

  • Gatsby

  • Django

  • Salesforce

  • Visual Studio

  • CodeIgniter

GoPro

GoPro website

Which headless CMS does GoPro use

GoPro tech stack:

  • Salesforce

  • Next.js

  • Django

  • Laravel

  • Ruby on Rails

Hilton Hotels

Hilton Hotels

Which headless CMS does Hilton Hotels use

Hilton Hotels techs stack:

  • Next.js

  • Laravel

  • WordPress

  • SiteCore

  • Tumblr

  • Visual Studio

  • Salesforce

Nike

Nike website

Which headless CMS does Nike use

Nike tech stack:

  • Next.js

  • Ruby on Rails

  • Shopify

  • Gatsby

  • Visual Studio

  • Duda

  • Magento

Target

Target website

Which headless CMS does Target use

Target tech stack:

  • Next.js

  • Drupal

  • Kentico

  • Salesforce

  • Squarespace

  • WordPress

Porsche

Porsche website

Which headless CMS does Porcshe use

Porsche tech stack:

  • Magnolia CMS

  • SiteCore

  • WordPress

  • Next.js

  • SAP Commerce Cloud

  • Django Framework

  • Contentful

NextJS examples: Finance websites using Next.js and headless CMS

Building a finance website means you need to develop a secure website. Next.js, combined with a headless CMS, can help you create a trustful website to manage payments and transactions without fear of attack and hacking.

Finance website requirements:

  • A simple navigation system - to make browsing the website accessible for visitors

  • An easy-to-use design - so that visitors can easily understand what you offer

  • Non-confusing user experience for the customers - so visitors know what to do next

Western Union

WU website

Which headless CMS does Western Union use

  • Adobe Experience Manager

  • C1 CMS

  • WordPress

  • Salesforce

  • Gatsby

  • Drupal

  • Moodle

  • Next.js

Nubank

Nubank website

Which headless CMS does Nubank use

Nubank tech stack:

  • Next.js

  • WordPress

  • Discourse

Sumup

Sumup

Which headless CMS does Sumup use

Sumup tech stack:

  • Next.js

  • WordPress

  • Contentful

  • Docusaurus

  • Zendesk

Verge Currency

Verge Currency

Which headless CMS does Verge Currency use

Verge Currency tech stack:

  • Next.js

  • XenForo

NextJS examples: SaaS websites using NextJS and headless CMS

When delivering applications over the Internet-as-a-service, Next.js makes it super simple to run some server-side code.

The main goal of SaaS websites is to present the offer in an appealing way to get their contact information, convince visitors to start a trial, or convert visitors into paying customers.

SaaS website requirements:

  • Cloud-Based - eliminates the need for users to download and install software locally

  • High performance – to get higher Google rankings

  • Complete SEO support – so you can grow organic traffic consistently

  • Integrations with customer analytics and automation marketing tools - so you can get to know your customers better

  • Subscription model – where users pay a recurring fee (monthly or annually) to access the software.

HubSpot

HubSpot

Which headless CMS does HubSpot use

HubSpot tech stack:

  • HubSpot

  • Khoros

  • PrestaShop

  • Next.js

  • Moodle

  • Django Framework

Loom

loom

Which headless CMS does Loom use

Loom tech stack:

  • Next.js

  • Contentful

  • Zendesk

  • Ruby on Rails

  • Discourse

  • Shopify

Zendesk

Zendesk

Which headless CMS does Zendesk use

Zendesk tech stack:

  • Medium

  • Gatsby

  • Webflow

  • Next.js

  • Salesforce Commerce Cloud

  • Kentico

  • Craft CMS

Typeform

Typeform

Which headless CMS does Typeform use

Typeform tech stack:

  • Contentful

  • Next.js

  • Gatsby

Invision

Invision

Which headless CMS does Invision use

Invision tech stack:

  • Zendesk

  • Next.js

  • Hugo

Product Hunt

ProductHunt

Which headless CMS does Product Hunt use

Product Hunt tech stack:

  • Next.js

  • Ruby on Rails

  • Medium

Auth0

Auth0

Which headless CMS does Auth0 use

Auth0 tech stack:

  • Next.js

  • Discourse

  • Contentful

  • WordPress

  • Magento

  • Craft CMS

  • nopCommerce

Grammarly

Grammarly

Which headless CMS does Grammarly use

Grammarly tech stack:

  • Next.js

  • Contentful

  • Zendesk

Notion

Notion

Which headless CMS does Notion use

Notion tech stack:

  • Next.js

  • Contentful

  • Webflow

Snappify

Snappify

Which headless CMS does Snappify use

Veed.io

Veedio

Which headless CMS does Veed.io use

Veed.io tech stack:

  • Next.js

  • Ghost

  • Webflow

Wordtune

Wordtune

Which headless CMS does Wordtune use

Wordtune tech stack:

  • Next.js

  • Webflow

Figma

Figma

Which headless CMS does Figma use

Figma tech stack:

  • Sanity

  • Blogger

  • Zendesk

  • Ruby on Rails

  • Discourse

  • Django Framework

  • Shopify

  • Docusaurus

  • Next.js

  • WordPress

NextJS examples: Entertainment and gaming websites use Next.js and headless CMS

Entertainment and gaming must run smoothly to be fun and user-friendly. These are sites that manage a lot of heavy and rich content. To do this successfully, large entertainment and gaming companies are migrating to Next.js and CMS integration that can fulfill the following requirements:

  • Performance for media-heavy content - Next.js optimizes performance by providing automatic code splitting and image optimization, ensuring fast page loading and smooth user experiences.

  • On-the-go entertainment and gaming experience - mobile-responsive design ensures that fun is everywhere you go.

  • Real-time features - the gaming website must support real-time gameplay, chat, and interactive features.

  • Scalability for traffic spikes: Gaming websites often experience spikes during game releases, updates, and live events. So, they need tools that ensure the website can handle these surges in traffic without compromising performance.

Plex

Plex TV

Which headless CMS does Plex use

Plex tech stack:

  • Next.js

  • Discourse

  • WordPress

HBO Max

HBO Max

Which headless CMS does HBO Max use

HBO Max tech stack:

  • Next.js

  • Wordpress

Epic Games

Epic Games

Which headless CMS does Epic Games use

Epic Games tech stack:

  • vBulletin

  • Salesforce

  • Next.js

  • Visual Studio

EA games

EA games

Which headless CMS does EA Games use

EA Games tech stack:

  • Next.js

  • Khoros

  • Vanilla Forums

  • Visual Studio

Game spot

Game spot

Which headless CMS does Game Spot use

Game spot tech stack:

  • Shopify

  • Gatsby

  • Next.js

IGN

IGN

Which headless CMS does IGN use

IGN tech stack:

  • Next.js

  • Squarespace

  • Django

  • MediaWiki

  • XenForo

  • Shopify

  • Webflow

What else can be built with NextJS and headless CMS?

The choice is immeasurable. Here are some more inspiring examples:

NextJS examples: Job Boards

Did you know you can use headless CMS to build a job board? Well, Netflix knew it for sure. Combined with Next.js, Netflix's job board looks like this:

Netflix Job board

Why build a job board with NextJS and CMS?

This integration is a great choice for building job board websites because it meets the following requirements:

  1. SEO Optimization for job listings Job boards heavily rely on search engines; server-side rendering ensures that search engines quickly crawl and index job listings and content, resulting in better search engine rankings.

  2. Real-time updated job listings capabilities make it suitable for displaying and updating job listings, ensuring job seekers see the latest opportunities.

  3. Serverless deployment The Next.js job board can be deployed on serverless platforms, simplifying the process of posting new job listings and making updates, ensuring that the job board remains current and up-to-date.

Which headless CMS does Netflix use

Netflix tech stack:

  • Next.js

  • Squarespace

  • Contentful

NextJS examples: Real estate listings website: Zillow

You can create a website that allows users to search for and list real estate properties.

The website should provide features:

  • Complete property information, including descriptions, images, and amenities

  • Contact info about sellers or agents for inquiriesIntegration with maps that can enhance the UX by visualizing property locations

Zillow

Which headless CMS does Zillow use

Zillow tech stack:

  • Next.js

  • WordPress

NextJS examples: Online learning platform: Learn Squared

You can develop an online learning platform where instructors can create and publish courses, and students can enroll and access course materials.

The platform should include features such as:

  • course progress tracking

  • discussion forums

  • secure payment integration

Learn Squared

Which headless CMS does Learn Squared use

Learn Squared tech stack:

  • Drupal

  • Next.js

NextJS examples: Music streaming platform: Spotify

Spotify

Spotify uses Next.js to create a music streaming platform where users can listen to their favorite songs and discover new music.

Spotify needed the following features:

  • User registration and authentication

  • Music playback and streaming

  • Playlist creation and management

  • Recommendations based on user preferences

Which headless CMS does Spotify use

Spotify tech stacks:

  • Next.js

  • Khoros

  • Contentful

  • WordPress

  • Salesforce

Ready to build your own NextJS example?

In this blog post, I showcase some of the best examples of Next.js websites and web applications you can build with a headless CMS.

As these 60 examples show, Next.js is a versatile tool that can be used for any project, from simple personal websites to large-scale eCommerce stores.

These two technologies empower you to create responsive, fast, flexible, and scalable websites to meet your audience's demands.

Now, it's time to take action. If you're planning your next website project, consider leveraging the power of Next.js and a headless CMS to build a site that not only meets but exceeds your goals.

Choose BCMS, and take the first step towards building your website with Next.js and a headless CMS. Build flexibility and engagement that will set you apart in the digital landscape. Your next website project starts now.

  • It takes a minute

  • Free support

  • 14 days free trial

Create your account