Introducing Hygraph App Framework

Every team is different, each with its own requirements and workflows. Therefore, it's important for you to be able to customize the platform according to your unique needs.

With our new app framework, that's exactly what you can achieve.

The new app framework allows you to add functionalities to Hygraph, connect to external systems, automate workflows and do much more.

In this article, we will look into what the new app framework has to offer.

You can also watch a recording of the webinar we conducted to demonstrate the app framework in detail.

Watch the Webinar Read the Guide

All that's possible with the new App FrameworkAnchor

Add custom fields to modelsAnchor

Firstly, depending on your business use case, you can add customized fields to your models.

An example of this is the personalization field added in our Ninetailed app, allowing users to define personalization rules to any content in Hygraph.

Customize the sidebarAnchor

To improve the content editing experience or to trigger actions, you can add elements to the sidebar.

Our Vercel app is a great example of this. The app adds a button to the sidebar, which allows users to trigger Vercel builds with a single click.

Create custom page viewsAnchor

You could always create a separate page view for your app, which helps content editors as all of the app's actions can be performed through one single consolidated view.

An example of this is our Lokalise app, which offers a separate view for content editors to submit content to Lokalise for translation.

Fetch data from third-party systemsAnchor

Apps can always fetch data from a third-party API and show it within the Hygraph UI.

An example of this is our Shopify app, which fetches Product IDs and related data from Shopify and shows it within the Hygraph UI.

The app framework can interact with the content management API, and therefore you can always build an app to map schema and move content from other systems into Hygraph.

Trigger actions in third-party systemsAnchor

You can have apps to perform actions in third-party systems on the click of a button or through means of webhooks.

An example of this is our Netlify and Vercel apps, which trigger a build on the click of a button.

Other actionsAnchor

Apps can essentially perform any action that can be performed by a user through the UI; create models, create or update content etc. Namely, operations on Hygraph's content management API, content delivery API and webhooks. Needless to say, you can always apply custom permissions for every app that you create.

Share applications with othersAnchor

You can also easily share any apps that you built.

Simple process to uninstall applicationsAnchor

Lastly, if you no longer require the functionalities created by the app, you can cleanup resources created by the app through a simple one-click uninstall.

Examples of apps built using the frameworkAnchor

To better show all that's possible, here are two examples of apps built; one by our customer (Statistics Finland) and one by our Partner (Lokalise).

Statistics FinlandAnchor

250 users at Statistics Finland use the Hygraph platform to manage statistical data.

To reduce errors and improve efficiency, developers at Statistics Finland successfully added 2 functionalities to Hygraph using the app framework.

1. Setting conditional validationsAnchor

Hygraph offers validations on a field level, but no validation rules can be set across other fields within the same content entry.

For example, a custom rule where the author field can only have "Author1" or "Author2" linked when the publication field is set to "Publication1". And the author field can only have "Author3" or "Author4" linked when the publication field is set to Publication2.

Statistics Finland wanted to have their own conditional validation rules set in a similar manner.

Human errors would be minimized this way, as content editors can't save or publish a content entry unless it passes the rules set within.

Statistics Finland built an app using the new framework to add this functionality to Hygraph. The new app prevents content from being saved or published unless it passes certain validations. It also lets the content editor know within the sidebar what those rules are in case an error has been made.

2. Duplicating certain fields but not the othersAnchor

When you duplicate content in Hygraph, it copies data from all the fields of that entry into the newly created entry.

For content editors at Statistics Finland, not all fields are to be reused when duplicating content. With the normal functionality offered by Hygraph, they would have to erase the data that's not needed and add new data to those fields. This poses two challenges:

• It takes time to delete the previous data.
• It increases the chances of error as some of the data from the previous field may have not been replaced.

To solve this, developers at Statistics Finland built an app that only copies the required fields when content is duplicated and erases the rest.

There's more details to the story. We'd recommend signing up for our upcoming webinar to hear first-hand the developers from Statistics Finland talk about their app.

LokaliseAnchor

Lokalise is a localization management platform, which enables teams to build a collaborative and unified localization workflow, easily manage translation files , and create new locales for a wide range of digital products, from applications to websites.

The team at Lokalise collaborated with Hygraph to build an app that simplifies the process of translating content in Hygraph.

Without the app, content editors would have to copy content and add it to Lokalise for translation. This poses multiple challenges:

• The process makes it difficult to keep track of translations.
• It involves duplication of content and increases chances of error.

The Lokalise app solves this by providing a custom app for content editors to manage their translations. Through a single page, they can submit content for translation to Lokalise and import translated content back into Hygraph once it's ready, without developer help.

Get startedAnchor

Ready to build apps? Get started by following the steps in our detailed documentation.

Here's an example of how to build an app using the framework.

Nevertheless, do let us know what you think of the new app framework by sharing your feedback in our Slack Channel.