Home Web Development Designing Web APIs with Strapi

Designing Web APIs with Strapi

By Khalid Elshafie , Mozafar Haider
books-svg-icon Book
eBook $24.99 $16.99
Print $30.99
Subscription $15.99 $10 p/m for three months
$10 p/m for first 3 months. $15.99 p/m after that. Cancel Anytime!
What do you get with a Packt Subscription?
This book & 7000+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with a Packt Subscription?
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with eBook + Subscription?
Download this book in EPUB and PDF formats, plus a monthly download credit
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with a Packt Subscription?
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with eBook?
Download this book in EPUB and PDF formats
Access this title in our online reader
DRM FREE - Read whenever, wherever and however you want
Online reader with customised display settings for better reading experience
What do you get with video?
Download this video in MP4 format
Access this title in our online reader
DRM FREE - Watch whenever, wherever and however you want
Online reader with customised display settings for better learning experience
What do you get with video?
Stream this video
Access this title in our online reader
DRM FREE - Watch whenever, wherever and however you want
Online reader with customised display settings for better learning experience
What do you get with Audiobook?
Download a zip folder consisting of audio files (in MP3 Format) along with supplementary PDF
What do you get with Exam Trainer?
Flashcards, Mock exams, Exam Tips, Practice Questions
Access these resources with our interactive certification platform
Mobile compatible-Practice whenever, wherever, however you want
BUY NOW $10 p/m for first 3 months. $15.99 p/m after that. Cancel Anytime!
eBook $24.99 $16.99
Print $30.99
Subscription $15.99 $10 p/m for three months
What do you get with a Packt Subscription?
This book & 7000+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with a Packt Subscription?
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with eBook + Subscription?
Download this book in EPUB and PDF formats, plus a monthly download credit
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with a Packt Subscription?
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with eBook?
Download this book in EPUB and PDF formats
Access this title in our online reader
DRM FREE - Read whenever, wherever and however you want
Online reader with customised display settings for better reading experience
What do you get with video?
Download this video in MP4 format
Access this title in our online reader
DRM FREE - Watch whenever, wherever and however you want
Online reader with customised display settings for better learning experience
What do you get with video?
Stream this video
Access this title in our online reader
DRM FREE - Watch whenever, wherever and however you want
Online reader with customised display settings for better learning experience
What do you get with Audiobook?
Download a zip folder consisting of audio files (in MP3 Format) along with supplementary PDF
What do you get with Exam Trainer?
Flashcards, Mock exams, Exam Tips, Practice Questions
Access these resources with our interactive certification platform
Mobile compatible-Practice whenever, wherever, however you want
  1. Free Chapter
    Chapter 1: An Introduction to Strapi
About this book
Strapi is a Node.js-based, flexible, open-source headless CMS with an integrated admin panel that anyone can use and helps save API development time. APIs built with Strapi can be consumed using REST or GraphQL from any client. With this book, you'll take a hands-on approach to exploring the capabilities of the Strapi platform and creating a custom API from scratch. This book will help JavaScript developers to put their knowledge to work by guiding them through building powerful backend APIs. You'll see how to effortlessly create content structures that can be customized according to your needs, and gain insights into how to write, edit, and manage your content seamlessly with Strapi. As you progress through the chapters, you'll discover a wide range of Strapi features, as well as understand how to add complex features to the API such as user authentication, data sorting, and pagination. You'll not only learn how to find and use existing plugins from the open-source community but also build your own plugins with custom functionality with the Strapi plugin API and add them to the admin panel. Finally, you'll learn how to deploy the API to Heroku and AWS. By the end of this book, you'll be able to build powerful, scalable, and secure APIs using Strapi.
Publication date:
February 2022
Publisher
Packt
Pages
310
ISBN
9781800560635

 

Chapter 1: An Introduction to Strapi

This chapter gives an introduction to Strapi. First, we will explain what Strapi is and what are the benefits of using it in developing API (short for application programming interface). Then, we will see how to set up and prepare our development environment to work with Strapi. Afterward, we will create a simple API to help us get started with Strapi. Finally, we will have a quick look at the server scripts offered by Strapi to start and stop the development server.

These are the topics we will cover in this chapter:

  • What is Strapi?
  • Why use Strapi? (The benefits of Strapi)
  • Preparing the development environment
  • Creating a Strapi application
  • Understanding server scripts
 

What is Strapi?

Strapi is a headless content management system (CMS).

A CMS is a software application used for web development that allows users to create, edit, and publish content.

A traditional CMS, such as WordPress, tightly couples the frontend and the backend—that is, the structure of the content and how it is presented. However, unlike traditional CMSes, a headless CMS is entirely decoupled from the presentation layer. The term headless comes from separating the head (the frontend) from the body (the backend). A headless CMS does not care about how the contents get displayed; instead, it provides a content-first approach with an API to access and display the data in any format desired.

