Skip to main content

Introduction

Zerve is a Content System that helps your team adjust content and settings in your app without re-deploying.

"What the CMS?"

Let's start with a look at the past, present, and Zerve's future of Content Management Systems. If you want the big picture, see how Zerve might revolutionize the world of software development.

The History: monolithic Content Management Systems

In the early days of the web, before social media, the CMS was created to allow non-technical people to create and manage their content on the web. These systems were hugely successful, including Wordpress and others.

The monolithic CMS has fully integrated the end-user website, (the "head"), with the content dashboard and content database. The all-in-one nature made them relatively easy to set up, usually only requiring a database and a server which could run PHP.

Because they come as an all-in-one package, developers would struggle to work within their constraints. They enabled easy access to the non-technical team, but they interfered with the engineering team's ability to adopt the latest tech. As a result, they fell out of favor in professional settings.

The Now: The "Headless" Content Management System

Over the years, mobile platforms were introduced, so developers started building custom apps on each platform. These custom applications have slow and platform-specific build and deployment processes. So non-technical team members once again struggled to modify the content and settings of their apps.

In response, the industry moved towards 'Headless' content systems, which provide the content database and dashboard app, but drops the 'head', or end-user presentation layer. These systems provided more flexibility to the developers, but they introduced a heavy implementation cost because the developers were now required to build a custom presentation layer for their app on each platform.

To ease this burden, most headless content systems include a "client" library that helps your app query for data in the back-end.

Schemas and Type Safety

Modern headless Content Systems will help the developer write type-safe code against the back-end. The code might define the schema of the data in the store, which will get syncronized to the production store when the code is deployed. Or the production schema can be syncronized to the development environment, so that type safety will help the developer avoid potential errors in the application.

Z Future: A "Re-Headed" Content Management System

Zerve is a CMS with an optional presentation layer (head). The headless workflow is still supported, so you can define a custom schema for your content, that developers can consume with a type-safe client library.

Head-Optional, (Type-Safe!)

For example, say the developer has created a FAQ entry in the store, which defines a schema such as list<{ Question: text, Answer: text }>. The code could include the following:

import { useFAQ } from "../zerve/MyStore"; // auto-generated by Zerve

export default function App() {
const [faqList] = useFAQ();
return (
<Section>
{faqList.map(({ Question, Answer, $key }) => (
<Item key={$key}>
<Heading>{Question}</Heading>
<Text>{Answer}</Text>
</Item>
))}
</Section>
);
}

Thanks to a TypeScript integration, the developer can auto-complete the CMS values without having to look them up. Type errors will appear if the developer makes any mistakes. 😉

However, it may still take a lot of code to present the raw data from the CMS. And the presentation options are highly limited. So we may prefer to import the "head" from Zerve directly...

Re-Headed Integration

Zerve contains a number of pre-built schemas that come with a presentation layer. For example, the developer may set up a HomePageBanner entry in the store, using the Zerve's built-in HumanText schema, which can include links and ephasized text.

Now, the integration is easy:

import { HumanText } from "../zerve/my-zerve-store"; // auto-generated by Zerve

export default function App() {
const { data } = useHomePageBanner();
return <HumanText value={data} />;
}

Because Zerve builds on React Native, this <HumanText /> component can be used on the web, iOS, and Android. 🥳

If the developer can customized HumanText with a React Native text style prop, or they can use the HumanText schema and present it with their own code. 🤓

With fine-grained schemas to ensure valid data, and a type-safe integration, your whole team can be confident that the app will not break when people make changes in the Zerve Content dashboard.