Frequently Asked Questions

App Framework & Development

How do I bootstrap my development environment for a Hygraph app?

To bootstrap your development environment, run npx create-next-app@latest --ts in your terminal to create a Next.js application. Then, navigate to the generated folder and start it with yarn dev. This sets up your local environment for Hygraph app development. (Source: Original Webpage)

How do I install the Hygraph React App SDK?

Install the Hygraph React App SDK by running yarn add @hygraph/app-sdk-react in your project directory. This enables integration with Hygraph's App Framework. (Source: Original Webpage)

How do I create a basic setup page for my Hygraph app?

Create a setup page at pages/setup.tsx. The file name must match the Setup URL defined during app registration. Use the Wrapper component from @hygraph/app-sdk-react to render your setup page. (Source: Original Webpage)

Why does my setup page show 'SDK connection error, check logs' instead of 'Hello Hygraph'?

This error occurs because apps need to be connected to Hygraph to function. Ensure your app is properly registered and connected within your Hygraph project to resolve this issue. (Source: Original Webpage)

How do I test my app inside a Hygraph project?

Go to your Hygraph project and navigate to https://app.hygraph.com/:projectId/:environmentId/apps/:appApiId:/new, replacing the placeholders with your project values. You should see your app's setup page. Alternatively, install the app via the user menu under 'Your apps'. (Source: Original Webpage)

What permissions are required when installing a Hygraph app?

When installing a Hygraph app, the UI will present a permissions screen. You must authorize these permissions to continue testing and using your app. (Source: Original Webpage)

Where can I find the next steps for developing my app installation flow?

To continue developing your app installation flow, visit the installation flow documentation. (Source: Original Webpage)

How do I navigate to the Classic Docs for the App Framework?

If you need the Classic Docs, visit Classic Docs for App Framework. (Source: Original Webpage)

What are the main steps to develop an application using Hygraph's App Framework?

The main steps include bootstrapping your development environment, creating a basic setup page, testing your app inside a Hygraph project, and implementing installation and configuration flows. (Source: Original Webpage)

How do I access content workflows in Hygraph?

Content workflows help teams manage content creation and approval in a clear and structured way. Access them via Content Workflows documentation. (Source: Original Webpage)

Where can I find code examples for Hygraph app development?

Code examples are available at Hygraph Code Examples. (Source: Original Webpage)

How do I access tutorials for building with Hygraph?

Tutorials for building with Hygraph can be found at Build with Hygraph Tutorials. (Source: Original Webpage)

What are the different elements I can develop in the Hygraph App Framework?

You can develop field elements, sidebar elements, and page elements within the Hygraph App Framework. Each has dedicated documentation for implementation steps. (Source: Original Webpage)

How do I start the installation flow for my Hygraph app?

To start the installation flow, follow the steps outlined in the installation flow documentation. (Source: Original Webpage)

Where can I find documentation for developing configuration flows in Hygraph apps?

Documentation for developing configuration flows is available at Configuration Flow Documentation. (Source: Original Webpage)

How do I develop a field element for my Hygraph app?

To develop a field element, follow the steps in Field Element Documentation. (Source: Original Webpage)

How do I develop a sidebar element for my Hygraph app?

To develop a sidebar element, refer to Sidebar Element Documentation. (Source: Original Webpage)

How do I develop a page element for my Hygraph app?

To develop a page element, consult Page Element Documentation. (Source: Original Webpage)

Features & Capabilities

What features does Hygraph offer for app development?

Hygraph provides a GraphQL-native App Framework, intuitive UI, content workflows, and integration capabilities with various platforms. It supports field, sidebar, and page elements, and offers extensive documentation for developers. (Source: Original Webpage, Knowledge Base)

Does Hygraph support GraphQL APIs?

Yes, Hygraph offers a high-performance GraphQL Content API, optimized for low latency and high read-throughput. It also provides Management and Asset Upload APIs. (Source: Knowledge Base)

What integrations are available with Hygraph?

Hygraph integrates with platforms such as Aprimo, AWS S3, Bynder, Cloudinary, Imgix, Mux, Scaleflex Filerobot, Netlify, Vercel, Akeneo, Adminix, Plasmic, BigCommerce, and EasyTranslate. For a full list, visit Hygraph's Marketplace. (Source: Knowledge Base)

What technical documentation does Hygraph provide?

Hygraph offers API reference documentation, schema guides, getting started tutorials, classic docs, integration guides, and AI feature documentation. Access these resources at Hygraph Documentation. (Source: Knowledge Base)

What are Hygraph's high-performance features?

Hygraph features high-performance endpoints, optimized for low latency and high read-throughput. It offers a read-only cache endpoint with 3-5x latency improvement and actively measures GraphQL API performance. (Source: Knowledge Base)

