天是刘小爱自学Java第140天。

感谢你的观看，谢谢你。

学习计划安排如下：

• 了解传统项目与互联网项目的不同之处。
• 电商项目的特点与任务。
• 项目分为后台管理系统和前台门户系统，每个系统都是前后端分离，分为前端页面和后台微服务，我们先学后台管理系统。
• 今天是后台管理系统的前端页面搭建，明天是后台管理系统的微服务搭建。

一、刘小爱商城

Java项目基本都是web项目，其中具体又被分为传统项目和互联网项目。

1传统项目

像OA办公系统就是典型的传统项目：

其典型的特点就是：企业内部员工才能用，并不对外开放。

正是因为如此，所以更看重的是业务本身，至于网站性能什么的不是太看重。

毕竟一共也就那么些人用，也不会出现高并发的情况，对技术本身要求不高。

2互联网项目

像门户网站，电商网站就是互联网项目。

其最大的特点就是对外开放，比如说淘宝，所有人都可以使用，都可以注册。

正是因为如此，所以对网站的性能要求是比较高的，要知道现在淘宝用户可是有几亿，一旦性能不好，用户体验是很差的。

并且涉及用户太多，会有高并发的问题。

双十一为何这么的牛？

那天凌晨0点可能1秒钟之内就有几百万上千万用户使用淘宝下订单。

就算是机器，它也会吃不消的，服务器会崩溃，而阿里巴巴能顶住这个压力或多或少技术还是很厉害了。

也正是得益于电商行业的高强度并发压力，促使了阿里巴巴这些行业巨头们的技术进步。

3刘小爱商城

我们要做的项目就叫它刘小爱商城。

整个刘小爱商城从用户角度来看，可以分为两部分：后台管理系统、前台门户系统。

前台门户系统就是像淘宝这样的网站，用户可以直接注册使用的，我们先不学。

我们先学后台管理系统，它是网站的管理者用来管理网站的，前端页面如下图：

后台管理系统主要包含以下功能：

• 商品管理，包括商品分类、品牌、商品规格等信息的管理。
• 销售管理，包括订单统计、订单退款处理、促销活动生成等。
• 用户管理，包括用户控制、冻结、解锁等。
• 权限管理，整个网站的权限控制，采用JWT鉴权方案，对用户及API进行权限控制。
• 统计，各种数据的统计分析展示。
• ……等等

其又分为前端页面和后台微服务。

二、管理系统前端页面

整个管理系统会使用Vue.js框架搭建出单页应用（SPA），也就是刚学的组件化开发。

这边我们就不从0到1去编写前端代码了，直接使用项目提供的前端资源导入即可：

运行命令：npm run dev

输入该命令就能得到一个访问地址，当然也可以自行在对应代码中设置。

点击该路径就能直接跳转到刘小爱商城后台管理界面了。

如果要我们自己来写估计也要个几天时间，花这个时间不值得，直接用项目中提供的资源。

但是我们也要看得懂，不然的话连测试都没法测试，毕竟后台响应的数据需要我们自己渲染到对应的页面中。

关于前端页面的代码，做一个简单的了解：

emm，这个涉及到的知识点就有点多，并且还有一些文件的作用我没有说明。

其中做一个了解即可，事实上大多数我们明白它的英文意思了，也就知道它的作用了。

三、Vuetify框架

Vuetify是一个基于Vue的UI框架，可以利用预定义的页面组件快速构建页面。

就有点类似于学过的BootStrap框架。

为什么要用这个框架呢？

我们刚学的Vue框架，它虽然会帮我们进行视图的渲染，但是样式是由我们自己来完成。

这显然不是我们的强项，因此后端开发人员一般都喜欢使用一些现成的UI组件，拿来即用。

那怎么用呢？

具体就是我们需要一个什么类型的组件，就可以去这里面找到对应的，再将其提供的代码模板复制到对应的地方即可。

以上就是对vuetify框架的初步介绍，以后用到什么组件，就来查询即可。

照理说前端页面是由专门的前端人员来完成的，我们后台只搭建后台微服务就好了，毕竟现在基本都是前后端分离。

但是现在不可能说专门去找一个前端人员来陪我学习，所以还是要靠自己来搭建前端页面。

这也是为什么前面一直要学前端基础的原因。

最后

谢谢你的观看。

如果可以的话，麻烦帮忙点个赞，谢谢你。

要从零开始开发一个开源项目，这个项目的目的很简单：新人可以练手，一步一步搭建项目，把时下流行的技术整合进来，在用这些技术的特性来实现具体业务功能，而对于有经验的老鸟可以把自学的技术在项目中得以实践。

在这里插入图片描述

琢磨了挺长时间，前段时间工作比较忙、家中事情也比较多，导致最近才着手弄。

感兴趣的同学可以关注一波，项目进度可能会缓慢，但脚步绝不会停止

作为一个后端程序员，虽然平时也会做一些管理后台的页面，可那都是本着能用就行的原则，美观都是次要的。但项目要对外开源这可是门面，不美美哒多没面子，所以选一个酷炫的页面模板成了首要任务，选了10个模板出来，大伙给参谋下。

源码获取方式：关注转发之后私信回复【源码】来免费获取到这10个后台模板源码

天分享的这一款，是一款强大的管理系统模板，基于materialize css框架的管理后台模板。强大和易于定制的HTML管理系统模板。它有4个仪表板,无限的配色方案，9种独特的演示，您可以轻松地定制这个模板，根据帮助文档。

提示：下载链接在文章的尾部，需要的可直接为文章底部提取！

9种风格分别有：左侧菜单默认布局、左侧小菜单、水平菜单宽窄屏、水平菜单全屏、整体暗色风格、整体亮色风格、图标菜单样式、窄屏样式。9个模板都是支持PC端、平板电脑、手机端。响应式布局。后台的组件非常丰富、有邮箱、文章、日历、表单、用户组、购物车等。可用于做企业网站管理后台、社交网站管理后台、商城电商类管理后台。

网站的组件都是非常丰富的，至于用于怎样的行业，就看您自己了！下面我们例举几个特点：

主要特色：
1、materialize框架
2、6配色方案
3、1000+页面模板
4、300+UI组件
5、很多小部件
6、画廊的选项
7、2000+字体图标
8、很多表的例子
9、容易定制
10、大量的图表选项
11、多个文件上传
12、验证表单
13、电子商务网页
14、大日历设计

一、左侧菜单默认布局、整体暗色风格

这2款管理系统后台模板左侧布局是一样的，前一款采用的是白色风格、后一款是暗色系风格，比较护眼，一般后台都是具备切换风格的功能，也就是色系、开发的时候，可以试着将2款结合在一起用。

二、左侧小菜单、水平菜单宽窄屏

前一个采用的是左侧小菜布局，鼠标移动上去显示全部的文字及图表，后面一个采用水平的布局方式，同理，鼠标移动上去显示。我个人还是比较喜欢这种风格的，简约、配色好看！

三、剩余的4种风格

水平菜单全屏、整体亮色风格、图标菜单样式、窄屏样式，这里就不做过多的介绍了，需要的可自行下载后，观看哦！

过几天，会分享一个贼好看的博客源码，基于bootstrap4.3开发的，风格采用2020年最流行的扁平化、卡片式风格。

分享时间是七天，抓紧下载哦！

链接: https://pan.baidu.com/s/1gOZ0_1qItcRo-ouOrc4DHw 提取码: 6qfe

往期精选文章：

白嫖，免费送！4套布局物联网管理后台模板框架，基于Webstrot