本项目是一个用vue和node以及mysql实现的一个简单的个人博客系统,整体逻辑比较简单。但是可以我们完整的了解一个项目从数据库到后端到前端的实现过程,适合不太懂这一块的朋友们拿来练手。

本项目所用到的技术和工具:

  • 前端:vue,element-ui,axios,webpack,npm或者yarn,vuex,PWA
  • 后端:express
  • 数据库:mysql
  • 开发工具:Vs Code,Navicat

部分展示页面:

    

      

  

项目结构目录:

dist中是打包生成的文件,server中是关于后端服务器的配置以及数据库的连接,src目录中是前端页面以及逻辑的编写。config目录中是webpack的一些配置。

项目运行:

npm install或者yarn

cd server,node index.js  进入后端文件夹开启服务器,如果不开始服务器的话前端是无数据的

npm run dev 运行项目

源码地址:

https://github.com/dawnGoblin/myblog

如果各位感觉有用的话欢迎star一下

Vue+node.js实现一个简洁的个人博客系统的更多相关文章

  1. 推荐一个简洁优雅的博客系统,farbox

    这是我用farbox搞的一个博客:http://www.jsnull.com/ 特点: 1.无数据库,数据存在dropbox里,需要自己注册一个dropbox帐号 2.静态文本文件即是文章,可以在任何 ...

  2. Node.js 从零开发 web server博客项目[express重构博客项目]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  3. Node.js 从零开发 web server博客项目[koa2重构博客项目]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  4. Node.js 从零开发 web server博客项目[安全]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  5. Node.js 从零开发 web server博客项目[日志]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  6. Node.js 从零开发 web server博客项目[数据存储]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  7. Node.js 从零开发 web server博客项目[登录]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  8. Node.js 从零开发 web server博客项目[接口]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  9. Node.js 从零开发 web server博客项目[项目介绍]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

随机推荐

  1. github中markdown语言的使用规则

    开始使用github就接触了markdown,确实如它的宗旨所言"易读易写",语法简洁明了,功能比纯文本更强,是一种非常适用于网络的书写语言.并且一大优点是兼容HTML,只要不在m ...

  2. Qt qmake报错(TypeError: Property 'asciify' of object Core::Internal::UtilsJsExtension)

    问题如题. 解决方案: 第一种 用下管理员权限来打开qt creator,再创建工程.有可能是没权限创建出源码工程目录 第二种 打开qt左边的项目上,可以看到这个项目的编译路径,修改成绝对路径,或者设 ...

  3. 字符串Hash算法比较

    基本概念所谓完美哈希函数,就是指没有冲突的哈希函数,即对任意的 key1 != key2 有h(key1) != h(key2).设定义域为X,值域为Y, n=|X|,m=|Y|,那么肯定有m> ...

  4. C++中String字符串查找

    在写C++程序中,总会遇到要从一个字符串中查找一小段子字符串的情况,对于在C中,我们经常用到strstr()或者strchr()这两种方法.而对于C++的string,我们往往会用到find(). C ...

  5. SQLServer —— 用户权限操作

    说明 以下操作都是基于SQLServer登陆验证方式登陆.而且操作员都是 sa. 一.添加登陆账号 use master go ' 第一个(xu)是登陆名,第二个(123456)是登陆密码. 执行语句 ...

  6. nodeJs学习-13 router

    const express=require('express'); var server=express(); //目录1:/user/ var routeUser=express.Router(); ...

  7. iOS app 设计推荐

    见微知著,谈移动缺省页设计 http://www.cocoachina.com/design/20150303/11186.html Facebook产品设计总监!设计APP时的14个必考题 http ...

  8. el标签 2016-06-05 21:39 477人阅读 评论(15) 收藏

    JSP EL语言定义 E L(Expression Language) 目的:为了使JSP写起来更加简单. 表达式语言的灵感来自于 ECMAScript 和 XPath 表达式语言,它提供了在 JSP ...

  9. 【uml】之用例图中的关系 标签: uml图形 2014-11-23 11:10 1422人阅读 评论(29)

    用例图显示谁是相关的用户,用户希望系统提供什么样的服务(用例),用例之间的关系图,用例图主要的作用是获取需求.指导测试.所以,用例图是站在用户的角度来画的图,应该体现的是用户想要的功能,并不需要体现如 ...

  10. Maven中央存储库 和 如何从Maven远程存储库下载?

    当你建立一个 Maven 的项目,Maven 会检查你的 pom.xml 文件,以确定哪些依赖下载.首先,Maven 将从本地资源库获得 Maven 的本地资源库依赖资源,如果没有找到,然后把它会从默 ...