-
+
@@ -39,7 +39,7 @@
-
+
@@ -69,7 +69,7 @@
-
+
@@ -120,7 +120,7 @@
-
+
@@ -172,7 +172,7 @@
-
+
@@ -202,7 +202,7 @@
-
+
@@ -341,7 +341,7 @@
-
+
@@ -370,7 +370,7 @@
-
+
@@ -424,7 +424,7 @@
-
+
@@ -497,7 +497,7 @@
-
+
@@ -532,7 +532,7 @@
-
+
@@ -574,7 +574,7 @@
-
+
@@ -616,7 +616,7 @@
-
+
@@ -1273,7 +1273,7 @@
-
+
@@ -1313,7 +1313,7 @@
-
+
@@ -1326,7 +1326,7 @@
-
+
@@ -1339,7 +1339,7 @@
-
+
- `), a model
#### For Components models
-To create a component you will have to use the Content Type Builder from the Admin panel, there is not a cli generator for components.
+To create a component you will have to use the Content-Types Builder from the Admin panel, there is not a cli generator for components.
Or you can create your component manually by following the file path described previously and by following the file structure described below.
@@ -1775,7 +1775,7 @@ If you're using SQL databases, you should use the native SQL constraints to appl
To improve the Developer Experience when developing or using the administration panel, the framework enhances the attributes with these "security validations":
- `private` (boolean) — If true, the attribute will be removed from the server response. (This is useful to hide sensitive data).
-- `configurable` (boolean) - If false, the attribute isn't configurable from the Content Type Builder plugin.
+- `configurable` (boolean) - If false, the attribute isn't configurable from the Content-Types Builder plugin.
- `autoPopulate` (boolean) - If false, the related data will not populate within REST responses. (This will not stop querying the relational data on GraphQL)
#### Exceptions
diff --git a/docs/developer-docs/latest/getting-started/quick-start.md b/docs/developer-docs/latest/getting-started/quick-start.md
index 9a5c49cc8f..614b7ed8ee 100644
--- a/docs/developer-docs/latest/getting-started/quick-start.md
+++ b/docs/developer-docs/latest/getting-started/quick-start.md
@@ -1,150 +1,506 @@
---
-title: Quick Start Guide - Strapi Developer Documentation
+title: Quick Start Guide
description: Get ready to get Strapi, your favorite open-source headless cms up and running in less than 3 minutes.
+sidebarDepth: 0
+next: ./troubleshooting
---
# Quick Start Guide
-Get ready to get Strapi up and running in **less than 3 minutes** 🚀.
+
+
+
+
+
+
+Strapi offers a lot of flexibility. Whether you want to go fast and quickly see the final result, or would rather dive deeper into the product, we got you covered.
+
+:::warning PREREQUISITES
+
+Make sure [Node.js and npm are properly installed](/developer-docs/latest/setup-deployment-guides/installation/cli.md#step-1-make-sure-requirements-are-met) on your machine. It is also possible to use Yarn instead of npm (see [install the Yarn package](https://yarnpkg.com/en/)).
-
+
+
+By completing the form in the first tab, you create your own account. Once done, you become the first administator user of this Strapi application. Welcome aboard, commander!
+
+:::warning CONGRATULATIONS! 🥳
+Your blog is ready! You can start playing with Strapi and discover the product by yourself using our [User Guide](/user-docs/latest/getting-started/introduction.html), or proceed to part B below.
+
+Writing a blog is not your cup of tea? You can leave this guide and play with other [Starters](https://strapi.io/starters) on your own.
+:::
+
+## 🎨 Part B: Play with your content
+
+Strapi [starters](https://strapi.io/starters) build a full stack application and a data structure for you, so you can start playing with your content faster.
+
+We are about to contribute to the blog we have just created. Let's play with your application, by adding yourself as a writer and creating your own article, updating the homepage, and restarting the servers to look at the final result.
+
+:::tip TIP
+If the Strapi server is not already running, in your terminal, `cd` into the `my-project` folder and run `npm run develop` (or `yarn develop`) to launch it.
+:::
+
+### Step 1: Add yourself as a writer
+
+You have several ideas for great articles in mind. But first, the world needs to know who you are!
+
+Click on [Collection types > Writers](http://localhost:1337/admin/plugins/content-manager/collectionType/application::writer.writer?page=1&pageSize=10&_sort=name:ASC) in the main navigation, and click the **Add New Writers** button.
+
+
+
+1. Add your _Name_ and _Email_ in the corresponding fields.
+2. Add your favorite selfie in the _Picture_ field. You can either drag and drop an image or click the field and upload a file. Saying 'Cheese!' during the process is optional. 😄
+3. Click **Save**.
+
+### Step 2: Write & publish your first article
+
+To write an article, we need to add a new entry to the "Articles" collection type and fill in a few fields.
+
+
+
+Click on [Collection types > Articles](http://localhost:1337/admin/plugins/content-manager/collectionType/application::article.article?page=1&pageSize=10&_sort=title:ASC) in the main navigation, and click the **Add New Articles** button.
+
+#### Give your article a title, a description, and add some content
+
+1. Type `Hello World!` in the _Title_ field.
+2. Type `My very first article with Strapi` in the _Description_ field.
+3. Write a few lines in the _Content_ field. If you're lacking some inspiration, just type `This is my first blog article with Strapi and using it feels like a breeze!`.
+4. Scroll down and add a picture in the _Image_ field.
+
+#### Choose an author and a category for your article
+
+In the sidebar on the right, choose your name in the _Author_ drop-down list. You have just signed your first article with Strapi. Take a few seconds to contemplate this historic moment!
+
+While there, you might also want to choose a _Category_ for your article from the list.
+
+#### Turn your draft into a publication
+
+By default, your new article would be saved as a draft. Let's not be too shy and publish it right away.
+
+To publish an article, click the **Publish** button at the top of the window.
+
+You have just created and published your first article, "Hello World!". You can find it in the [Collection types > Articles](http://localhost:1337/admin/plugins/content-manager/collectionType/application::article.article?page=1&pageSize=10&_sort=id:DESC) view.
+
+### Step 3: Update the `Homepage` single type
+
+It's time to make this blog a bit more yours.
+
+Click on [Single Types > Homepage](http://localhost:1337/admin/plugins/content-manager/singleType/application::homepage.homepage) in the main navigation. Let's edit this homepage:
+
+1. Replace the image in the _ShareImage_ field.
+2. At the bottom of the page, update the _Title_ to `My Wonderful Strapi Blog` in the _Hero_ field group.
+3. Click **Save**.
+
+### Step 4: Restart the servers to reflect latest changes
+
+Gatsby is a static-site generator. It means that you need to restart the servers for changes to appear on the front end:
+
+1. In your terminal, press `Ctrl-C` to stop the servers.
+2. Make sure you are in the `my-project` folder. If not, type `cd my-project` and press Enter.
+3. Restart the servers by typing `npm run develop` (or `yarn develop`) and press Enter.
+After a few moments, you should see your blog with its updated title running at [http://localhost:8000](http://localhost:8000). The "Hello World!" article you have just created is also visible at the bottom of the page.
+
+
+
+:::warning CONGRATULATIONS! 🥳
+Now you know how to use Strapi to create and update your blog. Keep on creating amazing content!
:::
-::: tab npx
+## ⏩ What to do next?
+
+The beauty of using Strapi [starters](https://strapi.io/starters) is that the Strapi back end comes with a front end ready out-of-the-box. Now you probably want to show your shiny new website to the world! The next step is then to deploy both the Strapi back end and the front end on the platforms of your choice:
+
+👉 You can deploy the Strapi back end on various services: Amazon AWS, Microsoft Azure, DigitalOcean, Google App Engine, Heroku, and many more (see our [Deployment guides](/developer-docs/latest/setup-deployment-guides/deployment.md)).
+
+👉 Deploying the front end mostly depends on the technology it's based on. The easiest way to deploy your Gatsby blog front end is probably to [deploy on Gatsby Cloud](https://support.gatsbyjs.com/hc/en-us/articles/360052324714-Connecting-to-Strapi).
+
+:::danger 🤓 To go further with starters
+
+* Read more about the [starters CLI](https://strapi.io/blog/announcing-the-strapi-starter-cli) on our blog.
+* Start another project! We have lots of other [Starters](https://strapi.io/starters) you can use to kickstart your blog, e-commerce, corporate website, or portfolio project.
+:::::
+
+::::: tab Hands-on
+
+## 🚀 Part A: Create a new project with Strapi
+
+### Step 1: Run the installation script
+
+Run the following command in a terminal:
+
+:::: tabs card
+::: tab npm
```bash
-npx create-strapi-app my-project --quickstart
+ npx create-strapi-app my-project --quickstart
```
-
:::
+::: tab yarn
+```bash
+ yarn create strapi-app my-project --quickstart
+```
+:::
::::
-## 2. Create an Administrator user
+### Step 2: Register the first administrator user
+
+Once the installation is complete, your browser automatically opens a new tab.
+
+By completing the form, you create your own account. Once done, you become the first administator user of this Strapi application. Welcome aboard, commander!
+
+You now have access to the [admin panel](http://localhost:1337/admin):
+
+
+
+:::warning 🥳 CONGRATULATIONS!
+You have just created a new Strapi project! You can start playing with Strapi and discover the product by yourself using our [User Guide](/user-docs/latest/getting-started/introduction.md), or proceed to part B below.
+:::
+
+## 🛠 Part B: Build your content
+
+The installation script has just created an empty project. We will now guide you through creating a restaurants directory, inspired by our [FoodAdvisor](https://github.com/strapi/foodadvisor) example application.
-Navigate to [**http://localhost:1337/admin**](http://localhost:1337/admin).
+In short, we will create a data structure for your content, then add some entries and publish them, so that the API for your content can be consumed.
-Complete the form to create the first **Administrator** user.
+The admin panel of Strapi runs at [http://localhost:1337/admin](http://localhost:1337/admin). This is where you will spend most of your time creating and updating content.
-## 3. Create a Restaurant Content Type
+:::tip TIP
+If the server is not already running, in your terminal, `cd` into the `my-project` folder and run `npm run develop` (or `yarn develop`) to launch it.
+:::
+
+### Step 1: Create collection types with the Content-Types Builder
+
+The Content-Types Builder plugin helps you create your data structure. When creating an empty project with Strapi, this is where to get the party started!
+
+#### Create a "Restaurant" collection type
+
+Your restaurants directory will eventually include many restaurants, so we need to create a "Restaurant" collection type. Then we can describe the fields to display when adding a new restaurant entry:
+
+1. Go to [Plugins > Content-Types Builder](http://localhost:1337/admin/plugins/content-type-builder) in the main navigation.
+2. Click on **Create new collection type**.
+3. Type `restaurant` for the _Display name_, and click **Continue**.
+4. Click the Text field.
+5. Type `name` in the _Name_ field.
+6. Switch to the _Advanced Settings_ tab, and check the **Required field** and the **Unique field** settings.
+7. Click on **Add another Field**.
+8. Choose the Rich Text field.
+9. Type `description` under the _Name_ field, then click **Finish**.
+10. Finally, click **Save** and wait for Strapi to restart.
+
+
+
+Once Strapi has restarted, "Restaurants" is listed under Collection Types in the main navigation. Wow, you have just created your very first content type! It was so cool — let's create another one right now, just for pleasure.
+
+#### Create a "Category" collection type
+
+It would help getting a bit more organized if our restaurants directory had some categories. Let's create a "Category" collection type:
+
+1. Go to [Plugins > Content-Types Builder](http://localhost:1337/admin/plugins/content-type-builder) in the main navigation.
+2. Click on **Create new collection type**.
+3. Type `category` for the _Display name_, and click **Continue**.
+4. Click the Text field.
+5. Type `name` in the _Name_ field.
+6. Switch to the _Advanced Settings_ tab, and check the **Required field** and the **Unique field** settings.
+7. Click on **Add another Field**.
+8. Choose the Relation field.
+9. On the right side, click the _Category_ relational fields box and select "Restaurant".
+10. In the center, select the icon that represents "many-to-many" . The text should read `Categories has and belongs to many Restaurants`.
+
+
+
+9. Finally, click **Finish**, then the **Save** button, and wait for Strapi to restart.
-Navigate to [**PLUGINS** - **Content Type Builder**](http://localhost:1337/admin/plugins/content-type-builder), in the left-hand menu.
+### Step 2: Use the collection types to create new entries
-- Click the **"+ Create new collection type"** link
-- Type `restaurant`, and click `Continue`
-- Click the **Text** field
-- Type `name` in the **Name** field
-- Click over to the **ADVANCED SETTINGS** tab, and check the `Required field` and the `Unique field`
-- Click the **"+ Add another Field"** button
-- Click the **Rich Text** field
-- Type `description` under the **BASE SETTINGS** tab, in the **Name** field
-- Click `Finish`
-- Click the **Save** button and wait for Strapi to restart
+Now that we have created a basic data structure with 2 collection types, "Restaurant" and "Category", let's use them to actually add content by creating new entries.
+#### Create an entry for the "Restaurant" collection type
-## 4. Create a Category Content type
+1. Go to [Collection types > Restaurants](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant) in the main navigation.
+2. Click on **Add New Restaurants**.
+3. Type the name of your favorite local restaurant in the _Name_ field. Let's say it's `Biscotte Restaurant`.
+4. In the _Description_ field, write a few words about it. If you're lacking some inspiration, you can use `Welcome to Biscotte restaurant! Restaurant Biscotte offers a cuisine based on fresh, quality products, often local, organic when possible, and always produced by passionate producers.`
+5. Click **Save**.
-Navigate back to [**PLUGINS** - **Content Type Builder**](http://localhost:1337/admin/plugins/content-type-builder), in the left-hand menu.
+
-- Click the **"+ Create new collection type"** link
-- Type `category`, and click `Continue`
-- Click the **Text** field
-- Type `name` under the **BASE SETTINGS** tab, in the **Name** field
-- Click over to the **ADVANCED SETTINGS** tab, and check the `Required field` and the `Unique field`
-- Click the **"+ Add another field"** button
-- Click the **Relation** field
-- On the right side, click the **Category** dropdown and select, `Restaurant`
-- In the center, select the icon that represents `many-to-many`. The text should read, `Categories has and belongs to many Restaurants`
-- Click `Finish`
-- Click the **Save** button and wait for Strapi to restart
+The restaurant is now listed in the [Collection types > Restaurants](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant) view.
-## 5. Add content to "Restaurant" Content Type
+#### Add Categories
-Navigate to [**COLLECTION TYPES** - **Restaurants**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant), in the left-hand menu.
+Let's go to [Collection types > Categories](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category) and create 2 categories:
-- Click on **+ Add New Restaurants** button. Type `Biscotte Restaurant` in the **Name** field. Type `Welcome to Biscotte restaurant! Restaurant Biscotte offers a cuisine based on fresh, quality products, often local, organic when possible, and always produced by passionate producers.` into the **Description** field.
-- Click **Save**.
+1. Click on **Add New Categories**.
+2. Type `French Food` in the _Name_ field.
+4. Click **Save**.
+5. Go back to _Collection types > Categories_, then click again on **Add New Categories**.
+6. Type `Brunch` in the _Name_ field, then click **Save**.
-If you navigate back [**COLLECTION TYPES** - **Restaurants**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant), you will see your restaurant listed in the entries.
+
-## 6. Add categories to the "Category" Content Type
+The "French Food" and "Brunch" categories are now listed in the [Collection types > Categories](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category) view.
-Navigate to [**COLLECTION TYPES** - **Categories**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category).
+#### Add a Category to a Restaurant
-- Click on **+ Add New Categories** button. Type `French Food` in the **Name** field. Select `Biscotte Restaurant`, on the right in the **Restaurant (0)** dropdown.
-- Click **Save**.
+Go to [Collection types > Restaurants](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant) in the main navigation, and click on "Biscotte Restaurant".
-Navigate back to [**COLLECTION TYPES** - **Categories**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category). You will see the **French Food** category listed in the entries.
+In the right sidebar, in the **Categories** drop-down list, select "Brunch". Click **Save**.
-- Click on **+ Add New Categories** button. Type `Brunch` in the **Category** field. **DO NOT ADD** `Biscotte Restaurant` to the `Restaurants` dropdown on the right.
-- Click **Save**.
+### Step 3: Set Roles & Permissions
-You will see the **Brunch** category listed in the entries.
+We have just added a restaurant and 2 categories. We now have enough content to consume (pun intended). But first, we need to make sure that the content is publicly accessible through the API:
-Navigate back to [**COLLECTION TYPES** - **Restaurants**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant).
+1. Click on _General > Settings_ at the bottom of the main navigation.
+2. Under _Users & Permissions Plugin_, choose [Roles](http://localhost:1337/admin/settings/users-permissions/roles).
+3. Click the **Public** role.
+4. Scroll down under _Permissions_.
+5. In the _Application_ tab, find _Restaurant_.
+6. Click the checkboxes next to **find** and **findone**.
+7. Repeat with _Category_: click the checkboxes next to **find** and **findone**.
+8. Finally, click **Save**.
-- Click on `Biscotte Restaurant`.
-- On the right, under **Categories(1)**, `select` the `Add an item...`, and add **Brunch** as a category for this restaurant, and click the **Save** button.
+
-You have now seen **two different ways** to use the **relation** field type to add and connect relations between Content Types.
+### Step 4: Publish the content
-## 7. Set Roles and Permissions
+By default, any content you create is saved as a draft. Let's publish our categories and restaurant.
-Navigate to [**GENERAL** > **Settings** > **USERS & PERMISSIONS PLUGIN** > **Roles**](http://localhost:1337/admin/settings/users-permissions/roles).
+First, navigate to [Collection types > Categories](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category). From there:
-- Click the **Public** Role.
-- Scroll down under **Permissions**, open the **Application** tab and find **Restaurant**. Click the checkbox next to **find** and **findone**.
-- Repeat and find **Category**. Click the checkbox next to **find** and **findone**.
-- Click **Save**.
+1. Click the "Brunch" entry.
+2. On the next screen, click **Publish**.
+3. In the _Please confirm_ window, click **Yes, publish**.
-## 8. Publish the content
+Then, go back to the Categories list and repeat for the "French food" category.
+
+Finally, to publish your favorite restaurant, go to [Collection types > Restaurants](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant), click the restaurant entry, and **Publish** it.
+
+
+### Step 5: Use the API
+
+OK dear gourmet, we have just finished creating our content and making it accessible through the API. You can give yourself a pat on the back — but you have yet to see the final result of your hard work.
+
+There you are: the list of restaurants is accessible at [http://localhost:1337/restaurants](http://localhost:1337/restaurants).
+
+Try it now! The result should be similar to the example response below 👇.
+
+::: details Click me to view an example of API response
+
+```json
+[
+ {
+ "id":1,
+ "name":"Biscotte Restaurant",
+ "description":"Welcome to Biscotte restaurant! Restaurant Biscotte offers a cuisine based on fresh, quality products, often local, organic when possible, and always produced by passionate producers.",
+ "published_at":"2021-05-27T15:46:43.097Z",
+ "created_at":"2021-05-27T15:40:01.290Z",
+ "updated_at":"2021-05-27T15:46:43.110Z",
+ "categories":[
+ {
+ "id":1,
+ "name":"French Food",
+ "published_at":"2021-05-27T15:46:14.704Z",
+ "created_at":"2021-05-27T15:41:59.725Z",
+ "updated_at":"2021-05-27T15:46:14.725Z"
+ },
+ {
+ "id":2,
+ "name":"Brunch",
+ "published_at":"2021-05-27T15:46:02.015Z",
+ "created_at":"2021-05-27T15:42:29.201Z",
+ "updated_at":"2021-05-27T15:46:02.035Z"
+ }
+ ]
+ }
+]
+```
+
+:::
+
+:::warning 🥳 CONGRATULATIONS!
+Now your content is created, published, and you have permissions to request it through the API.
+Keep on creating amazing content!
+:::
-By default, any content you create is saved as a draft. To publish your content:
+## ⏩ What to do next?
-Navigate back to [**COLLECTION TYPES** - **Categories**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category)
+### Consume your API
-- Click the **Draft** button on the **Brunch** category.
-- Click **Publish** button.
-- In the **Please confirm** dialog, click **Yes, publish** button.
-- Repeat for the **French food** category and **Biscotte Restaurant**.
+You can learn how to consume your API with your favorite frameworks, front-end or back-end programming languages by choosing one in the list below.
-## 9. Consume the Content Type's API
+
-
+::::::
diff --git a/docs/developer-docs/latest/guides/auth-request.md b/docs/developer-docs/latest/guides/auth-request.md
index 47789a72d8..437f2041ea 100644
--- a/docs/developer-docs/latest/guides/auth-request.md
+++ b/docs/developer-docs/latest/guides/auth-request.md
@@ -21,7 +21,7 @@ We will have one group of users that will be able to only fetch **Articles** and
Lets create a new Content Type **Article**
-- Click on `Content Type Builder` in the left menu
+- Click on `Content-Types Builder` in the left menu
- Then `+ Create new content-type`
- Fill `Display name` with `article`
- Create 2 fields
diff --git a/docs/developer-docs/latest/guides/scheduled-publication.md b/docs/developer-docs/latest/guides/scheduled-publication.md
index f2f4bfe787..ae214fad02 100644
--- a/docs/developer-docs/latest/guides/scheduled-publication.md
+++ b/docs/developer-docs/latest/guides/scheduled-publication.md
@@ -15,7 +15,7 @@ What we want here is to be able to set a publication date for an article, and at
For this example, we will have to add a `publish_at` attribute to the **Article** Content Type.
-- Click on the Content Type Builder link in the left menu
+- Click on the Content-Types Builder link in the left menu
- Select the **Article** Content Type
- Add another field
- `date` attribute named `publish_at` with `datetime` type
diff --git a/docs/developer-docs/latest/setup-deployment-guides/deployment/hosting-guides/heroku.md b/docs/developer-docs/latest/setup-deployment-guides/deployment/hosting-guides/heroku.md
index 53c3bb27c2..61768b388b 100644
--- a/docs/developer-docs/latest/setup-deployment-guides/deployment/hosting-guides/heroku.md
+++ b/docs/developer-docs/latest/setup-deployment-guides/deployment/hosting-guides/heroku.md
@@ -446,7 +446,7 @@ If you see the Strapi Welcome page, you have correctly set-up, configured and de
You can now continue with the [Tutorial - Creating an Admin User](/developer-docs/latest/getting-started/quick-start.md#_2-create-an-administrator-user), if you have any questions on how to proceed.
::: warning
-For security reasons, the Content Type Builder plugin is disabled in production. To update content structure, please make your changes locally and deploy again.
+For security reasons, the Content-Types Builder plugin is disabled in production. To update content structure, please make your changes locally and deploy again.
:::
### Project updates
diff --git a/docs/developer-docs/latest/update-migration-guides/migration-guides/migration-guide-alpha.12.3-to-alpha.12.4.md b/docs/developer-docs/latest/update-migration-guides/migration-guides/migration-guide-alpha.12.3-to-alpha.12.4.md
index 2f60b98a50..66a0353157 100644
--- a/docs/developer-docs/latest/update-migration-guides/migration-guides/migration-guide-alpha.12.3-to-alpha.12.4.md
+++ b/docs/developer-docs/latest/update-migration-guides/migration-guides/migration-guide-alpha.12.3-to-alpha.12.4.md
@@ -9,7 +9,7 @@ description: Learn how you can migrate your Strapi application from alpha.12.3 t
- Add search to content manager
- Add bulk actions in content-manager
-- Add Enumeration type to content type builder
+- Add Enumeration type to Content-Types Builder
**Useful links:**
diff --git a/docs/package.json b/docs/package.json
index 1348b6de52..338d0ad6e5 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -12,11 +12,13 @@
"@vuepress/plugin-google-analytics": "^1.7.1",
"@vuepress/plugin-medium-zoom": "^1.7.1",
"vuepress": "^1.7.1",
+ "vuepress-plugin-code-copy": "^1.0.6",
"vuepress-plugin-element-tabs": "^0.2.8",
"vuepress-plugin-font-awesome": "1.90.6",
"vuepress-plugin-seo": "^0.1.4"
},
"devDependencies": {
+ "@vuepress/plugin-back-to-top": "^1.8.2",
"vuepress-plugin-check-md": "^0.0.2"
},
"author": {
diff --git a/docs/yarn.lock b/docs/yarn.lock
index 652d8162ca..3fab5eab47 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -1132,6 +1132,13 @@
dependencies:
lodash.debounce "^4.0.8"
+"@vuepress/plugin-back-to-top@^1.8.2":
+ version "1.8.2"
+ resolved "https://registry.yarnpkg.com/@vuepress/plugin-back-to-top/-/plugin-back-to-top-1.8.2.tgz#e9794409d1d589e4952b0700291270d2696e6d01"
+ integrity sha512-htAf2m8+6cGmYQexWerznGBY10y1E4TBfebYC3Y3wqNjFjvXUmRKcAG/u6Yxvey4OFkQUxbth2ilKi/GlIW8aQ==
+ dependencies:
+ lodash.debounce "^4.0.8"
+
"@vuepress/plugin-google-analytics@^1.7.1":
version "1.8.0"
resolved "https://registry.yarnpkg.com/@vuepress/plugin-google-analytics/-/plugin-google-analytics-1.8.0.tgz#99752be07867730df27e830a15c95b3f25b04741"
@@ -8153,6 +8160,11 @@ vuepress-plugin-check-md@^0.0.2:
dependencies:
check-md "1.0.0"
+vuepress-plugin-code-copy@^1.0.6:
+ version "1.0.6"
+ resolved "https://registry.yarnpkg.com/vuepress-plugin-code-copy/-/vuepress-plugin-code-copy-1.0.6.tgz#6431dab764b48b5b203e4936d98b1943651ce4ad"
+ integrity sha512-FiqwMtlb4rEsOI56O6sSkekcd3SlESxbkR2IaTIQxsMOMoalKfW5R9WlR1Pjm10v6jmU661Ex8MR11k9IzrNUg==
+
vuepress-plugin-container@^2.0.2:
version "2.1.5"
resolved "https://registry.yarnpkg.com/vuepress-plugin-container/-/vuepress-plugin-container-2.1.5.tgz#37fff05662fedbd63ffd3a5463b2592c7a7f3133"
diff --git a/qsg-handson-part2-04-roles.png b/qsg-handson-part2-04-roles.png
new file mode 100644
index 0000000000..2a43f7f21f
Binary files /dev/null and b/qsg-handson-part2-04-roles.png differ
+
+
diff --git a/docs/README.md b/docs/README.md
index 382917b014..1b5243b215 100644
--- a/docs/README.md
+++ b/docs/README.md
@@ -1,5 +1,5 @@
---
meta:
- - http-equiv: refresh
- content: 0;url=/documentation/developer-docs/latest/getting-started/introduction.html
+ - http-equiv: refresh
+ content: 0;url=/developer-docs/latest/getting-started/introduction.html
---
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/icon_manytomany.png b/docs/developer-docs/latest/assets/quick-start-guide/icon_manytomany.png
new file mode 100644
index 0000000000..e3c2af27ad
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/icon_manytomany.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-categories.gif b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-categories.gif
new file mode 100644
index 0000000000..5fa003b2ec
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-categories.gif differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part1-01-admin_panel.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part1-01-admin_panel.png
new file mode 100644
index 0000000000..cd5b8031da
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part1-01-admin_panel.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-01-restaurant_ct.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-01-restaurant_ct.png
new file mode 100644
index 0000000000..12a87f5a75
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-01-restaurant_ct.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-02-collection_ct.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-02-collection_ct.png
new file mode 100644
index 0000000000..7f24b76419
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-02-collection_ct.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-03-categories.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-03-categories.png
new file mode 100644
index 0000000000..10cd9facc5
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-03-categories.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-03-restaurant.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-03-restaurant.png
new file mode 100644
index 0000000000..910b5fa6e3
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-03-restaurant.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-04-roles.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-04-roles.png
new file mode 100644
index 0000000000..2a43f7f21f
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-part2-04-roles.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-publish.gif b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-publish.gif
new file mode 100644
index 0000000000..adb5ecab8e
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-publish.gif differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-restaurant.gif b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-restaurant.gif
new file mode 100644
index 0000000000..9df1bb9fb5
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-handson-restaurant.gif differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-restart-servers.gif b/docs/developer-docs/latest/assets/quick-start-guide/qsg-restart-servers.gif
new file mode 100644
index 0000000000..ca8c25ac68
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-restart-servers.gif differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part1-01-admin_panel.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part1-01-admin_panel.png
new file mode 100644
index 0000000000..8d128cc388
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part1-01-admin_panel.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part1-01-gatsby_fe.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part1-01-gatsby_fe.png
new file mode 100644
index 0000000000..ec9d4b4a60
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part1-01-gatsby_fe.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part1-01-register.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part1-01-register.png
new file mode 100644
index 0000000000..02425f3b46
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part1-01-register.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-01-writer.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-01-writer.png
new file mode 100644
index 0000000000..184dac5718
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-01-writer.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-02-write_article.png b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-02-write_article.png
new file mode 100644
index 0000000000..258cff8b65
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-02-write_article.png differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-03-write_publish_article.gif b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-03-write_publish_article.gif
new file mode 100644
index 0000000000..dda559f75e
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-03-write_publish_article.gif differ
diff --git a/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-04-restart_servers.gif b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-04-restart_servers.gif
new file mode 100644
index 0000000000..46866daac6
Binary files /dev/null and b/docs/developer-docs/latest/assets/quick-start-guide/qsg-starters-part2-04-restart_servers.gif differ
diff --git a/docs/developer-docs/latest/developer-resources/content-api/content-api.md b/docs/developer-docs/latest/developer-resources/content-api/content-api.md
index 88e964fb62..80d26632d1 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/content-api.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/content-api.md
@@ -820,7 +820,7 @@ DELETE http://localhost:1337/restaurants/1
::: warning
-By default, the filters can only be used from `find` and `count` endpoints generated by the Content Type Builder and the [CLI](../cli/CLI.md).
+By default, the filters can only be used from `find` and `count` endpoints generated by the Content-Types Builder and the [CLI](../cli/CLI.md).
:::
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/11ty.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/11ty.md
index 46d4a7c0f4..90a2a5211c 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/11ty.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/11ty.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with 11ty
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [11ty](https://www.11ty.dev/) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/angular.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/angular.md
index 376935c2f5..04ecd728d7 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/angular.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/angular.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Angular
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Angular](https://angular.io) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/gatsby.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/gatsby.md
index a6fd2baff6..2160c3470c 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/gatsby.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/gatsby.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Gatsby
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Gatsby](https://www.gatsbyjs.org/) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/graphql.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/graphql.md
index 56026dafea..4761bd65e3 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/graphql.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/graphql.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with GraphQL
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [GraphQL](https://graphql.org/) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/gridsome.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/gridsome.md
index e46f39b704..317ac16c61 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/gridsome.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/gridsome.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Gridsome
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Gridsome](https://gridsome.org/) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/jekyll.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/jekyll.md
index eb5776da0e..97ba4b5c55 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/jekyll.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/jekyll.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Jekyll
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Jekyll](https://jekyllrb.com) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/next-js.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/next-js.md
index 329b49d43e..01b55df7db 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/next-js.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/next-js.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Next.js
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Next.js](https://nextjs.org/) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/nuxt-js.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/nuxt-js.md
index 39c326d34b..b78670c049 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/nuxt-js.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/nuxt-js.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Nuxt.js
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Nuxt.js](https://nuxtjs.org/) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/python.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/python.md
index 8ab7193a1b..2e4c410539 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/python.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/python.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Python
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Python](https://www.python.org/) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/react.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/react.md
index 69c468729e..d8974cbb4a 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/react.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/react.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with React
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [React](https://reactjs.org/) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/ruby.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/ruby.md
index 89d64f96d9..7d2c34d913 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/ruby.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/ruby.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Ruby
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Ruby](https://www.ruby-lang.org/en/) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/sapper.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/sapper.md
index a0dd1f4039..401a673818 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/sapper.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/sapper.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Sapper
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Sapper](https://sapper.svelte.dev) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/svelte.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/svelte.md
index 5be7e5b953..bab7aa2e94 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/svelte.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/svelte.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Svelte
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Svelte](https://svelte.dev) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/developer-resources/content-api/integrations/vue-js.md b/docs/developer-docs/latest/developer-resources/content-api/integrations/vue-js.md
index 5cb581513d..ce5c78c417 100644
--- a/docs/developer-docs/latest/developer-resources/content-api/integrations/vue-js.md
+++ b/docs/developer-docs/latest/developer-resources/content-api/integrations/vue-js.md
@@ -5,7 +5,7 @@ description: Build powerful applications using Strapi, the leading open-source h
# Getting Started with Vue.js
-This integration guide is following the [Getting started guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have completed [Step 8](/developer-docs/latest/getting-started/quick-start.md#_8-publish-the-content) and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
+This integration guide is following the [Quick Start Guide](/developer-docs/latest/getting-started/quick-start.md). We assume that you have fully completed its "Hands-on" path, and therefore can consume the API by browsing this [url](http://localhost:1337/restaurants).
If you haven't gone through the getting started guide, the way you request a Strapi API with [Vue.js](https://vuejs.org/) remains the same except that you will not fetch the same content.
diff --git a/docs/developer-docs/latest/development/backend-customization.md b/docs/developer-docs/latest/development/backend-customization.md
index 796e607aac..d08aa1e1f6 100644
--- a/docs/developer-docs/latest/development/backend-customization.md
+++ b/docs/developer-docs/latest/development/backend-customization.md
@@ -1638,7 +1638,7 @@ The **Components** models are defined in the `./components` folder. Every compon
### How to create a model?
::: tip
-If you are just starting out it is very convenient to generate some models with the Content Type Builder directly in the admin interface. You can then review the generated model mappings on the code level. The UI takes over a lot of validation tasks and gives you a feeling for available features.
+If you are just starting out it is very convenient to generate some models with the Content-Types Builder directly in the admin interface. You can then review the generated model mappings on the code level. The UI takes over a lot of validation tasks and gives you a feeling for available features.
:::
#### For Content Types models
@@ -1656,7 +1656,7 @@ When you create a new API using the CLI (`strapi generate:api
-
-
+:::
-_For a step-by-step guide, please take a look at the following steps. This quickstart is really close to the [FoodAdvisor](https://github.com/strapi/foodadvisor) application._
+👇 Let's get started! Using the big buttons below, please choose between:
-(Before continuing, please make sure [Node.js and npm are properly installed](/developer-docs/latest/setup-deployment-guides/installation/cli.md#step-1-make-sure-requirements-are-met) on your machine. You can [install the Yarn v1.2.0+ package here](https://yarnpkg.com/en/).)
+* the **Starters** path for the quickest way to spin up a fullstack application powered by a Strapi back end,
+* or the **Hands-on** path for a more DIY approach to run your project.
-::: warning
-In the 3.1.5 the **Roles & Permissions** section has been migrated into the **Settings** section.
-:::
+:::::: tabs type:card
+
-## 1. Install Strapi and Create a new project
+::::: tab Starters
-:::: tabs
+## 🚀 Part A: Create a new project with Strapi starters
-::: tab yarn
+Strapi [starters](https://strapi.io/starters) are the fastest way to kickstart your project. They cover many use cases (blog, e-commerce solution, corporate website, portfolio) and integrate with various technologies (Gatsby, Gridsome, Next, Nuxt).
+
+This quick start guide has been specifically tailored to use the [Gatsby blog starter](https://strapi.io/starters/strapi-starter-gatsby-blog). We highly recommend you to follow along with this starter. Once you get a better understanding of Strapi, you will be able to play with other starters on your own.
+### Step 1: Run the installation script
+
+To create a [Gatsby](https://www.gatsbyjs.com/) blog using Strapi, run the following command in a terminal:
+
+:::: tabs card
+::: tab npm
```bash
-yarn create strapi-app my-project --quickstart
+ npx create-strapi-starter my-project gatsby-blog
```
+:::
+::: tab yarn
+```bash
+ yarn create strapi-starter my-project gatsby-blog
+```
+::::
+
+During the installation, when terminal asks `Choose your installation type`: select the default `Quickstart (recommended)` option by pressing Enter. The installation then resumes — just let the magic happen!
+
+### Step 2: Register & have a look at your blog
+
+Once the installation is complete, your browser automatically opens 2 tabs:
+
+* The first tab ([http://localhost:1337/admin/auth/register-admin](http://localhost:1337/admin/auth/register-admin)) is the admin panel, it's for the back end of your application.
+* The second tab ([http://localhost:8000](http://localhost:8000)) is for the front end of your application, and you can already see the Gatsby blog in action.
+
+
+
+
+By completing the form in the first tab, you create your own account. Once done, you become the first administator user of this Strapi application. Welcome aboard, commander!
+
+:::warning CONGRATULATIONS! 🥳
+Your blog is ready! You can start playing with Strapi and discover the product by yourself using our [User Guide](/user-docs/latest/getting-started/introduction.html), or proceed to part B below.
+
+Writing a blog is not your cup of tea? You can leave this guide and play with other [Starters](https://strapi.io/starters) on your own.
+:::
+
+## 🎨 Part B: Play with your content
+
+Strapi [starters](https://strapi.io/starters) build a full stack application and a data structure for you, so you can start playing with your content faster.
+
+We are about to contribute to the blog we have just created. Let's play with your application, by adding yourself as a writer and creating your own article, updating the homepage, and restarting the servers to look at the final result.
+
+:::tip TIP
+If the Strapi server is not already running, in your terminal, `cd` into the `my-project` folder and run `npm run develop` (or `yarn develop`) to launch it.
+:::
+
+### Step 1: Add yourself as a writer
+
+You have several ideas for great articles in mind. But first, the world needs to know who you are!
+
+Click on [Collection types > Writers](http://localhost:1337/admin/plugins/content-manager/collectionType/application::writer.writer?page=1&pageSize=10&_sort=name:ASC) in the main navigation, and click the **Add New Writers** button.
+
+
+
+1. Add your _Name_ and _Email_ in the corresponding fields.
+2. Add your favorite selfie in the _Picture_ field. You can either drag and drop an image or click the field and upload a file. Saying 'Cheese!' during the process is optional. 😄
+3. Click **Save**.
+
+### Step 2: Write & publish your first article
+
+To write an article, we need to add a new entry to the "Articles" collection type and fill in a few fields.
+
+
+
+Click on [Collection types > Articles](http://localhost:1337/admin/plugins/content-manager/collectionType/application::article.article?page=1&pageSize=10&_sort=title:ASC) in the main navigation, and click the **Add New Articles** button.
+
+#### Give your article a title, a description, and add some content
+
+1. Type `Hello World!` in the _Title_ field.
+2. Type `My very first article with Strapi` in the _Description_ field.
+3. Write a few lines in the _Content_ field. If you're lacking some inspiration, just type `This is my first blog article with Strapi and using it feels like a breeze!`.
+4. Scroll down and add a picture in the _Image_ field.
+
+#### Choose an author and a category for your article
+
+In the sidebar on the right, choose your name in the _Author_ drop-down list. You have just signed your first article with Strapi. Take a few seconds to contemplate this historic moment!
+
+While there, you might also want to choose a _Category_ for your article from the list.
+
+#### Turn your draft into a publication
+
+By default, your new article would be saved as a draft. Let's not be too shy and publish it right away.
+
+To publish an article, click the **Publish** button at the top of the window.
+
+You have just created and published your first article, "Hello World!". You can find it in the [Collection types > Articles](http://localhost:1337/admin/plugins/content-manager/collectionType/application::article.article?page=1&pageSize=10&_sort=id:DESC) view.
+
+### Step 3: Update the `Homepage` single type
+
+It's time to make this blog a bit more yours.
+
+Click on [Single Types > Homepage](http://localhost:1337/admin/plugins/content-manager/singleType/application::homepage.homepage) in the main navigation. Let's edit this homepage:
+
+1. Replace the image in the _ShareImage_ field.
+2. At the bottom of the page, update the _Title_ to `My Wonderful Strapi Blog` in the _Hero_ field group.
+3. Click **Save**.
+
+### Step 4: Restart the servers to reflect latest changes
+
+Gatsby is a static-site generator. It means that you need to restart the servers for changes to appear on the front end:
+
+1. In your terminal, press `Ctrl-C` to stop the servers.
+2. Make sure you are in the `my-project` folder. If not, type `cd my-project` and press Enter.
+3. Restart the servers by typing `npm run develop` (or `yarn develop`) and press Enter.
+After a few moments, you should see your blog with its updated title running at [http://localhost:8000](http://localhost:8000). The "Hello World!" article you have just created is also visible at the bottom of the page.
+
+
+
+:::warning CONGRATULATIONS! 🥳
+Now you know how to use Strapi to create and update your blog. Keep on creating amazing content!
:::
-::: tab npx
+## ⏩ What to do next?
+
+The beauty of using Strapi [starters](https://strapi.io/starters) is that the Strapi back end comes with a front end ready out-of-the-box. Now you probably want to show your shiny new website to the world! The next step is then to deploy both the Strapi back end and the front end on the platforms of your choice:
+
+👉 You can deploy the Strapi back end on various services: Amazon AWS, Microsoft Azure, DigitalOcean, Google App Engine, Heroku, and many more (see our [Deployment guides](/developer-docs/latest/setup-deployment-guides/deployment.md)).
+
+👉 Deploying the front end mostly depends on the technology it's based on. The easiest way to deploy your Gatsby blog front end is probably to [deploy on Gatsby Cloud](https://support.gatsbyjs.com/hc/en-us/articles/360052324714-Connecting-to-Strapi).
+
+:::danger 🤓 To go further with starters
+
+* Read more about the [starters CLI](https://strapi.io/blog/announcing-the-strapi-starter-cli) on our blog.
+* Start another project! We have lots of other [Starters](https://strapi.io/starters) you can use to kickstart your blog, e-commerce, corporate website, or portfolio project.
+:::::
+
+::::: tab Hands-on
+
+## 🚀 Part A: Create a new project with Strapi
+
+### Step 1: Run the installation script
+
+Run the following command in a terminal:
+
+:::: tabs card
+::: tab npm
```bash
-npx create-strapi-app my-project --quickstart
+ npx create-strapi-app my-project --quickstart
```
-
:::
+::: tab yarn
+```bash
+ yarn create strapi-app my-project --quickstart
+```
+:::
::::
-## 2. Create an Administrator user
+### Step 2: Register the first administrator user
+
+Once the installation is complete, your browser automatically opens a new tab.
+
+By completing the form, you create your own account. Once done, you become the first administator user of this Strapi application. Welcome aboard, commander!
+
+You now have access to the [admin panel](http://localhost:1337/admin):
+
+
+
+:::warning 🥳 CONGRATULATIONS!
+You have just created a new Strapi project! You can start playing with Strapi and discover the product by yourself using our [User Guide](/user-docs/latest/getting-started/introduction.md), or proceed to part B below.
+:::
+
+## 🛠 Part B: Build your content
+
+The installation script has just created an empty project. We will now guide you through creating a restaurants directory, inspired by our [FoodAdvisor](https://github.com/strapi/foodadvisor) example application.
-Navigate to [**http://localhost:1337/admin**](http://localhost:1337/admin).
+In short, we will create a data structure for your content, then add some entries and publish them, so that the API for your content can be consumed.
-Complete the form to create the first **Administrator** user.
+The admin panel of Strapi runs at [http://localhost:1337/admin](http://localhost:1337/admin). This is where you will spend most of your time creating and updating content.
-## 3. Create a Restaurant Content Type
+:::tip TIP
+If the server is not already running, in your terminal, `cd` into the `my-project` folder and run `npm run develop` (or `yarn develop`) to launch it.
+:::
+
+### Step 1: Create collection types with the Content-Types Builder
+
+The Content-Types Builder plugin helps you create your data structure. When creating an empty project with Strapi, this is where to get the party started!
+
+#### Create a "Restaurant" collection type
+
+Your restaurants directory will eventually include many restaurants, so we need to create a "Restaurant" collection type. Then we can describe the fields to display when adding a new restaurant entry:
+
+1. Go to [Plugins > Content-Types Builder](http://localhost:1337/admin/plugins/content-type-builder) in the main navigation.
+2. Click on **Create new collection type**.
+3. Type `restaurant` for the _Display name_, and click **Continue**.
+4. Click the Text field.
+5. Type `name` in the _Name_ field.
+6. Switch to the _Advanced Settings_ tab, and check the **Required field** and the **Unique field** settings.
+7. Click on **Add another Field**.
+8. Choose the Rich Text field.
+9. Type `description` under the _Name_ field, then click **Finish**.
+10. Finally, click **Save** and wait for Strapi to restart.
+
+
+
+Once Strapi has restarted, "Restaurants" is listed under Collection Types in the main navigation. Wow, you have just created your very first content type! It was so cool — let's create another one right now, just for pleasure.
+
+#### Create a "Category" collection type
+
+It would help getting a bit more organized if our restaurants directory had some categories. Let's create a "Category" collection type:
+
+1. Go to [Plugins > Content-Types Builder](http://localhost:1337/admin/plugins/content-type-builder) in the main navigation.
+2. Click on **Create new collection type**.
+3. Type `category` for the _Display name_, and click **Continue**.
+4. Click the Text field.
+5. Type `name` in the _Name_ field.
+6. Switch to the _Advanced Settings_ tab, and check the **Required field** and the **Unique field** settings.
+7. Click on **Add another Field**.
+8. Choose the Relation field.
+9. On the right side, click the _Category_ relational fields box and select "Restaurant".
+10. In the center, select the icon that represents "many-to-many" . The text should read `Categories has and belongs to many Restaurants`.
+
+
+
+9. Finally, click **Finish**, then the **Save** button, and wait for Strapi to restart.
-Navigate to [**PLUGINS** - **Content Type Builder**](http://localhost:1337/admin/plugins/content-type-builder), in the left-hand menu.
+### Step 2: Use the collection types to create new entries
-- Click the **"+ Create new collection type"** link
-- Type `restaurant`, and click `Continue`
-- Click the **Text** field
-- Type `name` in the **Name** field
-- Click over to the **ADVANCED SETTINGS** tab, and check the `Required field` and the `Unique field`
-- Click the **"+ Add another Field"** button
-- Click the **Rich Text** field
-- Type `description` under the **BASE SETTINGS** tab, in the **Name** field
-- Click `Finish`
-- Click the **Save** button and wait for Strapi to restart
+Now that we have created a basic data structure with 2 collection types, "Restaurant" and "Category", let's use them to actually add content by creating new entries.
+#### Create an entry for the "Restaurant" collection type
-## 4. Create a Category Content type
+1. Go to [Collection types > Restaurants](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant) in the main navigation.
+2. Click on **Add New Restaurants**.
+3. Type the name of your favorite local restaurant in the _Name_ field. Let's say it's `Biscotte Restaurant`.
+4. In the _Description_ field, write a few words about it. If you're lacking some inspiration, you can use `Welcome to Biscotte restaurant! Restaurant Biscotte offers a cuisine based on fresh, quality products, often local, organic when possible, and always produced by passionate producers.`
+5. Click **Save**.
-Navigate back to [**PLUGINS** - **Content Type Builder**](http://localhost:1337/admin/plugins/content-type-builder), in the left-hand menu.
+
-- Click the **"+ Create new collection type"** link
-- Type `category`, and click `Continue`
-- Click the **Text** field
-- Type `name` under the **BASE SETTINGS** tab, in the **Name** field
-- Click over to the **ADVANCED SETTINGS** tab, and check the `Required field` and the `Unique field`
-- Click the **"+ Add another field"** button
-- Click the **Relation** field
-- On the right side, click the **Category** dropdown and select, `Restaurant`
-- In the center, select the icon that represents `many-to-many`. The text should read, `Categories has and belongs to many Restaurants`
-- Click `Finish`
-- Click the **Save** button and wait for Strapi to restart
+The restaurant is now listed in the [Collection types > Restaurants](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant) view.
-## 5. Add content to "Restaurant" Content Type
+#### Add Categories
-Navigate to [**COLLECTION TYPES** - **Restaurants**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant), in the left-hand menu.
+Let's go to [Collection types > Categories](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category) and create 2 categories:
-- Click on **+ Add New Restaurants** button. Type `Biscotte Restaurant` in the **Name** field. Type `Welcome to Biscotte restaurant! Restaurant Biscotte offers a cuisine based on fresh, quality products, often local, organic when possible, and always produced by passionate producers.` into the **Description** field.
-- Click **Save**.
+1. Click on **Add New Categories**.
+2. Type `French Food` in the _Name_ field.
+4. Click **Save**.
+5. Go back to _Collection types > Categories_, then click again on **Add New Categories**.
+6. Type `Brunch` in the _Name_ field, then click **Save**.
-If you navigate back [**COLLECTION TYPES** - **Restaurants**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant), you will see your restaurant listed in the entries.
+
-## 6. Add categories to the "Category" Content Type
+The "French Food" and "Brunch" categories are now listed in the [Collection types > Categories](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category) view.
-Navigate to [**COLLECTION TYPES** - **Categories**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category).
+#### Add a Category to a Restaurant
-- Click on **+ Add New Categories** button. Type `French Food` in the **Name** field. Select `Biscotte Restaurant`, on the right in the **Restaurant (0)** dropdown.
-- Click **Save**.
+Go to [Collection types > Restaurants](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant) in the main navigation, and click on "Biscotte Restaurant".
-Navigate back to [**COLLECTION TYPES** - **Categories**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category). You will see the **French Food** category listed in the entries.
+In the right sidebar, in the **Categories** drop-down list, select "Brunch". Click **Save**.
-- Click on **+ Add New Categories** button. Type `Brunch` in the **Category** field. **DO NOT ADD** `Biscotte Restaurant` to the `Restaurants` dropdown on the right.
-- Click **Save**.
+### Step 3: Set Roles & Permissions
-You will see the **Brunch** category listed in the entries.
+We have just added a restaurant and 2 categories. We now have enough content to consume (pun intended). But first, we need to make sure that the content is publicly accessible through the API:
-Navigate back to [**COLLECTION TYPES** - **Restaurants**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant).
+1. Click on _General > Settings_ at the bottom of the main navigation.
+2. Under _Users & Permissions Plugin_, choose [Roles](http://localhost:1337/admin/settings/users-permissions/roles).
+3. Click the **Public** role.
+4. Scroll down under _Permissions_.
+5. In the _Application_ tab, find _Restaurant_.
+6. Click the checkboxes next to **find** and **findone**.
+7. Repeat with _Category_: click the checkboxes next to **find** and **findone**.
+8. Finally, click **Save**.
-- Click on `Biscotte Restaurant`.
-- On the right, under **Categories(1)**, `select` the `Add an item...`, and add **Brunch** as a category for this restaurant, and click the **Save** button.
+
-You have now seen **two different ways** to use the **relation** field type to add and connect relations between Content Types.
+### Step 4: Publish the content
-## 7. Set Roles and Permissions
+By default, any content you create is saved as a draft. Let's publish our categories and restaurant.
-Navigate to [**GENERAL** > **Settings** > **USERS & PERMISSIONS PLUGIN** > **Roles**](http://localhost:1337/admin/settings/users-permissions/roles).
+First, navigate to [Collection types > Categories](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category). From there:
-- Click the **Public** Role.
-- Scroll down under **Permissions**, open the **Application** tab and find **Restaurant**. Click the checkbox next to **find** and **findone**.
-- Repeat and find **Category**. Click the checkbox next to **find** and **findone**.
-- Click **Save**.
+1. Click the "Brunch" entry.
+2. On the next screen, click **Publish**.
+3. In the _Please confirm_ window, click **Yes, publish**.
-## 8. Publish the content
+Then, go back to the Categories list and repeat for the "French food" category.
+
+Finally, to publish your favorite restaurant, go to [Collection types > Restaurants](http://localhost:1337/admin/plugins/content-manager/collectionType/application::restaurant.restaurant), click the restaurant entry, and **Publish** it.
+
+
+### Step 5: Use the API
+
+OK dear gourmet, we have just finished creating our content and making it accessible through the API. You can give yourself a pat on the back — but you have yet to see the final result of your hard work.
+
+There you are: the list of restaurants is accessible at [http://localhost:1337/restaurants](http://localhost:1337/restaurants).
+
+Try it now! The result should be similar to the example response below 👇.
+
+::: details Click me to view an example of API response
+
+```json
+[
+ {
+ "id":1,
+ "name":"Biscotte Restaurant",
+ "description":"Welcome to Biscotte restaurant! Restaurant Biscotte offers a cuisine based on fresh, quality products, often local, organic when possible, and always produced by passionate producers.",
+ "published_at":"2021-05-27T15:46:43.097Z",
+ "created_at":"2021-05-27T15:40:01.290Z",
+ "updated_at":"2021-05-27T15:46:43.110Z",
+ "categories":[
+ {
+ "id":1,
+ "name":"French Food",
+ "published_at":"2021-05-27T15:46:14.704Z",
+ "created_at":"2021-05-27T15:41:59.725Z",
+ "updated_at":"2021-05-27T15:46:14.725Z"
+ },
+ {
+ "id":2,
+ "name":"Brunch",
+ "published_at":"2021-05-27T15:46:02.015Z",
+ "created_at":"2021-05-27T15:42:29.201Z",
+ "updated_at":"2021-05-27T15:46:02.035Z"
+ }
+ ]
+ }
+]
+```
+
+:::
+
+:::warning 🥳 CONGRATULATIONS!
+Now your content is created, published, and you have permissions to request it through the API.
+Keep on creating amazing content!
+:::
-By default, any content you create is saved as a draft. To publish your content:
+## ⏩ What to do next?
-Navigate back to [**COLLECTION TYPES** - **Categories**](http://localhost:1337/admin/plugins/content-manager/collectionType/application::category.category)
+### Consume your API
-- Click the **Draft** button on the **Brunch** category.
-- Click **Publish** button.
-- In the **Please confirm** dialog, click **Yes, publish** button.
-- Repeat for the **French food** category and **Biscotte Restaurant**.
+You can learn how to consume your API with your favorite frameworks, front-end or back-end programming languages by choosing one in the list below.
-## 9. Consume the Content Type's API
+