Skip to main content
Skip table of contents

HCMS Client Starter Kit

HCMS Client Starter Kit provides a fully functional Single Page Application, including a fully fledged frontend and middleware, mainly authorization.

Introduction and purpose

The Headless CMS Client Starter Kit is a code base that can be used as a starting point for developing web-based applications connected to the censhare Server using Headless CMS as a bridge.

Warning: At least a basic acquaintance with both products is strongly recommended.

The Kit includes the following parts:

  • A modular frontend built with React, JavaScript, and TypeScript with a few modules ready to be used out-of-the-box:
    • Authentication and authorization
    • User management
    • Legal terms (data protection terms, terms of service, copyright notice)
    • Theming configuration
  • A middleware implemented in TypeScript and Node.js that contains all backend parts of the aforementioned features. The middleware also performs two important functions:
    • Automatically deploys data model to HeadlessCMS on start
    • Provides special configuration-exposing endpoints for the frontend
  • Sample HeadlessCMS schemas (= representations of the data model) to support all out-of-the-box features plus some additional generic ones for images and documents.
  • Tools to create a Docker image build, with both frontend and backend combined in a single Docker image.

To start using the product, you will need to clone the source code and - optionally - customize it.

Browser compatibilitys

The web application can be used in the latest versions of the following browsers:

  • Chrome
  • Firefox
  • Edge
  • Safari

Implementing a new application

Warning: Please be aware that making use of the HCMS CSK requires development expertise in your team. It can be used off-shelf for a few basic operations, but any customization will involve development: programming and deployments.

A custom project typically involves the following stages and skills.

1 - Install the Client ("portal") on some infrastructure

Required skills for the cloud setup

This is the intended way to run this application in production and requires corresponding knowledge in your team.

  • AWS cloud administration or an alternative
  • Linux administration
  • docker
  • Network administration (DNS, reverse proxy/load balancer) #### Required skills for the development setup
  • Linux administration
  • docker and docker-compose
  • Optional, but strongly recommended: DNS and TLS PKI (ie https certificate)

2 - Create project-specific data structures and new HCMS schemas

Required skills:

  • knowledge of censhare data structures and core concepts
  • HCMS schemas
    • JSON format
    • basic knowledge of using HCMS API and general API tools for testing your schemas

3 - Add new frontend modules and required backend features

Required programming and deployment skills:

  • TypeScript, JavaScript
  • React.js
  • general frontend web development (HTML, CSS)
  • docker and docker-compose for running both backends locally

4 - Add new middleware endpoints if necessary

This stage is optional. Simple projects can be implemented just by doing modifications in the frontend. Required skills:

  • TypeScript
  • nodejs
  • Express web framework
  • Optional, but strongly recommended: docker and docker-compose for running everything locally

Full list of documentation articles

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.