网站制作架构,建设部网站证件查询,分销系统app,杭州知名网站建设之前自己的博客是用hexo做的#xff0c;后面想做一个有后台的博客就打算用vue加node来试试#xff0c;于是就有了这个博客。 项目地址
W-Blog
W-Blog是一个基于vue和node的小小小博客 前端用vue#xff0c;后端用egg.js
快速入门
技术栈
前端#xff1a; 用户端#…之前自己的博客是用hexo做的后面想做一个有后台的博客就打算用vue加node来试试于是就有了这个博客。 项目地址
W-Blog
W-Blog是一个基于vue和node的小小小博客 前端用vue后端用egg.js
快速入门
技术栈
前端 用户端vue、iviewadmin端vue、d2admin、element 后端: egg.js、mongodb
功能特性
轻量级Markdown编辑器图片上传七牛支持标签、分类、搜索草稿箱等功能标签云
线上地址
煌哥哥的博客
图片演示
前台
首页浏览 文章详情浏览及目录导航 可根据分类和标签搜索文章 输入关键词搜索 标签云及搜索
后台
后台登录 文章列表 文章搜索 文章编辑 增加分类 增加标签 标签修改分类一样 文章修改 文章删除支持垃圾箱草稿箱
目录结构
│ .autod.conf.js
│ .eslintignore
│ .eslintrc
│ .gitignore
│ .travis.yml
│ app.js // 项目启动前执行比如写入管理员
│ appveyor.yml
│ package.json
│ README.md
│
├─app
│ │ router.js // 服务端路由
│ │
│ ├─controller
│ │ admin.js // 后台相关controller
│ │ client.js // 前台相关controller
│ │ login.js // 登录相关controller
│ │ page.js // 页面相关controller
│ │
│ ├─extend
│ │ helper.js
│ │
│ ├─middleware
│ │ auth.js // 登录验证中间件
│ │
│ ├─model
│ │ Article.js // 文章model
│ │ Category.js // 分类model
│ │ Tag.js // 标签model
│ │ User.js // 用户model
│ │
│ ├─public
│ │ │
│ │ ├─admin // admin端
│ │ │ ├─dist // 打包生成后的目录
│ │ │ └─src // admin端源文件
│ │ │
│ │ └─client // 用户端
│ │ ├─dist // 打包生成后的目录
│ │ └─src // 用户端源文件
│ │
│ └─service // service部分用来执行具体的操作
│ admin.js
│ client.js
│ login.js
│
├─config
│ config.default.js // 项目配置相关
│ plugin.js
│
└─test // 测试相关└─app└─controllerhome.test.js全局配置
module.exports appInfo {return {keys: appInfo.name _1432030565447_3632,mongoose: {clients: {blog: {url: mongodb://127.0.0.1/blog,options: {user: test, // 数据库的用户名 pass: test // 数据库的密码},}}},// 初始化管理员信息user: {userName: admin,password: admin,},session: {maxAge: 3600 * 1000,},jwt: {cert: jsonwebtoken // jwt秘钥},/*** markdown编辑器的图片上传用的是七牛存储* 所以需要配置七牛的key*/qiniu: { // 这里填写你七牛的Access Key和Secret Keyak: ,sk: }}
};本地运行
安装MongoDB数据库和Node.js环境。
# 安装服务端依赖
npm install
# 开启mongodb
mongod --dbpath 你数据库的目录 # --auth 如果开启密码要加上这个命令
# 运行服务
npm run dev# 进入前台目录
cd ./app/public/client/src
# 安装前台依赖
npm install
# 运行前台项目
npm run dev# 进入后台目录
cd ./app/public/admin/src
# 安装后台依赖
npm install
# 运行后台项目
npm run dev# 即可通过 http://127.0.0.1:8080访问
# 开发阶段直接通过webpack的devserver访问
# 代理请求已经配置好可在config下配置proxyTable更改打包
# 在前台和后台目录分别
npm run build
# 在项目根目录
npm install --production
# 启动
npm start
# 打包后可以通过
# http://127.0.0.1:7001/ 和 http://127.0.0.1:7001/admin 来访问前台和后台