Web 全栈工程师经常遇到一些内容型网站的开发需求,比如个人博客、机构官网、新闻门户。这些虽是 Web 1.0、2.0 时代就烂大街的典型 Web-site,但面对不同的甲方,看似雷同的需求往往又有各种细节的定制化。
虽然 WordPress、Discuz!X 等建站系统早已非常成熟,但在人们更看重 UI/UX 设计的今天,它们专用的模板引擎反而成了二次开发最大的障碍。只要是近两年做过 Web 前端开发的同学就知道,不能利用基于 Node.js 的现代化工具链的项目,开发起来有多蛋疼。
Web 前后端分离催生了 Web 前端岗位,也让 WordPress、Ghost 这些老牌 CMS 系统开放了 RESTful API。但有的开源项目做得更加激进 —— Headless CMS,前台界面都省了,只有后端 API 和后台界面,普通用户看啥你们自己写~
这其中最为优秀的便是 Strapi,因为它的后台设计不局限于传统的博客、门户,而是:
- 数据模型灵活可配置(可用 Git 管理 JSON 配置文件)
- RESTful API 完全支持 CRUD(增删查改)和 RBAC(角色权限)
- 自身是个标准的 Node.js 后端项目,并有留有二次开发接口
- 包括 Swagger Documentation 在内的插件生态
这使得它既像 BaaS 中的 LeanCloud,又像 Python 开发框架 Django,在简单易用的同时,又不束缚专业开发者。
本地开发
创建项目
以下命令会一键创建项目骨架、安装依赖包、启动开发模式:
npm init strapi-app ~/my-project --quickstart
开发模式启动
下次继续开发时,则执行以下命令:
cd ~/my-project
npm run develop
如果执行 npm start
,启动的后台系统只能添加数据,不能修改数据结构,是线上生产模式。
创建代码库
在 GitHub 上创建代码库后,把生成的代码传上去:
git init
git remote add origin https://github.com/my-id/my-project.git
git add .
git commit -m "[add] Strapi framework"
git push
服务器部署
下面以 Linux (Ubuntu 18.04) 为例,简介线上部署。
安装容器环境
# 安装 Docker
curl -fsSL https://get.docker.com | sh
# 安装 Python pip
apt install python-pip
# 安装 Docker Compose
pip install docker-compose
初始化 Git
为了后面自动化部署的方便,需要生成好 SSH 密钥对:
# 生成 SSH Key
ssh-keygen -t rsa -b 4096 -C "my_email@example.com"
cd ~/.ssh
添加 SSH Key 私钥
ssh-add id_rsa
信任 SSH Key 公钥
并将上述公钥添加到 [https://github.com/my-id/my-project/settings/keys][16]
页面。
如此,便可无需用户名、密码,直接克隆代码库:
git clone git@github.com:my-id/my-project.git /var/www
部署配置文件
将以下两个文件放在代码库相应路径中,并提交:
Docker 服务编排
~/my-project/docker-compose.yml
version: '3'
以上配置的是最简单的 SQLite 数据库,小型网站完全足够。
GitHub Actions 持续部署
以下配置让我们无需每次更新 Strapi 配置、代码时,登录服务器手动部署新版本:
~/my-project/.github/workflows/main.yml~
name: Deploy Server
on:
push:
branches:
- master
jobs:
SSH:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@master
- name: Deploy
uses: appleboy/ssh-action@master
with:
host: ${{ secrets.HOST }}
username: root
key: ${{ secrets.SSH_KEY }}
script: |
cd /var/www
git fetch --all
git reset --hard
git pull
docker-compose down
docker-compose up -d
【注意】在推送代码前,务必去 [https://github.com/my-id/my-project/settings/secrets][22]
页面创建好上述配置中的变量:
名称内容HOST
服务器 IP 地址SSH_KEYssh-keygen
命令生成的私钥,通常存在 /.ssh/id_rsa
总结
经过前面的一顿折腾,开发者只需在本机浏览器中点点鼠标、轻敲键盘,就能实现网站数据结构的设计;推送代码到 GitHub,就能实现网站后台的更新。而运营专员访问的线上后台锁定了数据结构,他们只能在现有数据表中添加具体数据。这样一来,面对单纯的数据存取,后端 API 和后台 UI 都不用开发了~
欢迎访问我的更多文章。