WhoBuilt

Dev Workflows with "Headless" Content Management: Time to Re-Attach the Head!

Sep 26, 2022· 25 min· 562 views·Watch on YouTube

Speaker

Eric Vicente, an open source developer associated with React Native, React Navigation, and Docusaurus, presents Callstack’s RNEU'22 talk about using and extending a headless CMS for React Native app workflows.

Why teams need a CMS

Teams maintain both an application codebase and its user database, while marketers, designers, and executives also need to change application content. When developers must make every change and deploy it, the process slows the team and takes time from product work. Vicente proposes a CMS dashboard so nontechnical teammates can manage content directly.

Headless CMS and typed data

Traditional CMS platforms such as WordPress combine content management with the web application, which makes serving App Store applications harder and limits developers’ choice of tools. A headless CMS separates the dashboard and content database from the application and exposes content through an API. In a demo of Zerv, Vicente creates a text field and a reusable FAQ schema, then explains how a CLI can read the schema and generate a type-safe client.

Adding human text to the app

A headless API still leaves developers to anticipate and manually render every content type. Vicente demonstrates Zerv’s experimental Human Text field, which lets a marketing editor add bold text and links without treating the content as a plain string. After syncing the schema and installing a rendering package, he shows the content in a React Native app on iPhone and Android, with developers retaining control over rendering and behavior.

Zerv’s direction and sustainability

Vicente describes possible future additions, including page components, images, video, low-code features, authentication, and real-time updates. He says Zerv is open source under Apache 2.0 and plans to support the project with a paid hosted service, while keeping the alpha free for at least six months and inviting side-project use and feedback. He cautions that it has rough edges and is not ready for production business use.

Takeaways

  • Use a CMS to let nontechnical teammates update app content without waiting for an engineering deploy.
  • Generate typed clients from content schemas to reduce uncertainty when consuming JSON APIs.
  • Model editable rich content explicitly when editors need formatting or links; a plain string cannot express those safely.
  • Keep developers in control of how CMS content is rendered, even when editors control its wording and emphasis.
  • Set clear expectations for an early hosted product: Vicente describes Zerv’s alpha as suitable for side projects, not production business use.

Mentioned in this talk

Search inside this talk

What was claimed 6

  • feature
    Zerv: Provides a JSON API and schema-based type-safe client generation
    “we can run a command-line program that will generate a type-safe client for us”
    YouTube
    Unverified1 source· Talk
  • integrates with
    Zerv integrates with TanStack Query
    “we’ll also get the Zerv client ... we’ll also install React Query”
    YouTube
    Unverified1 source· Talk
  • feature
    Zerv: Human Text supports bold formatting and inline links, rendered with a customizable React Native text component
    “the content person is making certain stuff bold”
    YouTube
    Unverified1 source· Talk
  • feature
    Zerv: Released under the permissive Apache 2.0 license
    “Zerv is properly open source ... under a permissive license—specifically, Apache 2.0”
    YouTube
    Unverified1 source· Talk
  • feature
    Zerv: A paid hosted service is planned; self-hosting is possible
    “I’m going to offer Zerv as a paid hosted service. Self-hosting is possible”
    YouTube
    Unverified1 source· Talk
  • metric
    Zerv: Free service planned for at least six months, until around April 2023
    “leave it running as a free service for at least the next six months”
    YouTube
    Unverified1 source· Talk

Related talks