The ultimate guide to Strapi: building flexible APIs with a headless CMS

With growing customer expectations, and incredible technological progress, the restrictions of traditional content management systems have imposed the fast growth and integration of Headless content management systems.

In traditional CMS content, images and code (HTML and CSS) are commingled, which makes reusing content impossible and creating a modern digital experience very hard. The approach used by platforms like WordPress, Drupal, and Sitecore which have been around from the early days of web development, has been created to store and present elements like text, images, and videos on websites only. As technological advances have imposed the development of modern solutions like evolving digital devices and channels, a more flexible solution for content has become imminent. Given the restrictions, a traditional CMS is no longer suitable for business purposes so the majority prefers using innovative technology allowing a fast, scalable, and easy content management system.

Introducing Headless CMS

This type of CMS separates the presentation layer from the backend one. It ‘unlocks’ the content making it reusable. It allows customers to manage it independently. Developers can build faster and automate changes which results in an easy-to-maintain project that is flexible and suits the business needs. Headless CMS allows the content to be stored and managed in one place and deployed to any selected digital channel later. Since the presentation and logic layers are completely separated, the headless CMS uses APIs to connect the two, making the content reusable at any point, on any device or technology that the future holds.

In this article, we are going to take a look at Strapi - a headless CMS solution used for developing websites, mobile applications, e-commerce websites, and APIs. The system builds APIs based on content models provided by the Strapi admin. Content models represent the data structure of all objects used in the business.

What is Strapi?

Headless CMS eliminates the difficulty of creating new projects quickly and easily. Some of the build key features which we are going to take a look at below play an important role in making Strapi flexible, scalable, and easy to maintain. Even though Strapi comes with a lot of benefits, it has some drawbacks to take into account. Strapi is a powerful tool that is most suitable for creating projects from scratch.

Key components - benefits and drawbacks

Databases

Strapi can work with various databases like PostgreSQL, MySQL, MongoDB, and SQLite. Running the installation script with ‘quickstart’ will automatically set up the Strapi project with the SQLite database. Custom installation script allows users to define their database of choice.

You can discover more options here.

Open source

Strapi was created using a Node.js framework named Koa which makes the system open-source and easy to access.

Customizable

Strapi admin provides single and collective content types which allow creating versatile objects to suit the business needs. Components are reusable fields that can be added to any content type to make it even more flexible and easy to maintain. Smart using of components can even optimize the performance of the Strapi application.

Apart from the structural solutions, the system has a wide range of plugins that can be implemented with one click. Check out this link for further information.

Rest API

The Rest API Strapi creates based on content types can be easily consumed by different types of client web and mobile frameworks.

Build in authorization system

Strapi comes with a built-in authorization system making it easy to give permissions to different kinds of users. These permissions will determine how the application behaves and which users can execute different endpoints.

H3: Drawbacks

• Migrating existing APIs is difficult. This makes Strapi suitable for projects that are built from scratch and managed only in Strapi. Moving the existing API to Strapi will take more time than creating it from scratch.
• Since there are paid plans Strapi is not completely open source and free. Different plans provide more flexibility, scalability, and additional features.
• Since Strapi is developing and improving the system constantly, the frequency of updates is high. This requires the user to be careful when implementing the system to prevent breaking the application.
• Limited TypeScript use

Setting up Strapi

Visit this link for more information.

Prerequisite

1. Node.js: Odd-number releases of Node, known as "current" versions of Node.js, are not supported (e.g. v19, v21).
2. Node.js package manager:

1. npm (v6 and above)
2. yarn

1. Python (if using a SQLite database)
2. Install git to deploy the project to Strapi Cloud.

Creating the project and registering the first local admin user

• Run the following command in the terminal. Define the name of the project in place of {project name here}.

yarn create strapi-app {project name here} --quickstart

or

npx create-strapi-app@latest {project name here} --quickstart

• Keep in mind that the ‘quickstart’ command will automatically set the Strapi application with the SQLite database.

