初始化个人博客框架

.gitignore

@@ -0,0 +1,23 @@
+.DS_Store
+node_modules
+/dist
+
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

db.sql

@@ -0,0 +1,54 @@
+create DATABASE pro_blog;
+
+use pro_blog;
+
+-- 用户登录表:  登录信息ID、登录时间、登录IP、客户端标识、有效期
+
+create table login(
+	id int(10) PRIMARY KEY AUTO_INCREMENT,
+	login_time datetime not null,
+	-- xxx.xxx.xxx.xx -> ipv4
+	-- xxxx:xxxx:xxxx::xxxx -> ipv6
+	ip varchar(40) not null,
+	client varchar(200) null,
+	expire_time datetime null
+);
+
+-- 文章表: 文章ID、标题、封面、发布时间、描述(一部分的文章内容)、文章内容、分类、阅读量、评论数、状态
+
+create table article(
+	id int(10) PRIMARY KEY AUTO_INCREMENT,
+	title varchar(50) not null,
+	cover varchar(200) null,
+	publish_time datetime null,
+	description varchar(500) null,
+	content text not null,
+	category varchar(20) not null,
+	view_count int default 0,
+	comment_count int default 0,
+	status tinyint(1) default 1 -- 状态 1标识草稿 2表示已发布 0表示已删除
+);
+INSERT INTO article(title,publish_time,description,content,category) VALUES('测试1','2022-05-10 16:52:09','测试测试','测试测试测试测试','默认');
+INSERT INTO article(title,publish_time,description,content,category) VALUES('测试2','2022-05-10 16:52:09','测试测试','测试测试测试测试','默认');
+INSERT INTO article(title,publish_time,description,content,category) VALUES('测试3','2022-05-10 16:52:09','测试测试','测试测试测试测试','默认');
+INSERT INTO article(title,publish_time,description,content,category) VALUES('测试4','2022-05-10 16:52:09','测试测试','测试测试测试测试','默认');
+INSERT INTO article(title,publish_time,description,content,category) VALUES('测试5','2022-05-10 16:52:09','测试测试','测试测试测试测试','默认');
+INSERT INTO article(title,publish_time,description,content,category) VALUES('测试6','2022-05-10 16:52:09','测试测试','测试测试测试测试','默认');
+INSERT INTO article(title,publish_time,description,content,category) VALUES('测试7','2022-05-10 16:52:09','测试测试','测试测试测试测试','默认');
+-- 评论表: 评论ID、文章ID、评论内容、发布时间、评论者IP
+create table comment
+(
+    id int(10) PRIMARY KEY AUTO_INCREMENT,
+	article_id int(10) not null,
+    content varchar(500) not null,
+    publish_time datetime not null,
+	ip varchar(40) not null
+);
+
+-- 分页查询
+select * from article limit 4; -- 只查询4条
+select * from article limit 0,2; -- 第1页
+select * from article limit 2,2; -- 第2页
+select * from article limit 4,2; -- 第3页
+-- 假设条数位:size 页码为: page
+-- 那么分页的起始位置为: (page - 1) * size

index.js

@@ -0,0 +1,13 @@
+const express = require("express")
+const user = require('./modules/user') // 用户模块
+const article = require('./modules/article') // 文章
+
+const app = express(); // 创建express应用
+
+app.use(express.static('public')) // 设置静态文件路径
+// 使用路由模块
+app.use('/api/user',user)
+app.use('/api/article',article)
+
+app.listen(3000); // 监听端口
+console.log('server run success! http://localhost:3000')

modules/article.js

@@ -0,0 +1,39 @@
+const db = require('./db'); // 
+// 文章模块
+const router = require('express').Router();
+// 用户网站模块
+
+// 1.查询文章列表(分页)
+router.get("/web/list",async function (req, res) {
+    const page = req.query['page'] || 1; // 获取页码
+    // 默认每页5条
+    const start = (page - 1) * 5;
+    // db.pool.query("select * from article limit ?,5", [start], (err, listResult) => {
+    //     if (err) {
+    //         console.log(err)
+    //         res.send([]);
+    //     }
+    //     else{
+    //         // res.send(result);
+    //         db.pool.query('select count(*) as total from article',(err,result)=>{
+    //             res.send({
+    //                 count:result,
+    //                 list:listResult
+    //             });
+    //         })
+    //     }
+    // });
+
+    try{
+        const listResult = await db.query("select * from article limit ?,5", [start]); // 执行查询语句并等待结果出来后赋值给变量
+        const totalCount = await db.query('select count(*) as total from article'); // 执行获取总条数
+        res.send({count:totalCount[0]['total'],list:listResult,size:5});
+    }catch(e){
+        console.log(err)
+        res.send({count:0,list:[]});
+    }
+});
+
+// 管理后台模块
+
+module.exports = router

modules/db.js

@@ -0,0 +1,30 @@
+const mysql = require('mysql')
+
+// 创建数据库连接池
+const pool = mysql.createPool({
+    user: 'root',
+    password: '123',
+    database: 'pro_blog',
+    timezone: 'Asia/Shanghai'
+});
+function query(sql, values = []) {
+    return new Promise(function (resolve, reject) { // resolve是成功的回调函数 reject是错误的回调函数
+        pool.query(sql, values, function (err, result) {
+            if (err) {
+                reject(err) // 有错误 直接回调错误的函数
+            } else {
+                resolve(result) // 直接正常的回调
+            }
+        });
+    });
+}
+//
+// query('select',function(){})
+// query('select',[],function(){})
+
+// 暴露接口
+module.exports = {
+    pool,
+    createConnection: pool.getConnection,
+    query
+}

modules/user.js

@@ -0,0 +1,3 @@
+const router = require('express').Router();
+
+module.exports = router

package.json

@@ -0,0 +1,21 @@
+{
+	"name": "pro-blog",
+	"version": "1.0.0",
+	"description": "",
+	"main": "index.js",
+	"scripts": {
+		"start": "nodemon index.js"
+	},
+	"keywords": [],
+	"author": "",
+	"license": "ISC",
+	"dependencies": {
+		"element-ui": "^2.15.8",
+		"express": "^4.18.1",
+		"mysql": "^2.18.1",
+		"vue": "^3.2.33"
+	},
+	"devDependencies": {
+		"nodemon": "^2.0.16"
+	}
+}

public/index.html

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="./element-ui/lib/theme-chalk/index.css">
+</head>
+
+<body>
+    <div id="home">
+        <h1>{{title}}</h1>
+        <div>
+            <el-button>xxxx</el-button>
+        </div>
+    </div>
+    <script src="./vue/dist/vue.js"></script>
+    <script src="./element-ui/lib/index.js"></script>
+    <script type="module">
+        // import Vue from './vue/dist/vue.esm-browser.js'
+        // import ElementUI from './element-ui/lib/index.js'
+        const HomeApp = new Vue({
+            el: '#home',
+            data() {
+                return {
+                    title: 'test vue'
+                }
+            }
+        })
+    </script>
+</body>
+
+</html>