本博客教学视频来源于imoom 《0到1快速构建自己的后台管理系统》课程
本节成果:
官方演示地址:https://talelin.com/
目录
一、项目介绍
项目地址源码: 林间有风: 林间有风团官方团队
文档地址:介绍 | Lin CMS
项目是前后端分离的框架,可以根据需要选择版本。本课程和博客主要使用vue+Koa实现后台管理系统
二、项目运行
1.前端代码运行
(1)下载代码
在你需要的文件目录中下载代码(使用imooc-island分支的代码)
git clone -b imooc-island https://gitee.com/talelin/lin-cms-vue.git
(2)安装依赖
安装依赖之前需要运行如下代码:
npm config set registry https://registry.npm.taobao.org
npm config set sass_binary_site https://npm.taobao.org/mirrors/node-saas
之后运行安装依赖命令
npm install
(3)解决node-sass问题
注意首先node和npm的版本要匹配对应版本查询以往的版本 | Node.js
如果你的node 版本是12,那么可能install安装成功的。
如果是高版本,那么大概率会install安装失败。
(每次安装失败重新安装时记得删除目录下的node-modules文件夹)
步骤一:安装nvm,并切换node版本为12.
nvm安装,nvm的使用,nvm常用命令,nvm安装node报错,nvm切换不了,系列集合_MuGuiLin的博客-CSDN博客_nvm安装
步骤二:如果在此基础上删除node-modules之后 npm install 还是运行失败,直接卸载node-sass重装
npm un node-sass
npm install [email protected]
执行命令不报错后,运行项目
(4)运行项目
npm run serve
运行过程中会报错,不用担心,是eslint的问题,直到看到网址则运行成功
在浏览器中输入localhost:8080,查看到如下页面表示前端运行成功。但是由于后端还没有配置,因此还无法登录。
2.后端项目运行
(1)项目环境
- JDK1.8+,已在 JAVA8、9、11 上测试通过。
- MySQL5.6+,确保你有可用的数据库环境。
- Maven3.6+,依赖、打包需要它。
(2)下载代码
前后端代码最好在同一目录下,方便管理
(博主在此目录不太对哈,我写完忘记保存 导致我前面写的都没了,只好从头来给大家跑一下,问候CSDN的祖宗,白眼)
git clone -b imooc-island https://gitee.com/talelin/lin-cms-koa.git
(3)安装依赖
进入项目目录 安装依赖
npm install
(4)数据库配置
在自己的数据库可视化工具中创建lin-cms的数据库
打开app-->config-->scure.js修改成自己数据库的信息,包含数据库名称、用户名、密码
(5)导入数据
项目根目录下有个schema.sql文件,我们需要执行sql命令,来创建数据库表。
打开命令行,使用命令行创建。
依次输入如下命令。参考链接:cmd命令行导入.sql文件_老丹丘的博客-CSDN博客_命令行导入sql文件
net start mysql
mysql -u root -p
use lin-cms
source E:/MyStudy/myProject/frontendStudy/lin-cms-koa/shema.sql;
创建完成之后,刷新数据库,即可看到初始化的表格
(6)运行项目
node index.js
看到如下代表运行成功。
在浏览器输入localhost:5000,即可看到如下页面。代表后端项目运行成功
3.前后端联调
注意:运行过程中前后端的两个命令行窗口都不要关闭
进入刚才的前端网址,点击登录按钮之后,页面跳转到首页,表示前后端都正常运行了。
三、需求分析
使用【林间有风】框架,实现图片右侧:内容管理和最新期刊功能
本项目是后台管理,其前台项目在线地址:
后台管理项目主要是管理期刊信息。
下一节,我们将从Koa框架开始,学习如何实现后台新建期刊。