The newly created project can be accessed at http://localhost:1337

• After the installation is finished, the browser opens a new tab with a registration form. This is the first step of creating the local admin user.

Note: If the server is no longer running anymore and you want to start it, use the instructions below.

Open a new terminal into the folder of the project and type npm run develop / yarn develop (to open Strapi in develop mode) or npm run start (to open Strapi in production mode). Keep in mind that opening Strapi in production mode won’t let you edit anything in the content type builder

Note: To close the server simultaneously click on Control + C on the keyboard

Note: If two or more Strapi projects have been created with the same account, keep in mind that you have to log out of one of the projects, to be able to access the other one with the same account. Go to your Strapi project, at the bottom left click on the account’s initials and click logout.

Build the content using the content-type builder

‍

The script has created an empty project. The content type builder is how the user creates data structures and where the project starts. Keep in mind that Strapi builds APIs based on content models created in the content type builder. Content models represent the data structure of all objects used in the business so it is really important to take the time and model the data so it fulfills the business requirements.

Create a new content type:

For more information please visit this link.

Choose between a collection type or a single type.

1. Select a type and click on ‘Create new collection type’.

3. Type the name in the ‘Display name’ field.
4. API ID holds the automatically pre-filled values of the content type name. Since this is a collection type it will be automatically pluralized when displayed in the Content Manager. It’s recommended to use singular names as the content type name so the pluralization won’t cause any issues.

5. (optional) Open the advanced settings to configure the content type
6. Click on ‘Continue’.
7. Add and configure the fields for the content type - each field can be set to hold different types of data (text, numbers, rick text, etc). If you want to know how to add relations, media, etc, you can click here.
   
   

• Default
• Custom

Creating components

For more information click here. 

Components are a combination of several fields. They allow us to create sets of code that can be reused as added in content types, dynamic zones, and other components. A component can be created using the content type builder.

Create a new content type and go to ‘Select fields for your collection type. Scroll down and click on ‘Component’.’

• Add a new component

• Add an existing component

Creating dynamic zones

Combination of components that can be added to different content types. They allow a structure that is flexible and meets the business requirements. Once the dynamic zones are created in the Content Manager, they can be rearranged and used as needed.

1. Configure the dynamic zone

2. Once the dynamic zone is configured, its components should be configured as well. Click on ‘Add components to the zone’.

• Add a new component
• Add an existing component

3. Add fields to the component

Deployment

In our experience deploying the Strapi project to either Strapi cloud or using Platform.sh has provided an easy and fast solution for all kinds of projects. To learn in-depth how to handle the deployment of Strapi projects with just a few clicks please visit the following links:

Deploy Strapi to a hosting server.

Project creation and deployment in Strapi cloud. 

Strapi deploy on Platform.sh. 

The strategic advantage of using Strapi in startup development.

A headless CMS is a powerful tool that is created to suit the fastly growing business models, innovative ideas, and customer requirements. It creates an ecosystem that allows easy, fast, and flexible content management that is no longer limited to web content only.

As a popular representative of the headless CMS family, Strapi combines all of the key benefits of the system providing a fast and scalable solution for new businesses. Its flexibility and ability to customize makes it among the most used headless CMS systems in the industry.

Using Strapi in startups proves to limit the time consumed for creating the project from scratch. In a matter of minutes and a few clicks, you have a preconfigured working environment that allows customization at the tip of your fingers. The low code/ no code technology can be set to work without writing any code which saves resources and time. It can be easily executed by a person with no programming background. The wide range of documentation and tutorials that Strapi provides explains in detail how to work with the system. Using Strapi in startups can benefit the business in many ways - having a fast, easy-to-maintain, scalable, and flexible system provides a smart solution for the startup requirements in the long run. 

As we've unravelled the possibilities using Strapi, it's evident that our expertise doesn't end here. Our developers possess a wealth of knowledge that goes way beyond just one platform. To discover how our team can elevate your project, we invite you to explore our services or get in touch.

‍