基于Vue+node.js的个人博客
前言
作为一个年轻的程序员,而且是作为一个未来的前端工程师,怎么能没有一个属于自己的博客呢,于是乎在暑假咸鱼了一个多月后开始了我的博客的编写。
技术栈
前端 vue.js+scss 因为当时没学vuex所以没用到
后端 node.js express框架
数据库 mysql
特点
1.响应式布局,能够适应各种不同分辨率的场合,除了对低端浏览器的不兼容外就没别的,煞风景的地方了。
2.所以功能都是自己写出来的,左边导航栏的控制然后页面内容的各种样式,没有用框架,全是自己写的。
3.在文章的页面用了markdowm的转换,只要书写markdowm格式就会显示出相应的样式
项目结构
server是node.js文件,mysql里面是链接数据库文件,src是前端文件
前端
路由用的vue-route
发送请求用的axios
组件间传输数据用的event bus
对于响应式,字体大小单位全是rem,然后如果大小可以用百分比尽量都用百分比,然后必要的时候设置一下媒体查询
后端
中文字段全部用unicode编码保存,防止乱码。
数据库编写一个配置接口,在路由的时候进行调用,当前这次用完就关掉
源码
https://github.com/WindStormrage/blog
欢迎各位star
环境:node.js+mysql
演示地址:http://www.xiedashuaige.cn/bolg2.0/#/home
页面展示
基于Vue+node.js的个人博客的更多相关文章
- 分享个基于 Node.js + React 的博客系统
是使用 ES2015+ 特性写的,使用了 ThinkJS 框架,后台使用了 React. 完全使用 Markdown 来写文章,还可以把文章推送到团队博客系统中(团队博客也需要使用该系统). 项目地址 ...
- github+hexo+node.js搭建个人博客基本过程及遇到的问题
一,所需工具 1,github账号+Gitclient+配置SSH key 2,安装node.js. 3,安装Hexo. 当中,github pages是我们用来部署我们本地的博客到github上的. ...
- Node.js的开源博客系统Ghost搭建教程
准备工作 Node.js版本:0.10.x.0.12.x.4.2.x.安装步骤可参考:Node.js环境搭建 Ghost版本:0.7.4:中文集成版(33.6M),中文标准版(3.39M),英文原版( ...
- Node.js+Express搭建博客系统基本环境安装
1.下载安装node.js 官网下载地址:https://nodejs.org/en/download/ 2.安装express. 打开node命令行工具,在命令行中输入:npm install -g ...
- 在阿里云ECS CentOS7上部署基于MongoDB+Node.js的博客
前言:这是一篇教你如何在阿里云的ECS CentOS 7服务器上搭建一个个人博客的教程,教程比较基础,笔者尽可能比较详细的把每一步都罗列下来,包括所需软件的下载安装和域名的绑定,笔者在此之前对Linu ...
- 基于Hexo+Node.js+github+coding搭建个人博客——基础篇
附上个人教程:http://www.ookamiantd.top/2017/build-blog-hexo-base/ 搭建此博客的动机以及好处在此就不多谈了,之前已经表达过,详情请看Start My ...
- 基于 Hexo + GitHub Pages 搭建个人博客(一)
前言:我的博客写作之路 15 年刚上大学,第一次接触公众号,就萌生了创建一个公众号写点东西,但最终不了了之. 很快到了 16 年,开始接触网上各大博客网站,接触最多的当属 CSDN,萌生了注册一个博客 ...
- 基于Hexo+Github Pages搭建的博客
概念 Github Pages可以被认为是用户编写的.托管在github上的静态网页.使用Github Pages可以为你提供一个免费的服务器,免去了自己搭建服务器和写数据库的麻烦.此外还可以绑定自己 ...
- 基于 Hexo + GitHub Pages 搭建个人博客(二)
在 基于 Hexo + GitHub Pages 搭建个人博客(一) 这篇文章中,我们已经知道如何使用 Hexo + GitHub Pages 搭建一个个人博客,GitHub 为我们提供了免费的域名和 ...
随机推荐
- Swift 线程安全数组
欢迎大家前往腾讯云社区,获取更多腾讯海量技术实践干货哦~ 作者:BigNerdCoding 有并发的地方就存在线程安全问题,尤其是对于 Swift 这种还没有内置并发支持的语言来说线程安全问题更为突出 ...
- 网页设计——5.table布局
今天做一个大的页面,主要是对table布局的理解: 代码: <table cellspacing=0 border=1 style="bordercolor:#C0C0C0;" ...
- Vux配置指南
流程 Vux是Vue.js的一个ui库,官网在这里,官方文档的配置指南侧重于技术的罗列,我这里简化一下Vux的配置流程. 1. 安装vux npm install vux --save 2. 安装le ...
- javascript设计模式——享元模式
前面的话 享元(flyweight)模式是一种用于性能优化的模式,“fly”在这里是苍蝇的意思,意为蝇量级.享元模式的核心是运用共享技术来有效支持大量细粒度的对象.如果系统中因为创建了大量类似的对象而 ...
- dva + antd + mockjs 实现基础用户管理
1.安装dva-cli npm install dva-cli -g 2.创建应用 dva new dvadashboard [dvadashboard为项目名] 3.安装mockjs ...
- ofBiz-groovy-freemarker
ofBiz-groovy-freemarker根据浏览器的地址不同进入不同的页面 第一步:(2选一)创建groovy文件,或者java文件.在文件中定义变量 要放在 request.setAttrib ...
- Android Static分析
1.static的变量或者方法会放在内存的一个方法区内 2.static变量会在该变量所属的类从内存中释放掉之后. 才会释放掉而类释放的条件是非常苛刻的. 必需要该类相应的全部对象被释放掉. 同一时候 ...
- EasyARM i.mx287学习笔记——通过modbus tcp控制GPIO
0 前言 本文使用freemodbus协议栈,在EasyARM i.mx287上实现了modbus tcp从机. 在该从机中定义了线圈寄存器.当中线圈寄存器地址较低的4位和EasyARM的P2 ...
- hdu 4409 Family Name List(LCA&有坑点)
Family Name List Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) ...
- 黑马day16 jquery&内容过滤选择器&可见度选择器
内容过滤选择器的过滤规则主要体如今它所包括的子元素和文本内容上 .:contains(text) 使用方法: $("div:contains('John')") 返回值 集 ...