新手入坑：strapi官网教程的简单示例学习

关于strapi

前端仔，来，看这里，用strapi，定制你的api。一个字，香。

安装

npm i strapi@beta -g
strapi new str-project

可能会比较慢

开始

npm run develop

运行完会新打开一个登录页，填入信息即可。

开局一个工作台

简单实现自己的api demo

还是官网的demo简单直接，下面是个人翻译

步骤1安装，步骤2的创建管理员账户都已经实现，下面从步骤3开始

3：创建一个叫 restaurant 的内容类型

点击左侧边栏额外功能-内容类型新建页，新建一个内容类型

• 点击新建内容类型
• 输入 restaurant，点击继续
• 选择文本字段
• 在名称输入框里输入 name
• 点击右侧的进阶设置，勾选 必填 和 值唯一
• 点击新增另一个字段
• 选择 富文本 字段
• 在名称输入框里输入 description
• 点击完成
• 右上角点保存

4：创建一个叫 Category 的内容类型

还是在左侧边栏额外功能-内容类型新建页，新建一个内容类型

• 点击新建内容类型
• 输入 category ，点击继续
• 选择文本字段
• 在名称输入框里输入 name
• 点击右侧的进阶设置，勾选 必填 和 值唯一
• 点击新增另一个字段
• 选择 关联 字段
  
• 在右侧的 Category 下拉框勾选 Restaurant，关联起来
• 在中间的icon里，选择 多对多（不用我多解释吧？）
  
• 点击完成
• 右上角点保存

5：在 Restaurant 内容类型中新建一个 餐馆 数据

在左侧边栏集合-类型，选择 Restaurant，新建一篇文章

• 点击新建按钮，在 name 字段中输入 “肯德基”，在 Description 字段中输入"肯德基KFC坚持“立足中国、融入生活”,打造新快餐,提供早餐,午餐,下午茶,晚餐,夜宵和甜品站等丰富选择”
• 点击右上角的保存

如果你返回到了 Restaurant 列表页面，你会发现多了一行数据

6：在 Category 内容类型中新建一个 种类 数据

• 点击右上角的新建

• 输入 中餐，并在右侧选择 肯德基

• 点击保存
  

• 返回Categories列表，发现多了一行 中餐 的数据

• 继续新建，这次输入 快餐，并且不要在右侧勾选 肯德基

• 点击保存，返回 Restaurants 列表

• 点击 肯德基，在右侧勾选上 快餐，保存

• 现在你已经看到了使用关系字段类型在内容类型之间添加和连接关系的两种不同方法

7：设置角色和权限

权限默认不开放

• 选择 公共 角色（即不校验角色，谁都可以访问）
• 给 Restaurant 和 Category 分别勾上 可查询
• 保存
  

8：发布你的内容
众所周知，cms系统的特点之一，即良好的内容管理关系，并不是创建了内容就直接对外开放。
创建内容之后，还需要发布才正式对外可见。

• 点击 Category 进入列表，再进入 草稿箱
• 点击右上角的 发布 按钮
• 确认发布
  
• 重复以上步骤，对 Restaurants 列表里的 肯德基 也发布一次

发布后的状态

9：好了，开始使用你的api！

http://localhost:1337/restaurants
http://localhost:1337/categories/1

访问成功！

写在结尾

1. 有了strapi，基本上前端团队内部小项目的api接口都可以自给自足了。strapi有很强的广泛适用性，也不存在什么vue/react技术栈差异，因为没有什么前端技术栈是strapi不能支持的。
2. 此外，对于制作个人的博客网站，strapi是一项利器。

有机会我分享一下如何把我的个人网站（使用java语言的cms后台），彻底搬迁到strapi上。拯救我的1核2g服务器。

参考

把strapi项目部署到服务器