You can see the differences between a traditional CMS and a headless CMS in the following diagram:

Figure 1.1: Traditional CMS versus headless CMS

Figure 1.1: Traditional CMS versus headless CMS

"Strapi" is wordplay for Bootstrap API. As the name suggests, it aims to help developers build (bootstrap) an API quickly. Strapi saves API development time through an integrated easy-to-use admin panel and a solid set of core features out of the box. Whether you are a backend, full stack, or frontend developer, you will find it extremely easy to get started with Strapi and API development without reinventing the wheel and wasting time in building common features such as basic create, read, update, and delete (CRUD) operations or authentication and authorization.

Now that we have familiarized ourselves with Strapi, let's see some of the advantages of using it.

 

Why use Strapi? (The benefits of Strapi)

There are several advantages to using Strapi, and we will outline some of the major benefits and reasons for using it next.

Open-source Node.js

Strapi is open-source and built on top of a popular Node.js framework: Koa. Its code is accessible and easily extendible. It's supported by a thriving company but also by a large community of contributors. You can find Strapi's code on GitHub at https://github.com/strapi/strapi.

Database-agnostic

Strapi can work with different database systems. It can be set up and configured to work with PostgreSQL, MySQL, MongoDB, and SQLite. We will see in Chapter 9, Production-Ready Applications, how we can configure Strapi to work with PostgreSQL.

Customizable (extendable)

Strapi is highly configurable to suit each project's specific requirements. All of the data types are created from scratch through the admin panel. Additionally, the Strapi plugin system makes it easy to extend its functionality with features such as database documenting, image uploads, and email configuration. We will discuss the Strapi plugin system in a later chapter of this book.

RESTful and GraphQL

Strapi provides a REpresentational State Transfer (REST) API out of the box. The API can be consumed from any web client (React, Angular, Vue.js, and so on), mobile applications, or even internet of things (IoT) applications using REST or GraphQL via a plugin.

Users and permissions

Strapi comes with a users and permissions model out of the box that allows you to define which endpoint is available for which user/role. Additionally, you can use Open Authorization (OAuth) to enable authentication via third-party providers such as GitHub, Facebook, Twitter, Google, and many others.

Now that we have understood what Strapi is all about, let's see how we can prepare our development environment to start developing our API.

 

Preparing the development environment

Before we start developing our API, we will need to prepare our development environment first. Next, we will look at the components and packages that we will be needing throughout the book.

Note

You can install the packages in any order you want. Some of the packages here are not a must-have, but it's highly recommended to install them to avoid having any issues while following the examples in this book.

Installing Node.js

To install Node.js, head to the official website, https://nodejs.org, and download the long-term support (LTS) version that matches your operating system. At the time of writing this book, version 16.13.2 is the latest LTS version and the version recommended by Strapi, as illustrated in Figure 1.2. Only LTS versions are supported by Strapi, the other versions of Node.js are not guaranteed to be compatible.

Figure 1.2: Node.js LTS version

Figure 1.2: Node.js LTS version

Once you have installed Node.js, open your favorite terminal and run the following command to verify the Node.js version:

node –v

You should see the version of the installed Node.js on the terminal.

Installing Visual Studio Code (optional)

Visual Studio Code (VS Code) is a feature-rich and powerful integrated development environment (IDE), and we will be using it as our default editor. You are free to use whichever editor you feel comfortable with. However, we highly recommend installing and using VS Code to follow along with the examples in this book.

To download and install VS Code, head to https://code.visualstudio.com and download and install the appropriate build for your operating system.

Installing Yarn

