Strapi - Selltim Help

III - Projects

This guide will give you a few tips on how to run and edit some things on the projects.

Back

Start the back project

In your project directory, run the following command to start the Strapi CMS project.

yarn develop

The back-office will be available on the following address : http://localhost:1337/admin

Add pages

Pages are listed under the COLLECTION TYPES category. Each page is a different type. When you create a new page, you will have to choose an API ID, this will be used later to retrieve the data on the front-end.

For further information, please refer to the Strapi documentation.

Front

Start the front project

In your project directory, run the following command to start the Next.JS project.

yarn dev

The front will be available on the following address : http://localhost:3000

Retrieve data from Strapi CMS

In order to retrieve data from the Strapi CMS, you can use the getData function on the front-end. Note that this function is only available on Server Components, read more about it on the Next.JS documentation.

Simple example to retrieve data for a page

Assuming you have a type configured on your back project, with API ID named home, containing a text field named heading.

const data = await getData('home', { populate: ['heading'] }) as Data;

Now, you can use the data in your page like this :

<div>{data['heading']}</div>

For further information, please refer to the Next.JS documentation.

Last modified: 14 novembre 2023