浅尝Strapi


官方简介:

该项目最初的目的是帮助引导您的API:Strapi就是这样创建的。现在,Strapi是一个开源的无头CMS,它让开发人员可以自由选择自己喜欢的工具和框架,并允许编辑使用应用程序的管理面板管理和分发内容。基于插件系统,Strapi是一个灵活的CMS,其管理面板和API是可扩展的,每个部分都可以定制以匹配任何用例。Strapi还内置了一个用户系统,用于详细管理管理员和最终用户可以访问的内容。

CMS是什么?

Content Management System
就是内容管理系统,就是企业用来创建,编辑,发布,删除内容的一个系统,还可以根据角色分配不同的权限,
比如运营内容的人只可以创建和编辑,而发布和删除需要管理员级别的角色来操作,像门户网站啊,公司网站啊,用的比较多。

无头CMS ?

无头CMS只有一个后端系统。该系统可以访问数据库并使用定制的前端 Web 应用程序存储内容。

下面我们开始安装

当前官网的版本是“@strapi/strapi”: “4.5.3”

我的版本是

node:v16.10.0

yarn:1.17.3

mySql: 8.0.17

1
2
3
4
5
6
PREREQUISITES

The installation requires the following software to be already installed on your computer:
Node.js (opens new window): only maintenance and LTS versions are supported (v14, v16, and v18). Other versions of Node.js may not be compatible with the latest release of Strapi. Node v18.x is recommended for Strapi v4.3.9 and above, Node v16.x for Strapi v4.0.x to v4.3.8.
npm (opens new window)(v6 only) or yarn (opens new window)to run the CLI installation scripts.
Python (opens new window)when using a SQLite database
  1. node版本仅支持和维护LTS版本(v14、v16和v18)建议Strapi v4.3.9及以上版本使用节点v18.x,Strapi v4.0.x至v4.3.8使用节点v16.x。
  2. npm(仅限于v6)或yarn来运行CLI安装脚本。
  3. 需要数据库,可以用项目里默认的
  4. Strapi v4 does not support MongoDB.

我这里就用yarn了和自己mysql的

1
2
首先
yarn create strapi-app my-project

我这里选择了自定义

这里数据库要用root

创建一个相同名字的数据库(一开始里面是没有表的,没事)

我们可以在config => database文件里看到数据库的相关配置

1
2
3
cd my-project
yarn
yarn develop

安装的过程可能会遇到一些问题,比如如果用的本地数据库,数据库版本问题,npm源问题,还需要确保创建了对应的数据库名,用户root权限,密码,数据库是否已连接等等。

项目成功启动后,它会在数据里默认创建一些表。

项目启动后,会自动打开注册页面,我们需要在这里注册一个超级管理员账号。

注册好之后,默认进入主页,是这样的

下面我们来修改成中文

项目配置了多个语言文件,我们需要在src =>admin => 文件夹下新建一个app.js文件,在app.js的文件中添加如下代码

选择Profile => Experience就有中文的选项了,右上角保存,即可。

现在我们来创建一个内容

我们来构建一个Task的表

定义需要的字段

我随便定义了3个字段,字段还可以高级配置,必填,默认值,私有字段

右上角保存后,它会自动重启服务,然后会在内容管理里看到Task表了

接着我们来添加类目,造一条数据,这里一定要选择发布,如果不发布,只有管理员才能看到该条数据

ok发布成功了

我们来用postman请求下接口,就能看到数据了,strapi是遵循REST API的,具体的看官方文档吧。这个时候去请求会403,我们还需要设置下接口的权限。

这个接口是公共的,不需要我设置权限校验,所以我选择公开这个接口,勾选上对应的操作权限,权限那块或许可以再出一期,strapi权限做的还是可以的。

ok,我们用接口请求到数据啦

接下来,再用postman的方式创建一条数据

在postman里需要在raw里填写数据才会生效,不可以使用form-data

最后我们看下数据库

ok都看到数据了,它里面还有很多好玩的,这次暂时分享到这里吧

我的微信公众号: 梨的前端小屋


文章作者: 梨啊梨
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 梨啊梨 !
  目录