Yarn (https://yarnpkg.com) is a JavaScript package manager. We will be using it as our default package manager since it's the package manager used by Strapi itself.

To install Yarn, open your favorite terminal and execute the following command:

npm install -g yarn

Once the installation is complete, run the following command to verify that Yarn has been installed successfully:

yarn –v

The version of Yarn should be displayed in the terminal. At the time of writing this book, version 1.22 is the latest version.

Installing Docker (optional)

We will be using Docker to install and manage a Postgres database for our API in a later chapter of the book. Docker can help us easily work with different database systems such as Postgres, MySQL, or MongoDB. To install Docker, head to https://docker.com/get-started and download and install Docker Desktop for your operating system.

Once you have installed Docker, execute the following command in your terminal to verify the installation:

docker –version

The Docker version should be displayed in the terminal. At the time of writing this book, version 20.10 is the latest version.

Alternatively, you can install Postgres using a different method of your choice.

Installing Postman

Postman is a great API client, and we will use it to interact with our API. Head to the Postman website at https://www.postman.com/downloads/ and download the version matching your operating system.

Once we have the development environment set up, we can proceed with creating our API.

 

Creating a Strapi application

Begin by running the following command on your terminal:

yarn create strapi-app strapi-lms --quickstart 

The preceding command will set up a project using the latest version of Strapi with the default settings. Using a SQLite database, start the server on port 1337 and launch the admin dashboard.

Note

If we remove the –-quickstart flag, we will enter manual setup mode, where we will be asked a few questions to configure Strapi.

If the admin panel did not launch automatically, you can open your browser and navigate to http://localhost:1337/admin.

The first time you log in to the admin dashboard, you will be presented with a form to create the first administrator user. Complete the form to create an administrator user and sign in to the admin panel.

Overview of the admin panel

We will discuss the admin panel in greater detail in Chapter 4, An Overview of the Strapi Admin Panel. However, for now, we will just give a quick overview of the admin panel layout.

The admin panel is easy to navigate. On the left-hand side, we have our main control sidebar. It can be divided into three main categories, as follows:

Figure 1.3: Strapi main sidebar

Figure 1.3: Strapi main sidebar

Content Manager

This is where the API content lives, and you can manage API content from this section. At the moment, there is only one model, Users. We will see more models here as we progress in developing the API.

Plugins

The PLUGINS section allows you to customize Strapi. There are two essential plugins available out of the box: the Content-Type Builder and Media Library plugins.

The Content-Types Builder plugin is the core of Strapi customization; we will use it to create new models in our API and create a relationship between those models. As this plugin is critical in developing the API, we have dedicated Chapter 3, Strapi Content-Types, to discussing it in greater detail.

The Media Library plugin, as the name suggests, is used to manage all API media files.

General

This section contains Strapi settings where you can use the Marketplace to install new plugins, configure plugin settings, and edit general settings such as adding additional administrator users.

The --quickstart flag will bootstrap the Strapi application and start the development server for us. While you are developing a Strapi application, you will want to start and stop the server yourself. Let's see in the next section how to work with Strapi scripts to manage the server.

 

Understanding server scripts

Strapi comes with a few scripts that can be used in managing the development server as well as starting the server in production. If you open the package.json file, you will see the following four scripts:

Figure 1.4: Strapi server scripts

Figure 1.4: Strapi server scripts

The develop script

The develop script will start the server in development mode, with autoreload enabled. Basically, it will watch for any changes in the project files and restart the server if there are any. This script is intended for local development, and it should never be used in a production environment.

The start script

The start script will start the server with autoreload disabled. This script is intended to start the server in a production environment.

The build script

This script allows you to rebuild the admin panel. The Strapi admin panel is built using React.js, but in some situations, you might want to customize or extend the admin panel. In such cases, you will need to rebuild the admin panel again using the build script. The admin panel is built once when you have created a project and every time you install a plugin that requires changes to the admin panel.

The Strapi script

This script is an alias to the Strapi command-line interface (CLI), and we can use it to generate new content in our system. We will explore the Strapi CLI in the next chapter.

 

Summary

In this chapter, we started by explaining the concept of a headless CMS and saw how it is different from a traditional CMS. We then introduced Strapi, an open-source headless CMS, and listed the benefits of using Strapi in developing APIs.

Then, we started preparing the development environment and installed the requisite packages and software, as well as creating a sample application that we will be using throughout the rest of this book. Finally, we had a quick look at the different server scripts offered by Strapi.

In the next chapter, we will have a deeper look at the typical structure of a Strapi application. We will also build our first API in the system and learn how to use the Strapi Content-Types Builder plugin to define fields needed for the API.

About the Authors
  • Khalid Elshafie

    Khalid Elshafie is an experienced, senior full stack developer/software engineer with over 10 years of experience working across multiple frontend and backend technologies involved in designing and developing scalable web and mobile applications using multiple technologies, as well as in a variety of workplaces, from start-ups to larger consultancies. Khalid's passion for software engineering extends to the creation of barmaga.io, with Mozafar, where he has 45+ hours of video content on JavaScript, React.js, AWS and Serverless, Node.js, and Strapi. He also has a well-established YouTube channel with content focused on teaching programming.

    Browse publications by this author
  • Mozafar Haider

    Mozafar Haider is a senior full stack engineer with over 15 years of experience working in organizations ranging from early-stage start-ups to scale-ups and corporates, in Barcelona, London, and Glasgow, among other places. He's passionate about teaching coding, especially to groups under-represented in tech, and was one of the co-founders of a coding school for refugees based in Glasgow. He also created, along with Khalid, barmaga.io, a platform for teaching coding in Amharic, Arabic, and Swahili.

    Browse publications by this author
Designing Web APIs with Strapi
Unlock this book and the full library FREE for 7 days
Start now