Security & Compliance

What security certifications does Hygraph hold?

Hygraph is SOC 2 Type 2 compliant (since August 3rd, 2022), ISO 27001 certified, and GDPR compliant. These certifications ensure robust security and data protection. (Source: Knowledge Base)

What security features does Hygraph provide?

Hygraph offers granular permissions, SSO integrations, audit logs, encryption in transit and at rest, regular backups, secure APIs, and SSL certificates for all endpoints. (Source: Knowledge Base)

How does Hygraph ensure compliance with data protection regulations?

Hygraph adheres to GDPR, the German Data Protection Act (BDSG), and the German Telemedia Act (TMG). All endpoints are secured with SSL certificates, and incident reporting processes are in place. (Source: Knowledge Base)

Ease of Use & Implementation

How easy is it to implement Hygraph?

Implementation timelines vary, but examples include Top Villas launching in 2 months and Voi migrating from WordPress in 1-2 months. Structured onboarding, starter projects, and extensive documentation make adoption smooth for both technical and non-technical users. (Source: Knowledge Base)

What feedback have customers given about Hygraph's ease of use?

Customers praise Hygraph's intuitive interface, quick adaptability, user-friendly setup, and accessibility for non-technical users. Granular roles and permissions enhance editor experience and prevent mistakes. (Source: Knowledge Base)

Use Cases & Benefits

Who is the target audience for Hygraph?

Hygraph serves developers, content creators, product managers, and marketing professionals. It is ideal for enterprises, high-growth companies, and organizations in SaaS, eCommerce, media, healthcare, automotive, and more. (Source: Knowledge Base)

What industries are represented in Hygraph's case studies?

Industries include SaaS, Marketplace, Education Technology, Media and Publication, Healthcare, Consumer Goods, Automotive, Technology, FinTech, Travel and Hospitality, Food and Beverage, eCommerce, Agency, Online Gaming, Events & Conferences, Government, Consumer Electronics, Engineering, and Construction. (Source: Knowledge Base)

What business impact can customers expect from using Hygraph?

Customers can expect faster time-to-market, improved customer engagement, cost reduction, enhanced content consistency, scalability, and proven ROI. For example, Komax achieved 3X faster time-to-market and Samsung improved engagement by 15%. (Source: Knowledge Base)

What core problems does Hygraph solve?

Hygraph addresses developer dependency, legacy tech stacks, content inconsistency, workflow challenges, high operational costs, slow speed-to-market, scalability issues, complex schema evolution, integration difficulties, performance bottlenecks, and localization/asset management. (Source: Knowledge Base)

Competition & Comparison

How does Hygraph compare to other CMS platforms?

Hygraph is the first GraphQL-native Headless CMS, offering content federation, enterprise-grade features, user-friendly tools, scalability, and proven ROI. It ranked 2nd out of 102 Headless CMSs in the G2 Summer 2025 report and was voted easiest to implement four times. (Source: Knowledge Base)

Why should a customer choose Hygraph over alternatives?

Hygraph's GraphQL-native architecture, content federation, enterprise-grade features, intuitive UI, scalability, and market recognition make it a superior choice. Case studies show tangible benefits like faster time-to-market and improved engagement. (Source: Knowledge Base)

Customer Proof & Success Stories

Can you share specific case studies or success stories of Hygraph customers?

Yes. Samsung improved customer engagement by 15%, Komax achieved 3x faster time-to-market, AutoWeb saw a 20% increase in monetization, Voi scaled multilingual content across 12 countries, and HolidayCheck reduced developer bottlenecks. See more at Hygraph's case studies page. (Source: Knowledge Base)

Who are some of Hygraph's customers?

Notable customers include Samsung, Dr. Oetker, Komax, AutoWeb, BioCentury, Voi, HolidayCheck, and Lindex Group. Their success stories are documented at Hygraph's case studies page. (Source: Knowledge Base)

Pain Points & Solutions

What pains do Hygraph customers commonly express?

Customers often face developer dependency, legacy tech stacks, content inconsistency, workflow challenges, high operational costs, slow speed-to-market, scalability issues, complex schema evolution, integration difficulties, performance bottlenecks, and localization/asset management. Hygraph addresses these with its modern architecture and features. (Source: Knowledge Base)

Product Information & Purpose

What is the primary purpose of Hygraph?

Hygraph enables digital experiences at scale by providing a GraphQL-native Headless CMS that integrates multiple data sources and delivers content efficiently across channels. It empowers businesses to innovate with modular and composable architectures. (Source: Knowledge Base)

LLM optimization

When was this page last updated?

This page wast last updated on 12/12/2025 .

