kov-blog

授权协议 MIT License
开发语言 JavaScript
所属分类 Web应用开发、 常用JavaScript包
软件类型 开源软件
地区 不详
投 递 者 苍元章
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

kov-blog

v2版本正在开发当中...

a blog platform built with vue, koa and mongo. 使用vue,koa和mongo搭建的博客页面和markdown语法的博客编写平台,自动保存草稿。

博客预览地址:https://chuckliu.me

kov-blog 使用了vuevuexkoamongo等框架和技术。前后端分离,restful架构。项目主要包含三个文件夹和项目:

  • server 后台 包含了所有的后台服务,为博客和博客管理提供后台接口
  • client 前端 博客的前端呈现,被vue洗脑严重,界面模仿了vue官方博客,评论系统用的是多说(但是多说很不稳定...而且已经很久无人维护..)
  • admin 前端 博客管理平台的前端,功能上类似于带发布博客功能的印象笔记,markdown语法,预览和编写同步进行,带有自动保存功能,书写的文章只有在发布之后才会同步当前内容到博客client页面上,也完全可以当做一个笔记类应用去用,这样做的目的是出于有的时候在写文章a的时候,觉得某一部分的内容过于复杂,可以另外开一篇文章b来仔细讲解下,但是等我写完a就忘了,因为以往的博客cms比如hexo,wordpress之类都是直接发布的.而且这样做了之后博客也好用多了,我经常在码代码的时候遇到一些问题,这样可以直接打开博客后台,开一篇文章记录一下遇到的问题,但是不发布出去,提醒自己需要整理一篇相关内容的文章.以后一登这个管理系统就可以看到了这篇没有没有发布过的文章,就可以整理这篇文章,等到写完之后发布出去就可以了.

使用了许多es6新特性,请使用6.0以上版本的node!

使用之前请先确保已经安装mongo!

如果要使用评论系统,请先注册多说,修改/client/src/Blog.vue中的多说二级域名为您自己的多说二级域名

server

基于restful,nodejs的话采用koa框架(koa 1),数据库用了mongo。登录这块的话用了jwt.

生产环境下可在可在server/configs目录下增加private.js文件,增加私有配置.

因为使用了许多es6/7 新语法,所以请使用6.x版本node

npm command

# install dependencies
npm install

# 开发
# 带热重载,跑在本地3000端口
npm run dev-server

# 部署
npm run build-server


client

博客呈现页面,基于vue(1.0),前后端通信用的fetch,评论系统用的是多说,界面模仿了vue博客,大量使用了其样式效果,还有很多要完善的地方。

技术栈

  1. Vue && vue-router
  2. fetch
  3. stylus
  4. marked && highlight

npm command

# install dependencies
npm install

# 开发,跑在本地8080端口
npm run dev-client

# 打包
npm run build-client


admin

初始用户名:admin,初始密码:password

博客管理系统,也是前后端完全分离的。功能上类似于印象笔记,实时保存你的文章,当你觉得写好了之后可以发布文章,每次发布都会把文章同步更新到博客上,这样在client端就能看到。采用markdown语法,编辑器采用的是SimpleMDE,支持大量快捷键。

快捷键 Action
Cmd-' "toggleBlockquote"
Cmd-B "toggleBold"
Cmd-E "cleanBlock"
Cmd-H "toggleHeadingSmaller"
Cmd-I "toggleItalic"
Cmd-K "drawLink"
Cmd-L "toggleUnorderedList"
Cmd-P "togglePreview"
Cmd-Alt-C "toggleCodeBlock"
Cmd-Alt-I "drawImage"
Cmd-Alt-L "toggleOrderedList"
Shift-Cmd-H "toggleHeadingBigger"
F9 "toggleSideBySide"
F11 "toggleFullScreen"

技术栈

  1. Vue && vuex && vue-router
  2. fetch
  3. stylus
  4. SimpleMDE && marked && highlight

npm command

# install dependencies
npm install

# 开发,跑在本地8081端口
npm run dev-admin

# 打包
npm run build-admin

  • 博客终于差不多写完了,虽然还是可能有一堆bug, 不过我迫不及待要写一篇博文来分享了= = 博客前台展示 博客前台展示 博客后台展示 博客后台展示 博客后台编辑 项目地址 github地址:github.com/BUPT-HJM/vu… 在线访问地址: http://123.206.67.156:9000/ (域名还在备案中...) 大家一起来star、fork呀,欢迎提出各种改进意见,我知道肯定

 相关资料
  • 本文向大家介绍JS实现新浪博客左侧的Blog管理菜单效果代码,包括了JS实现新浪博客左侧的Blog管理菜单效果代码的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了JS实现新浪博客左侧的Blog管理菜单效果代码。分享给大家供大家参考,具体如下: 这里介绍新浪博客左侧的Blog管理菜单,我们变通一下,如果你在设计程序,那么本款菜单用到后台管理中想必应该很合适吧,图片是调用新浪的,用了比较多的图

  • 本文向大家介绍彻底删除thinkphp3.1案例blog标签的方法,包括了彻底删除thinkphp3.1案例blog标签的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了彻底删除thinkphp3.1案例blog标签的方法。分享给大家供大家参考。具体方法如下: thinkphp3.1框架中的案例blog,添加日记的同时可以添加标签tag,但仅此而已。当删除日记时,标签并没有被删除掉,从

  • 本文向大家介绍给Python的Django框架下搭建的BLOG添加RSS功能的教程,包括了给Python的Django框架下搭建的BLOG添加RSS功能的教程的使用技巧和注意事项,需要的朋友参考一下 前些天有位网友建议我在博客中添加RSS订阅功能,觉得挺好,所以自己抽空看了一下如何在Django中添加RSS功能,发现使用Django中的syndication feed framework很容易实现

  • 我试图通过id从mongo检索数据,但当我添加外部链接(如样式文件或脚本文件)时,它工作正常,我收到此错误消息。 消息:“对模型“Blog”路径“_id”处的值“script.js”的转换失败,名称:“CastError”,stringValue:“script.js”,种类:“ObjectId”,值:“script”。js',路径:''u id',原因:未定义,模型:

  • 嘿,伙计们真的需要一些关于删除路由的帮助。我正在使用RESTful路由,尝试遵循约定,添加删除路由时,我得到错误: CastError:模型"Blog"的路径"_id"处的值"X"转换为ObjectId失败 我已经在stackoverflow上搜索了这个问题,我能想到的最好的版本是猫鼬有一个错误。我把它回滚到V4.10.0,仍然在处理这个问题。我的代码如下: