sidebar_label: 'Quick Start Guide' displayed_sidebar: cmsSidebar sidebar_position: 2 title: Quick Start Guide - Strapi Developer Docs description: Get ready to get Strapi, your favorite open-source headless cms up and running in less than 3 minutes. tags:
import InstallPrerequisites from '/docs/snippets/installation-prerequisites.md'
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. For this tutorial, we'll go for the DIY approach and build a project and content structure from scratch, then deploy your project to Strapi Cloud to add data from there.
Estimated completion time: 5-10 minutes
undefined
You will also need to and to have a account to deploy your project to Strapi Cloud.
We will first create a new Strapi project on your machine by running a command in the terminal, and then register our first local administrator user.
Follow the steps below by clicking on the togglable content to read more instructions.
Run the following command in a terminal:
bashnpx create-strapi@latest my-strapi-project
The terminal will prompt you to log in or sign up. Once you do, a 30-day trial of the plan will be automatically applied to your project. Ensure Login/Sign up is selected in the terminal, or use arrow keys to select it, and press Enter.
In the new browser tab that opens, ensure the confirmation code is the same as in the terminal and click Confirm.
Still in the browser tab, click Continue with GitHub. If you are not already logged in into GitHub with your current browser session, you might be redirected to a GitHub login page.
Once logged in, the browser will display a "Congratulations, you're all set!" message and you can safely close the browser tab and get back to the terminal.
<ThemedImage alt="Login GIF" sources={{ light: '/img/assets/quick-start-guide/qsg-cloud-login.gif', dark: '/img/assets/quick-start-guide/qsg-cloud-login.gif', }} />
The terminal will now ask you a few questions. Press Enter to accept the default answer to all questions.

As you will see in the terminal, your project is now building locally.
相关信息
.strapi-cloud.json file used to link the local Strapi project on your machine to the Strapi servers.Once the installation is complete, you need to start the server. In the terminal, type cd my-strapi-project && npm run develop and your browser automatically opens a new tab.
提示
As long as you stay in the my-strapi-project folder, you will just need to run npm run develop any time you want to start the Strapi server again.
By completing the form, you create your own account. Once done, you become the first administrator user of this Strapi application. Welcome aboard, commander!
You now have access to the :
<ThemedImage alt="Admin panel screenshot: dashboard" sources={{ light: '/img/assets/quick-start-guide/qsg-handson-part1-01-admin_panel-v5.png', dark: '/img/assets/quick-start-guide/qsg-handson-part1-01-admin_panel-v5_DARK.png', }} />
:::callout Congratulations! You have just created a new Strapi project! You can start playing with Strapi and discover the Content Manager by yourself, or proceed to part B below. :::
The installation script has just created an empty project. We will now guide you through creating a restaurants directory, inspired by our example application.
The admin panel of a local Strapi project runs at . This is where you will spend most of your time creating and updating content.
First we will build a content structure for your content. This can only be done while in development mode, which is the default mode for projects that are created locally.
提示
If the server is not already running, in your terminal, cd into the my-strapi-project folder and run npm run develop (or yarn develop) to launch it.
You might also need to run npm run build or yarn build prior to the develop command, especially in cases where building the website is important, such as for TypeScript projects for instance.
The Content-Type Builder helps you create your content structure. When creating an empty project with Strapi, this is where to get the party started!
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:
Restaurant for the Display name, and click Continue.Name in the Name field.Description under the Name field, then click Finish.<ThemedImage alt="GIF: Create Restaurant collection type in Content-type Builder" sources={{ light: '/img/assets/quick-start-guide/qsg-handson-restaurant-v5.gif', dark: '/img/assets/quick-start-guide/qsg-handson-restaurant-v5_DARK.gif', }} />
Once Strapi has restarted, "Restaurant" is listed under Content Manager > Collection types in the 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.
It would help getting a bit more organized if our restaurants directory had some categories. Let's create a "Category" collection type:
Category for the Display name, and click Continue.Name in the Name field.Categories has and belongs to many Restaurants.<ThemedImage alt="Admin Panel screenshot: relations" sources={{ light: '/img/assets/quick-start-guide/qsg-handson-part2-02-collection_ct-v5.png', dark: '/img/assets/quick-start-guide/qsg-handson-part2-02-collection_ct-v5_DARK.png', }} />
:::callout Congratulations! You have just created a basic content structure for your Strapi project! You can keep on playing with the Content-Type Builder, or proceed to parts C and D below to discover Strapi Cloud and add actual content to your project. :::
Now that your beautiful first Strapi project is working locally, it's time for the world to see it live! The most straightforward way to host your project is to use Strapi Cloud: Deploying your project on Strapi Cloud is done with a single command! 🚀
To deploy your project for free to Strapi Cloud, in your terminal:
If the server for your local Strapi project is running, which should be the case if you followed this tutorial so far, press Ctrl-C to stop the server.
Ensure you are in the folder of your Strapi project (if needed, run for instance cd my-strapi-project to reach this folder), and run the following command:
shyarn strapi deploy
shnpm run strapi deploy
Answer questions in the terminal, giving your project a name (you can press Enter to keep the default name), choosing the recommended NodeJS version, and selecting the region closer to your current place:

