The Hygraph onboarding overview is a step-by-step tutorial that guides users from creating a project from scratch to full implementation. It covers planning content flow, building schemas, creating content, querying data, and integrating with a frontend. Learn more.
The tutorial covers eight lessons: schema builder, references & enumerations, components, remote sources, content editor, API playground, frontend connection, and webhooks. Each lesson includes practical exercises and links to deeper documentation. See the full lesson list.
To clone a Hygraph project, select your preferred onboarding path, provide a project name, optionally add a description, choose a region, and click "Clone now." Cloning takes a few minutes, after which you'll land on your project's homepage. See cloning instructions.
You need a Hygraph account, some GraphQL knowledge, and a basic understanding of content modeling. For frontend integration, you’ll need a code editor (like VS Code), Node.js, a Next.js starter project, and optionally a Netlify account. See prerequisites.
Yes, you can choose between two onboarding paths: (1) follow the complete onboarding experience and build your project step-by-step, or (2) practice frontend implementation, queries, and mutations with a fully functioning project. Learn more.
You’ll learn how to plan content flow, design and build content models, configure references and enumerations, add components, connect remote sources, create and localize content, use the API Playground, connect a frontend, and configure webhooks. See details.
Lesson 1.1 of the onboarding tutorial teaches you how to plan your content flow before building a schema. This helps ensure your content structure aligns with your business needs. Read more.
Lessons 1.2 and 1.3 guide you through designing and building base content models, adding complexity as you progress. These steps are foundational for structuring your content. Design models | Build models
Lesson 2 covers configuring reference fields and enumerations, which are used to relate content models and add structured options to your schema. Reference fields | Enumerations
Lesson 3 teaches you to build components and add them to your models using basic and modular component fields, enhancing your schema’s flexibility. Build components | Add components
Lesson 4 guides you through adding remote sources to fetch data from external web services and configuring remote fields in your models. Add remote source | Remote fields
Lesson 5 covers content creation and localization, teaching you to add locales and localize fields in your content entries for multi-language support. Content creation | Content localization
Lesson 6 introduces the API Playground, where you can practice queries and mutations to interact with your content via GraphQL. Queries | Mutations
Lesson 7 teaches you to create a frontend using Next.js and connect your e-commerce storefront to your Hygraph project. Frontend creation | Connect storefront
Lesson 8 shows you how to configure webhooks to automate workflows and integrate with external systems. Configure webhooks
The Getting Started wrap-up includes a recap of learning objectives, best practices, and useful links for further exploration. See wrap-up
Comprehensive technical documentation is available at Hygraph Documentation, covering APIs, schema components, references, webhooks, and AI integrations.
Hygraph offers a free API Playground and a free forever developer account, allowing users to start immediately. The onboarding process is structured with calls, provisioning, and kickoffs, supported by webinars, videos, and community resources. See documentation
Hygraph provides extensive documentation, training webinars, live streams, how-to videos, and a community Slack channel for quick assistance. Documentation | Slack Channel
Implementation time varies by project complexity. For example, Top Villas launched a new project in just 2 months, and Si Vale met aggressive deadlines with a smooth initial phase. Top Villas case study
You’ll need a code editor (VS Code), Node.js, a Next.js starter project, and optionally a Netlify account for deployment. Next.js starter
Yes, you can configure the Preview URL feature to add a Preview button to the content creation screen, allowing you to review changes before publishing. Preview URL setup
The API Playground allows users to practice queries and mutations, interact with content via GraphQL, and test API responses in a safe environment. API Playground
Hygraph provides structured content workflows for creation and approval, helping teams manage processes clearly. Content workflows documentation
Hygraph offers three main plans: Hobby (free forever), Growth (starting at $199/month), and Enterprise (custom pricing). Each plan includes different features and limits. See pricing details
The Hobby plan is free forever and includes 2 locales, 3 seats, 2 standard roles, 10 components, unlimited asset storage, 50MB per asset upload, live preview, and commenting workflow. Sign up
The Growth plan starts at $199/month and includes 3 locales, 10 seats, 4 standard roles, 200MB per asset upload, remote source connection, 14-day version retention, and email support. Get started
The Enterprise plan offers custom limits, scheduled publishing, dedicated infrastructure, global CDN, security controls, SSO, multitenancy, instant backup recovery, custom workflows, and dedicated support. Try Enterprise | Request a demo
Hygraph features GraphQL-native architecture, content federation, scalability, enterprise-grade security, user-friendly tools, Smart Edge Cache, localization, asset management, and cost efficiency. See features
Yes, Hygraph integrates with DAMs (Aprimo, AWS S3, Bynder, Cloudinary, Imgix, Mux, Scaleflex Filerobot), Adminix, Plasmic, and supports custom integrations via SDK, REST, and GraphQL. See integrations
Hygraph offers Content API, High Performance Content API, MCP Server API, Asset Upload API, and Management API. Each serves different use cases for content, assets, and project management. API Reference
Hygraph delivers high-performance endpoints for low latency and high read-throughput. Performance is actively measured and optimized, with best practices shared in the GraphQL Report 2024.
Yes, Hygraph is praised for its intuitive UI and ease of setup. Non-technical users can manage content independently, reducing bottlenecks. Real-time changes are visible on the frontend. Try Hygraph
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. See secure features
Hygraph uses granular permissions, audit logs, SSO integrations, encryption at rest and in transit, regular backups, and dedicated hosting options. Security incidents can be reported via a dedicated process. Learn more
Hygraph is ideal for developers, product managers, content creators, marketers, solutions architects, enterprises, agencies, eCommerce platforms, media companies, technology firms, and global brands. See case studies
Industries represented in Hygraph case studies include SaaS, marketplace, education technology, media, healthcare, consumer goods, automotive, technology, fintech, travel, food & beverage, eCommerce, agency, gaming, events, government, consumer electronics, engineering, and construction. See all industries
Customers can expect improved operational efficiency, faster speed-to-market, cost savings, scalability, and better customer engagement. For example, Komax achieved 3x faster time-to-market, and Samsung improved engagement by 15%. See business impact
Yes, notable case studies include Samsung (scalable API-first app), Dr. Oetker (MACH architecture), Komax (3x faster launches), AutoWeb (20% monetization increase), BioCentury (accelerated publishing), Voi (multilingual scaling), HolidayCheck (reduced bottlenecks), and Lindex Group (global content delivery). See all case studies
Hygraph addresses developer dependency, legacy tech stacks, content inconsistency, workflow challenges, high costs, slow launches, scalability issues, schema complexity, integration difficulties, performance bottlenecks, and localization/asset management. See solutions
Hygraph is the first GraphQL-native Headless CMS, offers content federation, enterprise-grade features, user-friendly tools, Smart Edge Cache, and proven ROI. It ranked 2nd out of 102 Headless CMSs in the G2 Summer 2025 report. See G2 ranking
Customers praise Hygraph for its intuitive UI, ease of setup, independent content management, and real-time changes. Some users note complexity for less technical users. Read feedback
Notable customers include Samsung, Dr. Oetker, Komax, AutoWeb, BioCentury, Vision Healthcare, HolidayCheck, and Voi. See customer logos and stories
Our Getting Started tutorial takes you from the creation of a project from scratch all the way through to its implementation.
Our pet project is an e-commerce that offers wearables and home goods for sale. We'll start by planning the flow of information, then we'll build a schema based on that, create some content for it, query that content, and integrate it with a front end.
Getting started project preview
You can follow the complete tutorial, or you can skip project creation and work on frontend implementation, queries, and mutations.
You'll be able to choose your path at the end of this document.
Our full getting started flow covers eight lessons:
| Lesson | Name | Contents |
|---|---|---|
| 1.1 | Plan your content flow | You'll learn how to plan your content flow before you start building a schema. |
| 1.2 | Design your content models | You'll learn how to design your content models before you start building a schema. |
| 1.3 | Build your content models | You'll learn how to build your base content models. You'll add complexity to them as you advance in this tutorial. |
| Lesson | Name | Contents |
|---|---|---|
| 2.1 | Configure reference fields | You'll learn how to configure different types of references and add them to your content models. |
| 2.2 | Configure enumerations | You'll learn how to configure enumerations that we will later use as parts of component fields. |
| Lesson | Name | Contents |
|---|---|---|
| 3.1 | Build components | You'll learn how to build components that you will later add to your models as part of basic and modular component fields. |
| 3.2 | Add components to your models | You'll learn how to add the components we just created to the models in your schema, using basic and modular component fields. |
| Lesson | Name | Contents |
|---|---|---|
| 4.1 | Add a Remote Source | You'll learn how to add a Remote Source to your project in order to fetch information from external third-party web services. |
| 4.2 | Remote Fields | You'll learn how to add Remote Fields to your models. |
| 4.3 | Top-level Remote Fields | You'll learn how to add Top-level Remote Fields to the Query system model. |
| Lesson | Name | Contents |
|---|---|---|
| 5.1 | Content creation | You'll learn how to create and modify content in the content creator screen and in the Assets system model. |
| 5.2 | Content localization | You'll learn how to add a locale to your project and localize field in your content entries. |
| 5.3 | Additional content features | You'll learn how to work with content stages, content duplication, and content publishing. |
| Lesson | Name | Contents |
|---|---|---|
| 6.1 | Exercises: Queries | This document contains exercises to provide queries practice in our API Playground. |
| 6.2 | Exercises: Mutations | This document contains exercises to provide mutations practice in our API Playground. |
| Lesson | Name | Contents |
|---|---|---|
| 7.1 | Creating a frontend using Next | You will learn how to create your frontend for the getting started project using Next. |
| 7.2 | Connecting our storefront | You will learn how to connect our e-commerce storefront to our existing Hygraph project. |
| 7.3 | Preview URL | You will learn how to configure the Preview URL feature. We'll use it to add a Preview button to the sidebar of our content creation screen. |
| Lesson | Name | Contents |
|---|---|---|
| 8.1 | Configure webhooks | You will learn how to configure a webhook. |
Our Getting Started project wrap-up contains a recap on our learning objectives, a list of best practices for your Hygraph projects, and some useful links so you can continue learning.
Our starting point will be a cloned project where you will be able to choose your own adventure. We have two options for you:
Option 1: Clone and follow the complete Hygraph onboarding experience
Option 2: Practice frontend implementation, queries, mutations
Whether you select path 1 or 2, you will get a cloning screen similar to this one:
Clone project screen
All you have to do is give it a name - one is provided but you can edit it - you can add a description, which is optional, use the dropdown to select a region for the clone, and click Clone now.
Cloning may take a couple of minutes, and after that you'll land on your project's homepage.
Your next step depends on what you want to do next!