All language subtitles for 004 Preloaded CMS Instance_en

Now that we've had a quick look at Strapi,

I'll show you how to set up the preconfigured Strapi

project that we'll use for our application.

Under this lecture's Resources you'll find

a file called "next-reviews-cms.zip".

Please download this to your machine.

I'll save it in the same folder that

contains the "next-reviews" project,

and then unzip it in the file manager.

Note that I didn't put it inside

the "next-reviews" project.

It's a separate application.

This folder contains all the code and the data.

The first thing we need to do

is install the dependencies.

And I'll do that in a standalone Terminal,

because we don't need to modify any code,

but you can open the project in Visual

Studio Code if you prefer.

Let's go into the "next-reviews-cms" folder,

and run "npm install" here.

This will take a minute or so.

Once it's done we want to build the application,

with "npm run build".

Since the collection types are preconfigured there's

no need to run the "develop" command.

We can launch "npm start" instead,

that should be a bit faster,

and this will start the Strapi server.

It runs on port 1337 by default.

The URL it printed here is actually misleading,

because it's showing "::" as the host name,

but "::" is actually a special IPv6 address

that means the server is listening

on all available interfaces.

It's like "0.0.0.0" in IPv4, if you

know a little bit about networking.

Anyway, the point is that, when

connecting to the server

we need to use "localhost" in the URL, not "::".

The port is 1337, and we want the admin page.

Now, here we need to log in, and

there's a preconfigured user

with email: "admin@example.com"

and the password is "Admin123", with a capital A.

We can also tick "Remember me"

so we won't have to log in again every time.

And this is the Strapi dashboard, as

we've seen in the previous video.

If we look in "Content-Type Builder", there's

already a "Review" collection type,

with all the fields we'll need for our website:

"slug", "title", "image", "body",

and then I've also added a "subtitle".

If we go to the "Content Manager" section,

here there are already a number of entries.

In fact, there are 25 reviews in total,

so we have enough items to implement

pagination as well.

Each review includes an image,

that I got from the RAWG Video Game Database,

and also a long review body,

that I generated using ChatGPT,

so we have a realistic amount

of text to show on the page.

Of course, each review has its own image,

as well as a different AI-generated text.

You can have some fun reading the

review bodies if you like,

and see if ChatGPT did a good

job of writing the articles.

Anyway, as we've seen in the previous video

Strapi automatically exposes

this content as an API.

So if we go and open "localhost" on port 1337

at the "/api/reviews" path,

we get in response a pretty large

JSON object with all the data.

Now, I have a Chrome extension installed

that formats the JSON nicely.

If you try this without that extension you'll probably

see a huge string with no indentation,

but it doesn't really matter.

We'll look at this data in more

detail in the next video,

when we'll start writing some

code to call the API.

But this is our CMS set up and ready

with plenty of data available to

use in our Next.js application.