With a strong presence in the industry, WordPress is employed by 40% of all websites. Even two decades since its inception, it continues to be the preferred platform for crafting blogs and websites. However, viewed from an engineer's perspective, the system poses numerous challenges.

I'm currently offering an open-source Headless CMS named Collections, a project I've been passionately developing over the past year. My motivation stems from a commitment to redefine the CMS landscape, addressing the issues I encountered with WordPress. Below is a summary of the development journey over the past year.

The Darkness of Black Magic

WordPress is a meticulously designed system, offering the convenience of updating the software from the admin panel to ensure users always have access to the latest version. It boasts extensive customization options and can be further enhanced through external plugins.

Yet, contamination from haphazardly added plugins and what some refer to as Black Magic code has hindered updates and exposed the system to vulnerabilities.

Indeed, the responsibility for this issue lies squarely with certain users.

Nevertheless, it's possible that this wasn't driven by malicious intent but rather a pursuit of a more advanced specification. In this context, extending beyond a user-specific problem, it suggests that humanity might no longer find satisfaction in the default WordPress.

Possibilities felt for headless

Headless is an architecture that separates the front end from the back end.

Traditional CMSs integrate both the front end and back end. By separating them, the front end can be tailored to diverse user segments, offering simplicity for light users and high customizability for advanced users. This system's separation naturally enhances maintainability.

Although adopting a headless approach may initially appear to exclude light users, we are confident that, in the long run, it's a system capable of satisfying a broad range of users.

Headless is beginning in other industries

The headless trend is already underway in other industries.

Tiptap, a tool that's becoming more prevalent in technical articles, serves as a specialized backend editor. Naturally, it doesn't operate as a standalone editor.

yarn add element-tiptap

npm install --save element-tiptap

import

By integrating it with the front end or developing a custom editor, Tiptap becomes adaptable to various user groups.

Users find the flexibility to switch the UI based on their proficiency level appealing. For Tiptap, separating the front end, with its numerous issues and requests, enables a concentrated focus on back-end feature development.

In the end, integrated software tends to diverge from the preferences of power users. Therefore, adopting a headless approach becomes an inevitable trend.

Collections was born!

Taking these considerations into account, I personally created an open-source headless CMS called Collections!

Index – Collections

A headless CMS that transforms your WordPress into an API. No need to copy and paste old posts anymore.

collections.dev

Here is a brief introduction to the features.

Define the data model

Fields can be added, ranging from text and markdown to images, etc., and the data model is established. Upon completion of the registration, the database schema is dynamically generated.

Register your content

Next, register content according to the data model.

Call as API

The endpoint is now set up!🥳
You can retrieve the registered content by making an API call from the front end or a smartphone app.

Support for migration from WordPress

Easily import your exported article data from WordPress by simply dragging and dropping. Say goodbye to the tedious task of copying and pasting old articles to get started!

Three Commitments

Must be open source

Effective collaboration with the front end is crucial for a headless CMS. Consequently, having open code becomes essential as a shared language for comprehending the interface and exchanging feature requests.

In contrast to Tiptap, transitioning to a headless CMS incurs a relatively high cost. This is due to the fact that, unlike editors which are easily replaceable tools, CMSs entail the complexity of data migration.

Moreover, the absence of normalized data in WordPress poses a migration challenge. To address this directly, Collections has crafted a migration tool as a plugin, which is also open source and available to the community.

https://github.com/collectionscms/plugin-wp-importer

Currently, we only have article data, but with the collaboration of developers worldwide, we aim to develop a tool that enables the transfer of all types of data!

Developer First

Collections is designed with a strong emphasis on developers. It can be deployed in any environment, offers ease of use, and comes with comprehensive documentation. A supportive developer community is also accessible on Discord.

In addition, the UI provides

• 😻 Markdown with GFM
• 🌒 Dark mode
• 📱 Responsive

We've got a complete set of essential tools for engineers to do their writing! 😎

Can be introduced with a one-liner

No matter how fantastic a product is, if it's challenging to implement, people won't use it. But, of course, there's no need to worry!

npx create-collections-app my-app

Installing the software is a breeze with just a few commands!

All that's left is to respond to the installer's questions to finalize the setup process.

// Select your database client
? Which one? SQLite is the simplest. (Use arrow keys)
❯ SQLite
  MySQL / MariaDB
  PostgreSQL

Collections Architecture

Backend UI

The backend UI is a combination of React + MUI + Ant Design.

For a headless CMS, all you need is an administration screen, so there's no requirement for an overly elaborate UI. That's why we opted for MUI due to its refined components. We chose Ant Design solely for its icons, as we personally appreciate its aesthetic.

API

The API is a powerful blend of Node.js + Express. When evaluating backend combinations, a crucial aspect is that it can be deployed in any environment. Hence, vendor-locked options like Next.js were excluded from the candidate list.

Database

Opting for RDB and supporting multiple vendors, we chose RDB for its versatility in deployment environments, ease of migration from WordPress, and the preference of many engineers who find RDB more user-friendly than NoSQL.

Given the dynamic nature of the schema, we employ Knex, a query builder, for database access.

Image

Currently, S3 is supported. Looking ahead, we plan to expand support to include Google and Azure storage, along with CDN delivery. There's quite a bit of work ahead... 😅

Hosting

As evident from the architecture, it comprises a fundamental structure. Consequently, it is adaptable to various environments, whether within or outside the network!

For your convenience, we've provided instructions for deploying on Lightsail, which is essential for cost-effective usage. Feel free to give it a try!

Amazon Lightsail – Collections

A headless CMS that transforms your WordPress into an API. No need to copy and paste old posts anymore.

collections.dev

Future Development

Launch of cloud version

In 2024, we're gearing up to introduce a cloud version. While it will come at a modest cost, it's perfect for those seeking swift implementation without the hassle of software updates. Stay tuned for its release, and we hope you're as excited about it as we are!

Build out migration tools from WordPress

Migrating 40% of our websites is a formidable undertaking, but we're collaborating with developers worldwide to tackle the challenge! We're counting on the support of developers from across the globe to help us overcome this hurdle!

Build an ecosystem with front-end

Observing examples like Tiptap and CMS, I anticipate a continued trend of increasing separation between the front and back end, leading to a more loosely coupled relationship between software components.

If you're a developer interested in creating applications in conjunction with Collections in the future, we'd love to collaborate with you! Let's work together to build a robust ecosystem 💪

Feedback and Request

Want to try Collections?

Collections is open source, available for free use by anyone. If you need help with implementation, feel free to join us on Discord 👇

https://discord.gg/a6FYDkV3Vk

Finally

A CMS is a product whose value is derived from its enduring appeal. The enduring popularity of WordPress, even after two decades, attests to this. I firmly believe that this is the very realm where engineers should leverage their strengths and dedicate their careers.

Resources
GitHub — Open source repository
Demo — Demo for those who want to get a taste of Collections functionality
Document — General Information, API Information
Discord — Developer Community
X — Latest Product Information

Your appreciation in the form of liking our articles or simply giving us a star on GitHub would be truly uplifting!

Thank you for your support!! 🙌