Within a few moments, your local project will be hosted on Strapi Cloud. 🚀
Once it's done, the terminal will provide you a clickable link that starts with https://cloud.strapi.io/projects. Click on the link, or copy and paste it in your browser address bar, to visit the page.
You will see the Strapi Cloud project we've just created, my-strapi-project, visible in the Strapi Cloud dashboard. Click the Visit app button in the top right corner to access your deployed Strapi project.
<ThemedImage alt="Visit Strapi Cloud App GIF" sources={{ light: '/img/assets/quick-start-guide/qsg-visit-cloud-app.gif', dark: '/img/assets/quick-start-guide/qsg-visit-cloud-app_DARK.gif', }} />
:::callout Congratulations! Now your project is hosted on Strapi Cloud and accessible online. You can learn more about Strapi Cloud by reading its dedicated documentation or proceed to part D to log in into your online Strapi project and add your first data from there. :::
提示
Feel free to play with the Content-Type Builder even further and add more fields to your content-types or create new content-types. Anytime you make such changes, deploy them again on Strapi Cloud, by running the appropriate deploy command, and see your hosted project updated within a few minutes. Magical, isn't it? 🪄
Now that we have created a basic content structure with 2 collection types, "Restaurant" and "Category", and deployed your project to Strapi Cloud, let's use the Cloud to actually add content by creating new entries.
Now that your Strapi Cloud project is created, let's log in into the project:
my-strapi-project project.Logged in into our first Strapi Cloud project, we will now add data from there.
<ThemedImage alt="" sources={{ light: '/img/assets/quick-start-guide/qsg-first-login-cloud.gif', dark: '/img/assets/quick-start-guide/qsg-first-login-cloud_DARK.gif' }} />
:::note Note: Local users and Strapi Cloud users are different The databases for your Strapi Cloud project and your local project are different. This means that data is not automatically transferred from your local project to Strapi Cloud. This includes users that you previously created locally. That's why you are invited to create a new administrator account when logging in to your Strapi Cloud project for the first time. :::
:::tip Tip: Directly accessing the admin panel of your Strapi Cloud project
Any project hosted on Strapi Cloud is accessible from its own URL, something like https://my-strapi-project-name.strapiapp.com. To access the admin panel of your online project, simply add /admin to the URL, for instance as in https://my-strapi-project-name.strapiapp.com/admin. URLs can be found in your Strapi Cloud dashboard and you can also directly access your Strapi Cloud projects from there by clicking on the name of your project then on the Visit app button.
:::
Biscotte Restaurant.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.<ThemedImage alt="Screenshot: Biscotte Restaurant in Content Manager" sources={{ light: '/img/assets/quick-start-guide/qsg-handson-part2-03-restaurant-v5.png', dark: '/img/assets/quick-start-guide/qsg-handson-part2-03-restaurant-v5_DARK.png', }} />
The restaurant is now listed in the Collection types - Restaurant view of the Content Manager.
Let's go to Content Manager > Collection types - Category and create 2 categories:
French Food in the Name field.Brunch in the Name field, then click Save.<ThemedImage alt="GIF: Add Categories" sources={{ light: '/img/assets/quick-start-guide/qsg-handson-categories-v5.gif', dark: '/img/assets/quick-start-guide/qsg-handson-categories-v5_DARK.gif', }}/>
The "French Food" and "Brunch" categories are now listed in the Collection types - Category view of the Content Manager.
Now, we will add a category to a restaurant:
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:
<ThemedImage alt="Screenshot: Public Role in Users & Permissions plugin" sources={{ light: '/img/assets/quick-start-guide/qsg-handson-part2-04-roles-v5.png', dark: '/img/assets/quick-start-guide/qsg-handson-part2-04-roles-v5_DARK.png' }}/>
By default, any content you create is saved as a draft. Let's publish our categories and restaurant.
First, navigate to Content Manager > Collection types - Category. From there:
Then, go back to the Categories list and repeat for the "French Food" category.
Finally, to publish your favorite restaurant, go to Content Manager > Collection types - Restaurant, click the "Biscotte Restaurant" entry, and Publish it.
<ThemedImage alt="GIF: Publish content" sources={{ light: '/img/assets/quick-start-guide/qsg-handson-publish-v5.gif', dark: '/img/assets/quick-start-guide/qsg-handson-publish-v5_DARK.gif' }} />
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 should be accessible by visting the /api/restaurants path of your Strapi Cloud project URL (e.g., https://beautiful-first-strapi-project.strapiapp.com/api/restaurants).
Try it now! The result should be similar to the example response below 👇.
json{
"data": [
{
"id": 3,
"documentId": "wf7m1n3g8g22yr5k50hsryhk",
"Name": "Biscotte Restaurant",
"Description": [
{
"type": "paragraph",
"children": [
{
"type": "text",
"text": "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."
}
]
}
],
"createdAt": "2024-09-10T12:49:32.350Z",
"updatedAt": "2024-09-10T13:14:18.275Z",
"publishedAt": "2024-09-10T13:14:18.280Z",
"locale": null
}
],
"meta": {
"pagination": {
"page": 1,
"pageSize": 25,
"pageCount": 1,
"total": 1
}
}
}
:::callout Congratulations! Now your content is created, published, and you have permissions to request it through the API. Keep on creating amazing content! :::
:::tip Tip: Transfer data between your local and Strapi Cloud projects The databases for your Strapi Cloud project and your local project are different. This means that data is not automatically synchronized between your Strapi Cloud and local projects. You can use the data management system to transfer data between projects. :::
Now that you know the basics of creating and publishing content with Strapi, we encourage you to explore and dig deeper into some Strapi features:
learn how to use Strapi's REST API to query the content,
learn more about Strapi features by browsing the Features category,
learn more about Strapi Cloud projects by reading the Cloud Documentation,
and customize your Strapi back end and admin panel for advanced use cases.
本文作者:张京
本文链接:
版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!