BaseHub

Documentation

• Introduction: BaseHub is a fast and collaborative Headless CMS.
• Platform Overview: Understand the basics of the BaseHub Platform.

Next.js Integration

• Start Here: Learn how to integrate your Next.js App with BaseHub in a couple of steps.
• Querying Basics: Learn how to build GraphQL queries with the generated client.
• Rendering Rich Text: Fragments let you construct sets of fields, and then include them in queries where you need to.
• Environments & Caching: Understand the different environments and caching strategies you can leverage to improve your content editing experience.

AI

• MCP: You can use your agent tools provided by our MCP server and connect it to your favorite apps, like Claude and Cursor.
• Agents: BaseHub Agents are AI assistants that help with content management, automated workflows, and team collaboration.
• Workflows: Automate content generation across your repository with AI-powered workflows.

Extras

• Search: Learn how to add instant-search into your website.
• Analytics: Learn how to send analytics events from your website.
• Forms: The powerful Event block lets you build a form schema from the dashboard, and consume it in code to build complex forms.
• Webhooks: Learn how to use Webhooks to subscribe to changes that happen within BaseHub.
• Localization: Learn how to add localization, or i18n, by using the Variants Block.

Other Frameworks

• Astro: Get started with Astro and BaseHub.
• SvelteKit: Get started with SvelteKit and BaseHub.

API Reference

JavaScript SDK

• Tokens: Learn which tokens exist in BaseHub and what they are for.
• CLI: Generates a type-safe client based on your Repo's schema.

basehub Client

• query: The main method to consume data from your BaseHub repositories.

mutation

• transaction: The main mutation method, covers most of the modifications that can be done to the schema with three different transaction types: create, update and delete.
• transactionAsync: Same as transaction, but runs async—as a background job.
• getUploadSignedURL: A helper to upload assets to our database.
• transactionStatus: Gets the current transaction status based on its ID.

React

• : A React Server Component that queries BaseHub and can subcribe to real time changes seamlessly.
• : Our official rich text renderer. Supports passing custom handlers for native html elements and BaseHub components.
• : Easy-to-use component for rendering great code snippets.

Search

• useSearch: A React hook that instantiates your Search Client.

• <SearchBox.Root />: The Search wrapper works as a provider and comes with some optional props that can come in handy.

• <SearchBox.Input />: Extends the native HTML Input and consumes the search context in order to fetch hits from the indexed data.

• Hit Components: Use cases and APIReference for HitList, HitItem, HitSnippet

• : A vector renderer for our icon block. Supports passing custom handlers for native svg elements.

Events

• sendEvent: The events method to send data through BaseHub. Flexible, type-safe and scoped by block.
• getEvents: A query method to retrieve your events stored in BaseHub.
• updateEvent: Method that allows modifying existing events by their ID.
• deleteEvent: Method that removes one or more events by their IDs.

Search (core)

• search: Core method to perform a search query.
• getClientRaw: Get the raw search client.

Next

• : The official BaseHub toolbar to manage draft mode and switch branches in your site previews.

Release Notes

• Version 9: Learn how to upgrade from v8 to v9.
• Version 8: Learn how to upgrade from v7 to v8.

GraphQL API

• Explorer: Explore the GraphQL API interactively, thanks to the power of GraphiQL.
• Mutation API Guidelines: Learn how to create, update, and delete content in BaseHub using the Mutation API with detailed examples and best practices.
• Query API Guidelines: Master GraphQL querying in BaseHub with comprehensive examples for layout and primitive blocks, filtering, ordering, and variants.

Blocks Reference

• Anatomy of a Block: You can think of your Repository as a tree of Blocks. Let's explore how this works.

Layout Blocks

• Root: The root of the Tree.
• Document: The most common layout block in BaseHub. Think of them as directories in a file system.
• Component: The Component block functions as a modular structure within your repository, that can be reused across your schema.
• Instance: A modular block that reuses the structure from your Components.
• Collection: A powerful list of blocks that can be fully customizable.
• Variants: Lets you create variations of a piece of content. Useful for i18n and A/B testing.

Primitive Blocks

• Text: The default plain text input in BaseHub. Cannot contain rich text formatting.
• Number: The most primitive number input in BaseHub. Allows integer, float, negative and positive numbers.
• Boolean: A primitive flag input. True or false.
• Date: A primitive date input, with optional time.
• Rich Text: A powerful text input that not only supports markdown syntax but also it has the possibility to have many custom components made in BaseHub.
• Media: All kind of assets in one block. Comes with some constraints that can make your media uploads more reliable.
• Select: Choose from a pre-defined selection of text options.
• Reference: Choose from a constrained list of component types.
• Color: A primitive color input. Opens a palette, and lets you select every color format.
• OG Image: A lightweight OG Image editor used for social cards. Accepts variables and is fully customizable.
• Event: A unique block that enables type-safe data submissions
• Workflow: A unique block to automate actions, webhooks and notifications.
• Icon: Provides seamless rendering of SVG elements in your application.

Templates & Examples

Templates

• Introduction: Know more about how templates work in the platform.
• Create Your Own: Learn how to create your own template in this short guide.
• Marketing Website Template: The perfect way to start your next marketing website.
• Documentation Template: The template that powers this documentation website.
• Help Center Template: The template that powers our own Help Center. Full-text search included.
• Waitlist Template: Minim ipsum veniam elit duis veniam consectetur sit.

Examples & Guides

• Create a Feedback Form: A simple "Feedback" form using the Event and the Workflow Blocks.
• Create a Newsletter: See how you can build a fully-fledged Newsletter using the Event and Workflow Blocks, plus Resend and React Email.
• Create a View Counter: Track page views with the Event Block, and display them in your site.
• Create a Form Builder: Programmatic pages and forms using the Reference and Event Blocks.
• Custom Components in Rich Text: Learn how to use custom components within rich text blocks.
• Simple A/B Testing: Learn how to perform simple A/B tests with BaseHub and the Variant Block.

OpenAPI Example

OpenAPI Spec: https://cdn.jsdelivr.net/npm/@scalar/galaxy/dist/latest.yaml