If you are a developer using CMS systems, you probably aren't a stranger to Strapi, the open-source headless content management system that provides devs with the freedom to select the tools and frameworks that they prefer. At the same time, Strapi enables editors to manage and distribute their content by utilizing the administrative panel of their application, so it's a win-win for all.

The latest version of Strapi, version 4, has been reworked to v4.15.5, making it simpler to extend Strapi with plugins, smoothly migrate from one version to another, and improve API performance. While we anxiously await the anticipated v5's release, let's review the newest features currently available.

And if you're still running Strapi v3, what are you waiting for? You are seriously missing out, and you'll see why down below.

โœ๏ธ What's new on Strapi v4? ๐Ÿ”—

1. Strapi Design System ๐Ÿ”—

The Strapi Design System was released along with version 4 of Strapi as a system to meet the company's needs. However, it has been open-sourced, so anyone can use and contribute to it. It contains design guidelines that can be utilized within any frontend component. Developers can use a design system, a collection of reusable assets, to simplify and speed up the user interface development process.

You can see each component of the design systems within the official Strapi storybook.

An example of using the Button component can be seen below:

  1. First, install the Strapi design system within your application as a npm package.
npm install @strapi/design-system

2. The Button component should be imported at the very top of the file.

import { Button } from '@strapi/design-system';

3. Then, you can use it within the code.

<Button>Strapi Button</Button>

2. Plugin API ๐Ÿ”—

In v4, the Strapi plugin was simplified in terms of its creation and utilization. An application that uses Strapi can now have a Strapi plugin that interacts with both the back and front end of the application. ๐Ÿ”ฆ Unlike version 3, which loaded plugins based on pre-existing file structures and required the configuration of multiple files, Strapi v4 enables newly created plugins to have their own file structure.

It is essential to remember that plugins developed in version 3 will only be compatible with version 4 if they are migrated to version 4. It is also important to note that plugins developed with version 4 will not be compatible with older versions of Strapi. The official Strapi blog contains a comprehensive guide that addresses the process of migrating Strapi plugins from version 3 to version 4.

3. Database query engine ๐Ÿ”—

Strapi version 4 includes some significant enhancements, one of which is the capability for developers to interact with the database effectively through enhanced queries. The Strapi backend includes a query engine API for interacting with the database layer at a lower level, which can be accessed using strapi.db.query.

The Query Engine can perform a variety of operations on database entries. These include filtering, creating, and deleting entries, as well as paging and sorting. Some examples of these operations include findOne(), create(), and delete().

4. API Token ๐Ÿ”—

One of the new features implemented in version 4 is the API token. Access to the application's content can be granted to developers through API tokens rather than through the roles and permission route, which is easier and simpler. This allows developers to have access to the application's content in two modes:

  • Full access ๐Ÿ”
  • Read-only access ๐Ÿ”

This also allows users to authenticate their queries (both REST and GraphQL) using a token or access key, which is managed by the administrative panel. You can generate the tokens by going into the application's settings. Once the administrator has created them, they are permanent and can only be viewed once.

An overview of the creation of an API Token in Strapi. Source: Strapi

5. Error handling ๐Ÿ”—

Handling of errors was also improved in version 4. As a result of the standardization of error codes and the addition of meaning, it is now much simpler to comprehend the significance of each error, and it is also possible to better manage errors before they occur. Errors can be found within a Strapi controller's controller or in response to a request. The GitHub documentation contains a list of all of the error functions that are currently available.

The error code 400 (badRequest) serves as an example. ๐Ÿ” This code is used as a response in situations where the body sent along with a request contains a request that is either missing or invalid.

6. Content Versioning plugin ๐Ÿ”—

If you want to enhance your Strapi experience, it is worth checking out the Content Versioning plugin built by Notum Technologies. This plugin enables users to switch between different versions of content within your Strapi application and is available for Strapi version 4.6.2 and above.

Its main benefit is that it enables you to have multiple draft versions. This means that you'll be able to have different drafts and published data, as it keeps track of all changes from various content versions.

7. Internationalization ๐Ÿ”—

The internationalization (i18n) plugin built by Strapi enables users to create, manage, and distribute multilingual assets. It also allows admin panel users to create multiple localized versions of their content.

As you probably already know, internationalization is the process of designing and building products that can be adapted to specific languages or cultures. As a content management system (CMS) tool, Strapi provides support for internationalization by enabling users to generate, manage, and distribute localized content in a variety of languages, which are referred to as locales.

Developers can now construct localized projects by retrieving and consuming the appropriate content based on the audience's language or country of origin. This plugin is compatible with Strapi version 4.0.0 and higher. To explore it, you can install it and set it up within your Strapi project using the official marketplace documentation.

๐Ÿ’œ Bonus: Localazy plugin for Strapi ๐Ÿ”—

If you want to take your internationalization efforts further, Localazy offers its own plugin to automate the localization of your own Strapi project. ๐Ÿฆพ This makes it possible to translate content without any interruptions, making the content management process in multiple languages infinitely easier.

๐Ÿ‘‰ Explore the Localazy ft. Strapi plugin here, and set it up easily using the official Strapi marketplace documentation or our own guide.

โœ”๏ธ Conclusion ๐Ÿ”—

The latest version of Strapi offers new possibilities for merging content management with automated localization and i18n. Needless to say, the experience has improved! We encourage you to test these new features in your project and, if necessary, to update the older Strapi application to a more recent version to take advantage of all these benefits. You'll notice the difference.