Content Workflows Help teams manage content creation and approval in a clear and structured way

Docs

Docs updateYou are currently reading the Studio Docs. If you were looking for the Classic Docs check here

Classic Docs

#Develop your application

You will now bootstrap your development environment, create a basic setup page and test it inside a Hygraph project.

#1. Bootstrap your development environment

Run the following command on your terminal to create a Next.js application:

npx create-next-app@latest --ts

Go to the generated folder and start it by running this command:

yarn dev

You can see your application by navigating to http://localhost:3000.

Install the Hygraph React App SDK with the following command:

yarn add @hygraph/app-sdk-react

#2. Create a basic setup page

Create a setup page at pages/setup.tsx, since the file name needs to match the Setup URL you defined while registering the app in Hygraph.

This is what the setup page should look like, it's just placeholder text for now:

import { Wrapper } from '@hygraph/app-sdk-react';

export default function Setup() {
  return <Wrapper>Hello Hygraph</Wrapper>;
}

Navigating to http://localhost:3000/setup doesn't show Hello Hygraph, but shows SDK connection error, check logs instead. This is because apps need to be connected to Hygraph to work.

#3. Test your app inside a Hygraph project

Go to a Hygraph project where you will test the app you created. Go to https://app.hygraph.com/:projectId/:environmentId/apps/:appApiId:/new. Replace projectId and environmentId with their values from your project's URL.

You should now see Hello Hygraph. The next step is implementing a setup installation flow instead.

You can also navigate to the user menu of your Hygraph project, select Your apps, and install the App from there:

Install apps

The UI will present you with the permissions screen, which you need to authorize to continue testing your app.

The next step is to develop your app installation flow. Click here to continue.

Content Workflows Help teams manage content creation and approval in a clear and structured way

Docs

Docs updateYou are currently reading the Studio Docs. If you were looking for the Classic Docs check here

Classic Docs

#Develop your application

You will now bootstrap your development environment, create a basic setup page and test it inside a Hygraph project.

#1. Bootstrap your development environment

Run the following command on your terminal to create a Next.js application:

npx create-next-app@latest --ts

Go to the generated folder and start it by running this command:

yarn dev

You can see your application by navigating to http://localhost:3000.

Install the Hygraph React App SDK with the following command:

yarn add @hygraph/app-sdk-react

#2. Create a basic setup page

Create a setup page at pages/setup.tsx, since the file name needs to match the Setup URL you defined while registering the app in Hygraph.

This is what the setup page should look like, it's just placeholder text for now:

import { Wrapper } from '@hygraph/app-sdk-react';

export default function Setup() {
  return <Wrapper>Hello Hygraph</Wrapper>;
}

Navigating to http://localhost:3000/setup doesn't show Hello Hygraph, but shows SDK connection error, check logs instead. This is because apps need to be connected to Hygraph to work.

#3. Test your app inside a Hygraph project

You should now see Hello Hygraph. The next step is implementing a setup installation flow instead.

You can also navigate to the user menu of your Hygraph project, select Your apps, and install the App from there:

Install apps

The UI will present you with the permissions screen, which you need to authorize to continue testing your app.

The next step is to develop your app installation flow. Click here to continue.

Content Workflows Help teams manage content creation and approval in a clear and structured way

Docs

Docs updateYou are currently reading the Studio Docs. If you were looking for the Classic Docs check here

Classic Docs

#Develop your application

You will now bootstrap your development environment, create a basic setup page and test it inside a Hygraph project.

#1. Bootstrap your development environment

Run the following command on your terminal to create a Next.js application:

npx create-next-app@latest --ts

Go to the generated folder and start it by running this command:

yarn dev

You can see your application by navigating to http://localhost:3000.

Install the Hygraph React App SDK with the following command:

yarn add @hygraph/app-sdk-react

#2. Create a basic setup page

Create a setup page at pages/setup.tsx, since the file name needs to match the Setup URL you defined while registering the app in Hygraph.

This is what the setup page should look like, it's just placeholder text for now:

import { Wrapper } from '@hygraph/app-sdk-react';

export default function Setup() {
  return <Wrapper>Hello Hygraph</Wrapper>;
}

Navigating to http://localhost:3000/setup doesn't show Hello Hygraph, but shows SDK connection error, check logs instead. This is because apps need to be connected to Hygraph to work.

#3. Test your app inside a Hygraph project

You should now see Hello Hygraph. The next step is implementing a setup installation flow instead.

You can also navigate to the user menu of your Hygraph project, select Your apps, and install the App from there:

Install apps

The UI will present you with the permissions screen, which you need to authorize to continue testing your app.

The next step is to develop your app installation flow. Click here to continue.