Purple4pur's Blog

Author: Purple4pur
Date: 2020 / 01 / 31
License: MIT

开源的个人博客，线上地址 www.purple4pur.com。

搭建这个博客得到了舍友 Yuhi 的启发（ballball大佬带带我），看他在 他的博客 上记录和分享内容我觉得很赞。于是寒假期间瞎学习了一波，打算纯手撸一个博客，当然现在还在逐步搭建中，希望上学前能有一个比较完整的面貌。

本 repo 是从一个私人仓库复制过来的，所以有一些初始进度，以后代码会直接提交到这里。

2020 / 02 / 15 更新：从 1 月 25 号到今天，博客终于「能用」了。大声宣布目标完成！

技术栈

前端

框架 React：流行的前端框架 路由 react-router-dom：react 搭配的路由 dom 组件 数据管理 redux：统一管理前端的所有数据 react-redux：利用 react 的 content 特性优化 redux 在 react 框架中的体验 redux-thunk：redux 官方的 middleware，功能同 redux-saga 网络请求 axios：常用 http 请求库 md 内容渲染 react-markdown：markdown 源文本渲染为组件

后端

服务器 php：需要的功能不复杂，再说了别的我也不会…… 数据库 MariaDB：MySQL 的一个变体

当然由于博客还在搭建中，可能用的技术还会更改，我会及时更新的。

进度及 todos

由于我是边学边查边写，所以进度不快也不稳定，还会经常犯错，李姐万岁。

初始进度：完成前端的 header 和 footer，数据库完成设计，后端页面能正确显示数据。

待完成：

编辑文章 优化页面布局 评论 ...

已完成：

各个分类显示文章列表 全部改用 inner join 查询数据库 增加标签栏 显示标签栏内容 404 页面 按标签显示文章 CMS 登陆及检查（login 页面） 记住登陆 错误提示 CMS 导航栏和大致框架 文章管理显示文章列表 CMS 提交新文章 markdown 渲染出 html 单独的文章页面 CMS 草稿箱 文章详情页样式 数据库的操作改用 prepare 和 bind 栏目页和标签页的样式 提交文章时选择标签 用 react-helmet 库控制标题 文章内图片样式 首页 关于 http 重定向

本地搭建

clone

git clone git@github.com:purple4pur/blog-with-cms.git cd blog-with-cms 安装依赖库

npm install 启动调试

npm start

可用脚本

npm start：启用本地预览或 debug，默认地址 http://localhost:3000/。 npm run build：生产环境打包，打包结果位于 /build 目录下。

注意

将 /src/services/index.js 内的 baseUrl 更改为自己的后端响应页面。 将 /public/apis/consts 目录下的 dbConst.example.php 重命名为 dbConst.php，并修改为自己的数据库信息。 将 /public/apis/consts 目录下的 privateKey.example.php 重命名为 privateKey.php，并修改为自己用于加密的随机字符串。 所有 sql 语句请根据数据库的结构进行修改。

关于 CHANGELOG

此文档只记录网页上「看得见」的变化，详细代码变化请查看 commit message。

关于 ISSUELOG

此文档记录开发过程中「已解决」的问题，未解决的问题可参看 Issues。

交流

关于本 repo 的任何问题，可以移步 Issues，我也会在 Issues 里记录开发中的一些问题。也欢迎从以下方式直接联系我（务必备注清楚），一起交流学习。

E-mail: pruple4pur@gmail.com

注意

本 repo 暂时不接受 pull request。