P13：中台搭建5-数据库设计与首页接口制作

现在已经可以连接数据库了，我们现在就要好好设计一下数据库结构，把文章的表和类别的表建立好，然后我们复制一些数据进去，形成一个列表，供首页调用。

数据库中的表建立

直接使用 MySQL-front 工具建立使用的表，建立两张表type和article表，表结构如下:

type 表（文章类型表）

• id : 类型编号 int 类型
• typeName: 文章类型名称 varchar 类型
• orderNum: 类型排序编号 int 类型

建立好表之后，我们再写入一条数据，编号为 1，名称是前端教程，排列需要为 1

article 表（文章内容表）

• id : 文章编号 int 类型
• type_id : 文章类型编号 int 类型
• title : 文章标题，varchar 类型
• article_cointent : 文章主体内容，text 类型
• introduce： 文章简介，text 类型
• addTime : 文章发布时间，int(11)类型
• view_count ：浏览次数， int 类型

建立好之后，可以自己写一些对应的文章进去，记得点击发布才可以。

前端首页文章列表接口

现在文章相关的数据表已经建立完成了，我们也简单的写入了一些数据，那现在就可以利用 RESTful 的规范，建立前端首页所需要的接口了。

在/app/contoller/default/home.js文件夹中，写一个getArticleList的方法，代码如下：

async getArticleList() {
  const sql = 'SELECT article.id as id,' +
    'article.title as title,' +
    'article.introduce as introduce,' +
    'article.addTime as addTime,' +
    'article.view_count as view_count ,' +
    '.type.typeName as typeName ' +
    'FROM article LEFT JOIN type ON article.type_id = type.Id';

  const results = await this.app.mysql.query(sql);

  this.ctx.body = {
    data: results,
  };
}

写完之后还需要配置一下路由（router），打开/app/router/default.js,新建立一个 get 形式的路由配置，代码如下：

'use strict';
module.exports = app => {
  const { router, controller } = app;
  router.get('/default/index', controller.default.home.index);
  router.get('/default/getArticleList',controller.default.home.getArticleList);
};

这个配置完成后，可以现在浏览器中预览一下结果，看看是否可以正确输出结果。访问地址：http://127.0.0.1:7001/default/getArticleList。如果能出现结果，说明我们已经完成了数据和接口的开发。