一个前端写的php博客系统--支持markdown哦
起因
最近买了个新的域名,同时在阿里云申请了免费的虚拟主机。。。借此机会就想搞个自己的博客站点,虽然之前也使用了hexo + github 、 WordPress 做过,但是我的阿里云虚拟主机实在是不知道怎么去搞hexo (也许根本就搞不起来,除非自己花钱买主机,哈哈)。。。WordPress总是感觉好笨重,运行起来一股的人到中年,气喘吁吁啊。。。百度之后,typeecho成了首选,但是markdown竟然有问题。。。一口老血。。。自己动手吧。。。
用到的资源
thinkphp
官网
快速入门
参考手册
集成开发环境
phpstudy
Materialize UI框架
中文官网
英文官网
markdown 编辑器
marked
editor
代码高亮
highlightjs
github 地址
项目的github地址
数据库设计
目前来说只用到了两张表,一个是文章表,一个是后台登录的用户表,其中有些字段还没有用到,先写上备用,数据库的设计是仿照青春博客设计
文章表
DROP TABLE IF EXISTS `by_article`;
CREATE TABLE `by_article` (`a_id` int(11) NOT NULL AUTO_INCREMENT COMMENT '文章逻辑ID',`a_url` varchar(64) DEFAULT '' COMMENT '文章图片',`a_title` varchar(128) NOT NULL COMMENT '文章标题',`a_remark` varchar(256) DEFAULT '' COMMENT '文章描述',`a_keyword` varchar(32) DEFAULT '' COMMENT '文章关键字',`pid` int(11) NOT NULL DEFAULT '1' COMMENT '文章类别',`a_time` int(10) NOT NULL COMMENT '文章发表时间',`a_content` text NOT NULL COMMENT '文章内容',`a_view` int(11) NOT NULL DEFAULT '1' COMMENT '文章是否置顶',`a_hit` int(11) NOT NULL DEFAULT '1' COMMENT '文章点击量',`a_original` int(1) DEFAULT '0',`a_from` varchar(16) NOT NULL DEFAULT '1',`a_writer` varchar(64) NOT NULL COMMENT '作者',`a_ip` varchar(16) NOT NULL,PRIMARY KEY (`a_id`),KEY `a_title` (`a_title`)
) ENGINE=MyISAM AUTO_INCREMENT=71 DEFAULT CHARSET=utf8 COMMENT='文章表';
用户表
DROP TABLE IF EXISTS `by_user`;
CREATE TABLE `by_user` (`id` int(11) NOT NULL AUTO_INCREMENT COMMENT '用户逻辑Id',`name` varchar(32) NOT NULL COMMENT '登陆用户名',`password` varchar(32) NOT NULL COMMENT '登陆密码',`user` varchar(32) NOT NULL COMMENT '用户名',`class` int(11) NOT NULL COMMENT '用户类别',`last_time` int(11) NOT NULL COMMENT '用户登陆时间',`ip` varchar(16) NOT NULL COMMENT '用户登陆ip',PRIMARY KEY (`id`),KEY `user` (`user`)
) ENGINE=MyISAM AUTO_INCREMENT=20 DEFAULT CHARSET=utf8 COMMENT='用户表';
动手吧
目录结构
ByBlog
- Admin 后台目录
- Conf 配置文件
- Controller 控制器
- Model 模型
- View 页面
- Home 前台目录
- Conf 配置文件
- Controller 控制器
- Model 模型
- View 页面
Public 公共资源目录
- Css 样式目录
- font 、fonts 字体库
- Img 图片
- js
- MarkdownEditor 文章编辑器
- Plugin 插件目录
环境的搭建
phpstudy 是集成的开发环境,下载后解压就可以使用。。。thinkphp下载解压后放到phpstudy的www目录下,在浏览器访问该目录即可把thinkphp安装完成。。。详细的操作流程可以自行百度,或者参考我上面发的资源链接。
数据库配置
在Config文件夹下的config.php 文件中添加数据库的配置信息
//'配置项'=>'配置值'
'DB_TYPE'=>'mysql',// 数据库类型
'DB_HOST'=>'127.0.0.1',// 服务器地址
'DB_NAME'=>'',// 数据库名
'DB_USER'=>'',// 用户名
'DB_PWD'=>'',// 密码
'DB_PORT'=>3306,// 端口
'DB_PREFIX'=>'by_',// 数据库表前缀
'DB_CHARSET'=>'utf8',// 数据库字符集
'USER_AUTH_KEY'=>'authId'
后台博客书写功能
页面view
<!DOCTYPE html>
<html>
<head><title>11</title><include file = "./Public/Public_head_link"/><link rel="stylesheet" href="__PUBLIC__/MarkdownEditor/editor.css" /><script type="text/javascript" src="__PUBLIC__/MarkdownEditor/editor.js"></script><script type="text/javascript" src="__PUBLIC__/MarkdownEditor/marked.js"></script>
</head>
<body>
<include file = "./Public/Public_header"/>
<div id="content" class="container"><form class="col s12 pt-60" method="post" action="__URL__/insert"><div class="row"><div class="col s9"><div class="row"><div class="input-field col s12"><input id="title" name="a_title" type="text" class="validate"><label for="title">文章标题</label></div></div><div class="row"><div class="input-field col s12"><input id="remark" name="a_remark" type="text" class="validate"><label for="remark">文章描述</label></div></div><div class="row"><div class="input-field col s12"><p class="f-16 c-999">文章内容</p><textarea name="a_content" id="textarea" class="materialize-textarea"></textarea></div></div></div><div class="col s3"><div class="row"><div class="input-field col s12"><input id="keyword" name="a_keyword" type="text" class="validate"><label for="keyword">标签(关键字)</label></div></div><button class="btn waves-effect waves-light" type="submit" name="action">发表文章<i class="by bym-feiji right"></i></button></div></div></form>
</div>
<include file = "./Public/Public_footer"/>
<include file = "./Public/Public_foot_script"/>
<script>// markdown 编辑器var editor = new Editor();editor.render();
</script>
</body>
</html>
模型Model
class ArticleModel extends Model {public function addArticle($data){// 添加文章if(M('article')->add($data)){return 1;}else{return 0;}}
}
控制器
public function insert(){$data = array ('a_title' => I('post.a_title'),'a_keyword' => I('post.a_keyword'),'a_remark' => I('post.a_remark'),'a_content' => I('post.a_content'),'a_time' => time(),'a_ip' => get_client_ip(),);if(D('Article')->addArticle($data)){$this->success('发表完成!','lista');}else{$this->error('发表失败!');}
}
如果没有问题的话呢,你就可以看到下面的截图了
后台博客列表功能的实现
视图view
<!DOCTYPE html>
<html>
<head><title>文章列表页 -- ByBlog</title><include file = "./Public/Public_head_link"/>
</head>
<body>
<include file = "./Public/Public_header"/>
<div id="content" class="container by-lista"><div class="row pt-xlg"><div class="col s12"><table class="hoverable"><thead><tr><th data-field="id" class="f-20">文章标题</th><th data-field="id" class="f-20">操作</th></tr></thead><tbody><volist name="list" id="vo"><tr><td class="f-18" width="75%">{$vo.a_title} <span class="f-12 c-999">20{$vo.a_time|date="y/m/d H:i",###}</span></td><td width="25%"><a class="waves-effect waves-light btn mr-lg">编辑</a><a class="waves-effect waves-light btn">删除</a></td></tr></volist></tbody></table><div class="pagination right">{$page}</div></div></div>
</div>
<include file = "./Public/Public_footer"/>
<include file = "./Public/Public_foot_script"/>
</body>
</html>
控制器
public function listA(){// 文章列表// 查询满足要求的总记录数$count = M('article')->count();$this->assign('count',$count);// 实例化分页类 传入总记录数和每页显示的记录数$Page = new \Think\Page($count,10);// 分页显示输出$show = $Page->show();$article = M('article') ->order('a_id desc') -> field('a_title,a_time') ->limit($Page->firstRow.','.$Page->listRows)->select();// 赋值数据集$this->assign('list',$article);// 赋值分页输出$this->assign('page',$show);$this->display();}
然后呢你能看到的页面是这个样子的
到目前存在的坑
写个代码不容易,里面自然有几个坑。。。
- 时间的解码问题
我存到数据库里面的是时间戳,但是经过解码后年份只显示后两位数字,所以我就自己在年份的前面加了20
。。。。所以你们就看到了2070这样的时间点是因为当时存的时间戳为空,就成了默认的时间1970。。。但是如果是新编辑的文章还是木有问题的。。。。
后续
代码写的应该有不少问题,还有很多的功能尚未实现,下篇文章将介绍前台的展示和列表以及后台的用户登录问题(目前后台的登录还有点问题尚未解决)。。。php实在不怎么熟悉了,有问题的话欢迎吐槽(但是别喷我啊。。。)
未完待续。。。
一个前端写的php博客系统--支持markdown哦相关推荐
- 一个前端写的php博客系统2--前台展示+后台登录
前台首页展示 首页的侧边预留的位置是给后面的统计,热门之类的版块预留位置... 控制器 文章列表展示要考虑到文章数量增多后分页展示,那么我们要统计文章数量,使用 count() 计算文章总数,然后使用 ...
- 推荐一个十分好看的开源博客系统
推荐一个十分好看的开源博客系统,直接百度"里程密"地址www.lcm.wang 附图 主页 后台 浓浓的科技简约风,适合做技术的你 转载于:https://www.cnblogs. ...
- 让我的 .NET Core 博客系统支持 Docker
点击上方蓝字关注"汪宇杰博客" 导语 我的博客(https://edi.wang)所使用的博客系统 Moonglade 开源已经一年多了.目前已有至少4位社区朋友使用此系统在 Az ...
- Vien Blog - 一款基于laravel5.8的开源博客,支持markdown
laravel-blog Vien Blog - 一款基于laravel5.8开发的,支持markdown编辑以及图片拖拽上传的博客系统.SEO友好 博主网站 VienBlog 这里有些小秘密 项目G ...
- django admin使用在前端_Django| 给你博客装个Markdown编辑器
小白学Django系列: 小白学Django第一天| MVC.MVT以及Django的那些事 小白学Django第二天| Django原来是这么玩的! 小白学Django第三天| 一文带你快速理解模型 ...
- python移动端web开发代码_移动web前端开发,前端开发工作总结,移动端页面开发-我主页-一个前端程序猿的博客...
热门推荐 html/css 一.escape和它们不是同一类简单来说,escape是对字符串(string)进行编码(而另外两种是对URL),作用是让它们在所有电脑上可读.编码之后的... 标签: 0 ...
- 个人博客系统的测试报告
目录 1.项目背景 2.项目功能 3.测试计划 3.1功能测试 3.1.1 测试用例设计 3.1.2 实际执行测试的部分操作步骤 3.2自动化测试 3.2.1 脑图 3.2.2 代码编写 1.项目背景 ...
- 一个基于Microsoft Azure、ASP.NET Core和Docker的博客系统
2008年11月,我在博客园开通了个人帐号,并在博客园发表了自己的第一篇博客.当然,我写博客也不是从2008年才开始的,在更早时候,也在CSDN和系统分析员协会(之后名为"希赛网" ...
- 分享几个开源Java写的博客系统
文章目录 1. halo(完善生态) 2. solo 3. OneBlog 4. 蘑菇博客(微服务) 5. JPress 有关Java写的博客,网上其实有很多,一般自己如果有技术的话也是可以写的出来的 ...
- 莫提博客 - 简约优雅的个人博客系统
莫提博客 - 简约优雅的个人博客系统 首先声明,这个项目结合了我目前所掌握的大多数技术,其中包括缓存.消息队列.搜索引擎等,所以不太适合刚刚接触JavaWeb的小伙伴.如果你对这些技术有所了解有想找找 ...
最新文章
- 2022-2028年中国异戊二烯橡胶产业竞争现状及发展规模预测报告
- 【每日DP】day12、P1063 能量项链(区间DP又一模板,震惊,只需要4行代码?)难度⭐⭐⭐
- CTFshow php特性 web127
- python右对齐格式化输出_python笔记-格式化输出(%和format的用法)
- 2.4 表单数据的验证
- rpm linux gcc安装目录,Linux环境下通过rpm安装gcc的顺序
- 稳定币兑换器Orbits发布路线图,包括发行治理代币ORB等
- 【Unity效率优化】资源管理系统Addressable Asset
- 为资产分类定义折旧范围_SAP使用权资产配置浅析
- CMMI中的过程改进
- 分享我的大型Java多用户商城系统开发的心得和困难
- Hadoop学习笔记——HA
- 公主救骑士---地下城游戏_leetcode
- R包的安装以及安装失败的解决
- LM2596开关电源 多路开关电源 DC-DC降压电源 固定/可调输出 原理图和PCB
- linux生成license,License生成秘钥
- 科学解释:为什么越是无知的人越自信?
- 在美国,男 / 女卫生间(厕所)的正确称呼为什么?请用英语写出答案。
- 《Java编程思想》读书笔记之第7章-复用类
- java判断是平年还是闰年