用koa开发一套内容管理系统（CMS），支持javascript和typescript双语言

初衷

lin-cms是咱们林间有风团队开源的一款CMS，它采用目前主流的先后端分离的架构，前端使用vue做为基础框架，后端选择了咱们团队大量实践使用的flask做为基础框架。

lin-cms剪彩

你也能够直接查看线上的demo。

得益于先后端分离分离的架构，这套CMS十分灵活，市场上的CMS可能是选择服务端渲染的方式，lin-cms因为是先后端分离的方式，所以你能够选择多语言的后端，和多框架的前端。

团队在开源的之初，便已推出了vue的前端版本和flask的后端版本，vue在国内能够说的上是如日中天，受众面极广。而flask在国内确实用的人太少，国内的主流服务端语言都被java、php、node.js、go霸占。所以，在进行调研和诸多权衡后，团队选择了node.js做为第二支持语言。

选型和架构

node.js近几年发展极快，尤为是在工程化的前端，几乎已成标配。在后端方面koa与express双雄争霸，express起步早，发展成熟，生态稳定；而koa更小更轻更易学习，国内已有egg.js和think.js基于koa的二次框架，显然koa更加具备吸引力。

谈到这里，有一个已经呼之欲出的问题，既然已经有egg.js这样的好框架，为何不直接选择它了？

之因此不选择egg.js，而是直接用koa，有几个很重要的缘由：

• koa更小更轻更易学习，而咱们若是选择了egg.js岂不是直接失去了这个巨大的优势。
• egg.js已经整合了诸多生态，这些生态并不必定适合咱们，或者说咱们能够有更好的选择。
• egg.js已经有插件，扩展等诸多概念，尤为是egg的插件与lin-cms中的插件截然不同，十分不适合咱们再作改变。

lin-cms-koa的总体架构以下：

或者说lin-cms的后端的架构都如上图所示，接下来咱们来详细阐述一下lin-cms-koa的整合之路：

• 在数据库部分，咱们整合typeorm做为orm框架，它为lin-cms提供模型建立，数据操做等诸多功能。
• 数据校验部分，咱们整合了class-validator，并提供了一个基础的Form类来方便校验前端传来的数据。
• 在控制器部分，咱们整合了koa-router做为路由框架，并在其基础上提供了Redprint类来进行路由函数的权限控制。
• 其它...

简单使用

lin-cms开源已有一段时间了，文档均已十分完善了，目前已有一些项目正在使用它进行开发。固然后端仍是选择的flask版本，接下来咱们使用lin-cms-koa来简单的使用一下lin-cms。

lin-cms前端部分使用起来很是简单，你只须要一点git基础就可使用了，在lin-cms-vue的官方仓库中的README能够找到以下一段：

# clone the project
git clone https://github.com/TaleLin/lin-cms-vue.git && cd lin-cms-vue

# install dependency
npm install

# develop
npm run serve
复制代码

若是你经过终端成功的运行了这些命令以后，在浏览器中打开http://localhost:8080/#/login ，你会打开前端的登录界面。

不过这还不够，咱们还须要后端部分。在浏览器中先打开https://github.com/PedroGao/lin-cms-koa，查看lin-cms-koa的相关信息。

固然你也能够跳过查看，直接在终端中运行以下命令：

git clone https://github.com/PedroGao/lin-cms-koa && cd lin-cms-koa
复制代码

npm install 
复制代码

接下来：

请确保你拥有 mysql 数据库和 node.js 的运行环境，并建立名为lin-cms2的数据库。

若是你使用 typescript 运行，那么请在ts/app/config/secure.ts中修改你本身的 mysql 配置。

若是你使用 javascript 运行，那么请在js/app/config/secure.js中修改你本身的 mysql 配置。

修改好后，请运行下面的命令，它会在数据库中添加一个超级管理员。

npx jest tests/app/dao/addSuper.test.ts
复制代码

接下来，请选择一个方式运行你的程序。

以 typescript 的方式运行

npm run start:dev
复制代码

将 typescript 编译成 javascript 的方式运行

npm run tsc:prod && npm run start:prod
复制代码

经过 javascript 的方式直接运行

node js/app/starter.js
复制代码

若是一切顺利，后端会监听本地的3000端口，而后咱们再次来到lin-cms-vue的前端的文件夹下，打开src/config/index.js文件，修改里面的baseUrl为http://localhost:3000/，此时webpack会reload你的前端程序，若是它没有，请你再次经过

npm run serve
复制代码

来运行lin-cms-vue这个项目。浏览器再次打开http://localhost:8080/#/login，点击上面的登录按钮，若是顺利，你会登录成功进入林间有风页面。

特色

lin-cms-koa是团队在lin-cms上的又一次实现，得益于lin-cms-flask的实现，lin-cms-koa变得更加精炼和易用。lin-cms-koa目前还未进入团队的仓库进行维护，目前只放在了我我的的仓库上，待稳定后便会进入到团队仓库进行维护和发布。

lin-cms-koa分为核心库和实例工程两大部分，核心库——lin-cms-test发布在了npm上，目前还处于测试状态下，之后正式发布会更名。实例工程就是上述的项目了。

lin-cms-koa总体上使用typescript开发，也用了一些ts的特性，之因此用ts，是由于ts对于项目的开发和维护有极大的益处。不过咱们也提供了js的版本，即lin-cms-koa/js目录，而目录lin-cms-koa/ts是咱们的ts版本，你能够任意选择一个版本进行开发，固然目前不建议直接使用在生产环境中。

js版本的大部分代码是由ts版本编译而来的，可是考虑到两者的差别性，咱们作了不少的补丁，主要是js目前不支持装饰器，而咱们的参数校验使用到了装饰器，因此咱们在js/app/libs/util.js中提供了decorateProp和decorateEntify这两个方法。

在ts中，一个简单的校验类能够这样建立：

export class BookSearchForm extends Form {
  @IsNotEmpty({ message: "必须传入搜索关键字" })
  q!: string;
}
复制代码

经过上述的两个函数作补丁，在js中它是这样的：

class BookSearchForm extends Form {}
decorateProp([
  IsNotEmpty({
    message: "必须传入搜索关键字"
  })
], String, BookSearchForm.prototype, "q");
exports.BookSearchForm = BookSearchForm;
复制代码

固然，这样的补丁也被应用在了model类上，你能够查看相关的代码。

总结

lin-cms-koa从一贫如洗到今天支持双语言，也只有20天左右的时间，这20天里，它确实花去了我不少的时间。固然，它还不成熟，只能做为个人我的项目进行展现，咱们团队会在后续进行诸多测试和改善，它会在不久后正式进入咱们的团队仓库，并提供完善的文档。

lin-cms开源不久，咱们团队一直在致力于它的发展和完善，若是你感兴趣能够查看官网进行尝试。