使用前端技术和MySQL+PHP制作自己的一个个人博客网站

源代码地址：https://github.com/YauCheun/BlogCode

我的博客网站地址：http://www.yublog.fun/

制作前景：

想拥有一个自己独自开发的一个小型博客网站，自己能发布博文管理博文。

目标：

了解 Web 开发过程（历史）

掌握基本的动态网站开发

培养 B/S 架构应用开发思维

锻炼 JavaScript jQuery AJAX

开发流程简介

了解了动态网站的概念过后，我们作为开发者更多想到的就是如何具体开发一个动态网站应用程序，有那些具体的工作，流程是怎样的？

正常情况下，我们大概会有如下几个阶段：

需求分析：分析我们这个应用程序到底要去做哪些功能，应对哪些业务。

原型设计：根据需求分析的结果规划应用程序的原型，可以理解为“打草稿”。

UI 设计：将“草稿”转换为设计稿，并提供相应的产物（设计稿、静态页面）。

技术选型：根据业务场景分别选择对应的技术栈（数据库技术栈、后端技术栈、前端技术栈），一般考虑的因素：人、业务。

数据库设计：根据需求和原型分析我们有哪些类型的数据需要存，从而得到我们数据库的基本结构。

项目架构设计：俗称搭架构，其中具体的操作主要就是制定项目规范约束、创建基本的项目结构、编写基础的公共模块代码和组织代码。

业务迭代开发：开发者的日常，基于项目架构（条条框框）下完成各项业务功能。

集中测试：将所有功能模块整合到一起过后，集中测试业务功能是否有 BUG，是否满足需求。

部署上线：从开发环境向生产环境转换，就是把应用部署到服务器上。

准备工作

1.数据库设计

2.项目配置文件

由于在接下来的开发过程中，肯定又一部分公共的成员，例如数据库名称，数据库主机，数据库用户名密码等，这些数据应该放到公共的地方，抽象成一个配置文件 config.php 放到项目根目录下。

这个配置文件采用定义常量的方式定义配置成员：

/**
 * 数据库主机
 */
define('DB_HOST', '127.0.0.1');
/**
 * 数据库用户名
 */
define('DB_USER', 'root');
/**
 * 数据库密码
 */
define('DB_PASS', '111');
/**
 * 数据库名称
 */
define('DB_NAME', '111');

做完了相关的准备工作好，首先编写好所有需要用到的静态页面，我这里用的是bootstrap的样式来写响应式的，把所有的页面都准备好之后然后开始编写后台的代码，

我这里后台是用PHP来写的，主要的功能有管理后台登录：即登录后具有session才能进入后台以及推出后清除当前的session；后台的仪表盘功能：用来显示此时有多少篇文章和以及评论等信息；后台文章管理功能：主要有对文章的编辑，删除以及批量删除；后台文章的新增：用的是百度的UEditor的插件，很容易就能上手使用；后台的评论管理功能：能够对评论删除以及批准和拒绝，这里用到了一个分页的插件jQuery Pagination，评论较多的话会分页；账户管理功能：当前账户能修改密码等。以下是做好的截图。

后台功能写完之后，下一步要做的就是把一些数据传给前台，然后前台拿到这些数据之后就把页面渲染出来，这里就要用到ajax,具体做法实在后台文件夹中建一个接口的文件夹，在里面用PHP代码写要获取的数据，然后在前台用ajax请求这个接口文件获取数据。然后把获取到的数据通过模板渲染到页面上，我的前台页面如下。

所有的源代码我都上传到GitHub上了，链接在下方

源代码地址：https://github.com/YauCheun/BlogCode

我的博客网站地址：http://www.yublog.fun/