Contentful Part 1

Create an account

First things first, we need an account. Contentful offers three different pricing plans that suits different needs : Community, Team and Enterprise. Community is their free tier, and offers generous features and services. We'll be using the Community plan in this section. If you don't already have an account, head over to https://www.contentful.com/ and create one by clicking on the Sign up free button at the top right corner.

Create the content model

Then, we'll need to create the content model - the structure our content should follow. Click on the Content model tab, and then click on the blue Add content type button.

We need to give our model a name. Let's name it Author . The Api identifier is the variable name we'll give to this content type. Contentful automatically generates the Api identifier from the Name field, which is author . Let's leave it as is. You can add a description if you wish. Then, click on Create.

Now that our Author model is created, we'll need to add fields. Each author should have a name, a description, and an avatar. So let's add those!

On the right side, click on the blue Add field button. The first field we'll add is the name. Since a name is a text, let's select Text.

In the next screen, we need to provide the name of our field. Let's write Name . The field ID will be automatically generated. We can also configure how our field looks, and add validation to it by clicking on Create and configure . Click on that.

Let's check the This field represents the Entry title . This means the name we give to the Author will be the title displayed in the Content tab, later on.

Next, let's go the Validation tab. We'll just make this field required by checking the Required field box. Click on Confirm.

Now, let's add a description and an avatar.

• Description will be a Text type, Long text, and a required field.

• Avatar will be a Media type, One file, and a required field.

Once you're done adding the fields, remember to click on the Save green button at the top right corner.

Adding content

Now, it's time to add some content! Let's add at least three authors so in the next section, we can understand better how the Contentful API works. First, we'll go to Unsplash and find three pictures for the author avatars. Select three, download them, and we'll go back to Contentful.

In Contentful, let's go to the Content tab. Let's click on the Add Author blue button. You'll land on a new entry form. Fill in the fields for each author avatar you downloaded from Unsplash.

Don't forget to Publish (green button on the right side) for the avatar image you upload and once you're done filling in the fields of the Author entry.

Upcoming

Great! We added our content model as well as three different authors to Contentful! Now, we're ready to tackle the Contentful API. In the next section , we'll learn about the Content Delivery API, and how we can fetch content from Contentful to display in our React application.