基于Vue+Vuex+Vue-Router+axios+mint-ui的移动端电商项目
第一步：安装Node
1、打开NodeJS的官网，下载和自己系统相配的NodeJS的安装程序，包括32位还是64位一定要选择好，否则会出现安装问题。
下载地址：https://nodejs.org/en/download/
我选择的是Window版本64位的安装程序，也有MAC平台的安装程序。
下载完成，如图:
2、接下来就是安装了，安装很简单，直接下一步下一步就可以，但是我也把流程记录下来，给第一次看本教程的人有一个大概的了解。
双击安装文件，如图：
3、点击下一步，选择同意协议，否则无法继续安装。如图：
4、这一步选择安装的目录，可以使用默认目录【C:\Program Files\nodejs\】，也可以根据需要改变目录，我选择安装在D盘：
6、最后一步就是安装和完成了。如图：
完成效果：
安装完成后，在cmd窗口下执行 node -v 命令，看到版本信息，则说明安装成功：
参考链接：https://www.cnblogs.com/zhouyu2017/p/6485265.html
第二步：配置淘宝npm镜像
由于需要通过npm下载各种模块，默认npm是从国处服务器下载，对于网络条件一般的用户可能很难下载成功，所以需要配置成淘宝的镜像。
打开命令行，输入：npm config set registry https://registry.npm.taobao.org
以后下载模块会自动从淘宝地址进行下载。
第三步：安装webpack
打开命令行，输入npm install webpack -g。安装完成后输入webpack -v，如果显示版本号，则说明安装成功。
第四步：安装vue-cli
打开命令行，输入npm install vue-cli -g。安装完成后输入vue -V查看版本事情，现在应该是三点几的版本了，不过我的项目是用的2.9.6版本。
第五步：通过vue-cli初始化项目
打开命令行，进入指定的目录，输入vue init webpack 项目名，确认创建项目后，后续还需输入一下项目名称、项目描述、作者、打包方式、是否使用ESLint规范代码等等，详见上图。安装顺利执行后会，生成如下文件目录。
如果不是很习惯ESLint规范代码，建议新手选择No，如果你的编辑器安装了ESLint插件，但你的代码写的又不规范，所以会一直报错，尽管不影响项目的运行，但还是会一直出现讨厌的红色。
前面简单的介绍了怎么搭建Vue项目以及Node环境，下面切入正题：
先说一下三零九在线药品销售系统 前台的项目配置信息，跟上图所示的其实也差不多吧，只是文件夹下的没再依次展示了。
|-- build // 项目构建(webpack)相关代码
| |-- build.js // 生产环境构建代码
| |-- check-version.js // 检查node、npm等版本
| |-- utils.js // 构建工具相关
| |-- webpack.base.conf.js // webpack基础配置
| |-- webpack.dev.conf.js // webpack开发环境配置
| |-- webpack.prod.conf.js // webpack生产环境配置
|-- config // 项目开发环境配置
| |-- dev.env.js // 开发环境变量
| |-- index.js // 项目一些配置变量
| |-- prod.env.js // 生产环境变量
|-- src // 源码目录
| |-- assets // 图片样式文件
| |-- components // vue公共组件
| |-- pages // 页面 (里面有很多页面，就不依次详细展开了)
| |-- router // 路由文件
| |-- store // vuex的状态管理
| |-- util // 公共js文件
| |-- App.vue // 页面入口文件
| |-- main.js // 程序入口文件，加载各种公共组件
|-- static // 静态文件，比如一些图片，json数据等
|-- .babelrc // ES6语法编译配置
|-- .editorconfig // 定义代码格式
|-- .gitignore // git上传需要忽略的文件格式
|-- README.md // 项目说明
|-- favicon.ico // logo图标
|-- index.html // 入口页面
|-- package.json // 项目基本信息
他主要用到的技术有（Vue+Vuex+Vue-router+Axios+Mint-ui+Element-ui+Webpack）等等。
还是先看一下Mobile端的演示效果吧：
只列出了部分功能，像九九包邮，健康资讯，当季必备，关于我们等等没有列出来。像购物车动画，同步刷新购物车中商品数量，以及实时刷新个人中心各个订单状态的数量。其中弹出框主要是用的Mint-ui中的Message和饿了么组件的MessqgeBox和alert框。
入口文件main.js部分代码：
其中基于ES6中的Promise的HTTP库的Axios，关于它的响应拦截请求,以及各种请求方法 请 查看它的官方社区Api中文文档，地址如下：https://www.kancloud.cn/yunye/axios/234845
再来看一下三零九在线药品销售系统 后台的项目配置信息，其实跟前台的目录结构差不多，毕竟都是用Vue-cli脚手架生成的。
后台管理系统主要用到Vue+Vuex+Vue-router+AxiosElement-ui+Webpack技术等等。
|-- build // 项目构建(webpack)相关代码
| |-- build.js // 生产环境构建代码
| |-- check-version.js // 检查node、npm等版本
| |-- utils.js // 构建工具相关
| |-- webpack.base.conf.js // webpack基础配置
| |-- webpack.dev.conf.js // webpack开发环境配置
| |-- webpack.prod.conf.js // webpack生产环境配置
|-- config // 项目开发环境配置
| |-- dev.env.js // 开发环境变量
| |-- index.js // 项目一些配置变量
| |-- prod.env.js // 生产环境变量
|-- src // 源码目录
| |-- assets // 图片样式文件
| |-- components // vue公共组件
| |-- pages // 页面 (里面有很多页面，就不依次详细展开了)
| |-- router // 路由文件
| |-- store // vuex的状态管理
| |-- util // 公共js文件
| |-- App.vue // 页面入口文件
| |-- main.js // 程序入口文件，加载各种公共组件
|-- static // 静态文件，比如一些图片，json数据等
|-- .babelrc // ES6语法编译配置
|-- .editorconfig // 定义代码格式
|-- .gitignore // git上传需要忽略的文件格式
|-- README.md // 项目说明
|-- favicon.ico // logo图标
|-- index.html // 入口页面
|-- package.json // 项目基本信息
前后台 都有用到 缓解首屏加载时间过长的一个 过度 页面（可以这么说吧，其实就是怕一次性加载的数据过大导致白屏时间太长），效果如下：
只是在index.html根页面下加了如下代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>三零九笙尘药膳坊后台管理系统</title>
<link rel="shortcut icon" type="image/x-icon" href="static/icon.jfif">
<style>
html,
body,
#app {
height: 100%;
margin: 0px;
padding: 0px;
}
.chromeframe {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
}
#loader-wrapper {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 999999;
}
#loader {
display: block;
position: relative;
left: 50%;
top: 50%;
width: 150px;
height: 150px;
margin: -75px 0 0 -75px;
border-radius: 50%;
border: 3px solid transparent;
/* COLOR 1 */
border-top-color: #FFF;
-webkit-animation: spin 2s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
-ms-animation: spin 2s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
-moz-animation: spin 2s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
-o-animation: spin 2s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
animation: spin 2s linear infinite;
/* Chrome, Firefox 16+, IE 10+, Opera */
z-index: 1001;
}
#loader:before {
content: "";
position: absolute;
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
border-radius: 50%;
border: 3px solid transparent;
/* COLOR 2 */
border-top-color: #FFF;
-webkit-animation: spin 3s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
-moz-animation: spin 3s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
-o-animation: spin 3s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
-ms-animation: spin 3s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
animation: spin 3s linear infinite;
/* Chrome, Firefox 16+, IE 10+, Opera */
}
#loader:after {
content: "";
position: absolute;
top: 15px;
left: 15px;
right: 15px;
bottom: 15px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: #FFF;
/* COLOR 3 */
-moz-animation: spin 1.5s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
-o-animation: spin 1.5s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
-ms-animation: spin 1.5s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
-webkit-animation: spin 1.5s linear infinite;
/* Chrome, Opera 15+, Safari 5+ */
animation: spin 1.5s linear infinite;
/* Chrome, Firefox 16+, IE 10+, Opera */
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: rotate(0deg);
/* IE 9 */
transform: rotate(0deg);
/* Firefox 16+, IE 10+, Opera */
}
100% {
-webkit-transform: rotate(360deg);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: rotate(360deg);
/* IE 9 */
transform: rotate(360deg);
/* Firefox 16+, IE 10+, Opera */
}
}
@keyframes spin {
0% {
-webkit-transform: rotate(0deg);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: rotate(0deg);
/* IE 9 */
transform: rotate(0deg);
/* Firefox 16+, IE 10+, Opera */
}
100% {
-webkit-transform: rotate(360deg);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: rotate(360deg);
/* IE 9 */
transform: rotate(360deg);
/* Firefox 16+, IE 10+, Opera */
}
}
#loader-wrapper .loader-section {
position: fixed;
top: 0;
width: 51%;
height: 100%;
background: #7171C6;
/* Old browsers */
z-index: 1000;
-webkit-transform: translateX(0);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: translateX(0);
/* IE 9 */
transform: translateX(0);
/* Firefox 16+, IE 10+, Opera */
}
#loader-wrapper .loader-section.section-left {
left: 0;
}
#loader-wrapper .loader-section.section-right {
right: 0;
}
/* Loaded */
.loaded #loader-wrapper .loader-section.section-left {
-webkit-transform: translateX(-100%);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: translateX(-100%);
/* IE 9 */
transform: translateX(-100%);
/* Firefox 16+, IE 10+, Opera */
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
.loaded #loader-wrapper .loader-section.section-right {
-webkit-transform: translateX(100%);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: translateX(100%);
/* IE 9 */
transform: translateX(100%);
/* Firefox 16+, IE 10+, Opera */
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
.loaded #loader {
opacity: 0;
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.loaded #loader-wrapper {
visibility: hidden;
-webkit-transform: translateY(-100%);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: translateY(-100%);
/* IE 9 */
transform: translateY(-100%);
/* Firefox 16+, IE 10+, Opera */
-webkit-transition: all 0.3s 1s ease-out;
transition: all 0.3s 1s ease-out;
}
/* JavaScript Turned Off */
.no-js #loader-wrapper {
display: none;
}
.no-js h1 {
color: #222222;
}
#loader-wrapper .load_title {
font-family: 'Open Sans';
color: #FFF;
font-size: 19px;
width: 100%;
text-align: center;
z-index: 9999999999999;
position: absolute;
top: 60%;
opacity: 1;
line-height: 30px;
}
#loader-wrapper .load_title span {
font-weight: normal;
font-style: italic;
font-size: 13px;
color: #FFF;
opacity: 0.5;
}
</style>
</head>
<body>
<div id="app">
<div id="loader-wrapper">
<div id="loader"></div>
<div class="loader-section section-left"></div>
<div class="loader-section section-right"></div>
<div class="load_title">正在加载 309-admin,请耐心等待
<br>
<span>master-tzy</span>
</div>
</div>
</div>
</body>
</html>
然后看一下后台管理系统的效果图吧！！！！！！
登录页面如下：
运行Mobile端的商城和PC端的管理系统时，前提必须是先打开Node+express的本地服务器（后面会说到），不然会报以下错误：
首页效果如下：
首页布局其实也是参考了饿了么的Contain布局吧，但又不全是，所以我没有加动态的Tag标签页了，其实也可以实现吧，不过自己用的面包屑也凑合着吧，就懒得换了，当时答辩的前一天晚上，同组的Mr Yang都把代码发给我了，我也没来得及去加，因为当时要加的功能真的还有几个，比如后台没有考虑周到的大多是没有对数据进行查询，还有对订单没有进行分页，以及订单的按时间查找等等。后来肝到凌晨2点多实在不行了，所以一直没有将面包屑换掉，所以也凑合着用吧。
在这里再链接一个专门用到了饿了么组件中的Tag的动态标签页的小例子吧，虽然很简单，但还是根据自身需要来决定是否要用到Tag标签页吧。
链接地址 ：https://github.com/tzy13755126023/Vue-elementui-demo-Tag
这里用到了视图化数据的Echarts中的柱形图和折线图来展示数据，关于Echarts怎么使用这里 也不做详细介绍了吧，直接把官方Api文档地址放这里了，地址如下：https://www.echartsjs.com/api.html#echarts。请自行查看。
我只贴出关于Echarts组件的部分代码。
<template>
<div class="ECharts1">
</div>
</template>
<script>
// 引入 ECharts 主模块
var echarts = require('echarts/lib/echarts');
// 引入柱状图
require('echarts/lib/chart/bar');
require("echarts/lib/component/dataset");
// 引入提示框和标题组件
require('echarts/lib/component/tooltip');
require('echarts/lib/component/title');
require("echarts/lib/component/legendScroll");
require("echarts/lib/component/axisPointer");
require("echarts/lib/component/markLine");
export default{
name:'Echarts1',
data(){
return{ }
},
mounted(){
var myChart = echarts.init(document.querySelector('.ECharts1'))
myChart.setOption({
title: {
text: '2018-2019年各类药物月交易额',
textStyle:{ //文字样式
color:'#000', //颜色
fontWeight:700, //粗细
fontSize:30,
// textBorderColor:'black', //文字本身的描边颜色。
textShadowColor:'rgba(255,0,0,.2)', //文字本身的阴影颜色。
// textShadowBlur :5, //文字本身的阴影长度。
// textShadowOffsetX:8, //文字本身的阴影 X 偏移。
// textShadowOffsetY:5, //文字本身的阴影 Y 偏移。
}
},
tooltip : { //提示框组件。
trigger: 'axis', //触发类型。
// 可选： 'item'数据项图形触发，主要在散点图，饼图等无类目轴的图表中使用。
// 'axis' 坐标轴触发，主要在柱状图，折线图等会使用类目轴的图表中使用。
axisPointer : { // 坐标轴指示器，坐标轴触发有效
type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'
}
},
legend: { // 图例组件
data:['中西药品','养生保健','医疗器械','计生用品','中药饮品','美容护肤'],
right:25,
top:70,
// orient:'vertica' 图例列表的布局朝向。可选：'horizontal' 'vertical'
itemWidth:30, // 图例的宽度
itemHeight:20, // 图例的高度
textStyle:{
fontSize:16
}
},
grid: { // 直角坐标系内绘图网格
top:150,
left: '3%',
right: '4.5%',
bottom: '3%',
containLabel: true
},
xAxis : [ // grid 中的 x 轴
{
type : 'category', //类目轴，适用于离散的类目数据，为该类型时必须通过 data 设置类目数据
data : [
{
value: '2018年11月',
textStyle: {
fontSize: 16,
}
},
{
value: '2018年12月',
textStyle: {
fontSize: 16,
}
},
{
value: '2019年1月',
textStyle: {
fontSize: 16,
}
},
{
value: '2019年2月',
textStyle: {
fontSize: 16,
}
},
{
value: '2019年3月',
textStyle: {
fontSize: 16,
}
},
{
value: '2019年4月',
textStyle: {
fontSize: 16,
}
},
{
value: '2019年5月',
textStyle: {
fontSize: 16,
}
},]
}
],
yAxis : [ // grid 中的 Y 轴
{
name:'单位(千元)',
// category
type : 'value',
nameTextStyle:{
fontSize: 16,
}
},
],
series : [
{
name:'中西药品',
type:'bar',
data:[260, 332, 301, 334, 390, 330, 320]
},
{
name:'养生保健',
type:'bar',
stack: '广告',
data:[120, 132, 101, 134, 90, 230, 210]
},
{
name:'医疗器械',
type:'bar',
stack: '广告',
data:[220, 182, 191, 234, 290, 330, 310]
},
{
name:'计生用品',
type:'bar',
stack: '广告',
data:[150, 232, 201, 154, 190, 330, 410],
},
{
name:'中药饮品',
type:'bar',
data:[862, 1018, 964, 1026, 1679, 1600, 1570],
markLine : {
lineStyle: {
normal: {
type: 'dashed'
}
},
data : [
[{type : 'min'}, {type : 'max'}]
]
}
},
{
name:'美容护肤',
type:'bar',
barWidth : 5,
stack: '中药饮品',
data:[620, 732, 701, 734, 1090, 1130, 1120],
markLine : {
lineStyle: {
normal: {
type: 'dashed'
}
},
data : [
[{type : 'min'}, {type : 'max'}]
]
}
},
]
});
}, }
</script>
<style scoped>
.ECharts1{
margin:2% 0;
width: 50%;
height: 600px;
float: left;
/*background-color: red;*/
}
</style>
平台用户管理效果如下：
模糊查询是当时在老师指出后临时加的。效果如下：
这里的输入框中数据发生变化，则会自动更新获取的数据，每次都会进行分页，分页有两种形式，一种是后台进行分页再传到前台，一种是后台传过来所有的数据交给前台去进行分页，这里用的是第一种，所以配合饿了么组件的Pagination，当时自己觉得写得麻烦，pagination中的total总数和分页加载的数据每次都要请求两次，所以如果用第二种方法进行分页的话，则只需请求一次就可以将数据分页展示出来了。（当时自己也没考虑这么多吧，后期可能会进行改进。）
查看待审核商家（这里说明一下，因为Mobile端没有贴申请商家入驻的图，所以这里的待审核的商家数实际上是用户提交的申请数）：
查看已审核商家（通过审核的，可以查看当前商家所有上架的商品，以及发布新的商品）：
查看唐志远大药房商家的所有上架的商品：
发布新的商品：
查看用户反馈消息（用户提交的反馈信息将在这个模块中展示）：
订单管理（二级路由，默认跳转到的是商家代发货页面，并展示当前待发货的数据）：
查看健康资讯文章（点进去可以看到详细内容）：
发布健康资讯（后台发布的健康资讯，会在Mobile端展示出来，展示给用户看）：
当季必备：
查看登录日志：
关于后台管理这块，权限方面没有做完，因为预想是后台设计两个角色，一个管理员身份，另一个则是商家的身份，虽然大同小异，但是实际上获取的菜单项却差别很大，商家则只能获取三个，第一，自身的商家信息管理，第二，该商家的订单管理，在你家买的东西肯定要你来完成发货了（如果是代理的话，当然可以不用自己发货，我们组另外一个同学Ms yong 就是做的跟代理有关的，用户即代理其实也没错，符合当下的这种微商模式），第三就是对自己店内的商品进行管理了。这里只写了admin管理员的身份，暂时没有写商家的身份，后期有时间可能会完善。
最后一个就是服务器项目了，用Node+Express+mysql搭的本地服务器。
Express是Node.js上最流行的Web开发框架，我们可以通过应用生成器工具快速创建一个应用的骨架。
先去了解node下express初始化项目骨架的知识，算了在这里写一下吧，写在这里总觉得会好一点（图片用的CSDN的，我没有自己在建项目了~~~~~）。
参考链接：http://www.expressjs.com.cn/starter/generator.html
$ npm install express-generator -g 全局安装 express-generator
在当前目录下创建一个命名为myapp的应用（express 你的项目名）
注意：这里express myapp命令默认会使用jade模板引擎，建议使用ejs模板引擎，则应将命令改为express -e myapp
然后进入到你创建的项目目录下，安装所有依赖包
启动这个应用（Windows平台）
然后在浏览器输入localhost:3000/网址就可以看到这个应用了
通过Express应用生成器创建的应用一般具有如下的目录结构
解释：
app.js 启动文件，入口文件
package.json 存储工程的信息及模块依赖，当添加依赖模块时，运行npm install，npm会检查当前目录下的package.json，并自动安装所有指定的模块
node_modules 存放package.json中安装的模块
public 存放image、css、js文件
routes 存放路由文件
views 存放视图文件，或者说是模板文件
bin 存放可执行文件
当然本项目中多了两个Floder，一个是MySQL，其中放了sql脚本，还有mysqlConfig数据库配置信息等等。
另一个是Api ，其中是关于Client和Admin的 Api接口方法。
服务器项目目录如下图所示：
部分Sql脚本如下所示：
309药膳坊-Mobile商城 项目地址：https://github.com/tzy13755126023/309-Client如果觉得还不错，请Star支持一下啦。
309药膳坊-Admin后台管理 项目地址：https://github.com/tzy13755126023/309-Admin如果觉得还不错，请Star支持一下啦。
309药膳坊-Server服务器端 项目地址：https://github.com/tzy13755126023/309-server如果觉得还不错，请Star支持一下啦。 thanks a lot。
Clone到本地后，走下面这个流程吧！！
npm install（npm网速可能比较慢，建议安装淘宝镜像cnpm install）
安装所有的包之后呢，就npm start吧，或者npm run dev 都可以，这个在package.json中的script可以自行设置。但是如果改动了config目录下的配置文件，比如进行代理跨域，或者改变运行端口，则需要重新启动项目。
在运行309药膳坊-Mobile商城 和309药膳坊-Admin后台管理 之前，记得先打开本地服务器。
数据库数据就不放出来了，如果需要数据，联系方式如下：QQ：2938526863 vx：tzy13755126023。
欢迎Star
其实当时老师给我的建议是，你太重感情了，从你的项目名字上来看，就可以看出来，其实眼界可以再高点。其实，当时我很想反驳他，但是我没有，也对，四年来确实是室友过于珍贵，可能也和自己参加的活动太少有关吧。现在想想其实也没那么珍贵吧，因为本就没有不散的宴席，每个人都是以自己为世界的中心，不强求也不奢求。学习的路还很长，希望自己一直保持这种学习的状态吧，加油，和看到这篇博文的朋友一起共勉。未来你一定会过得很好！！
基于Vue+Vuex+Vue-Router+axios+mint-ui的移动端电商项目的更多相关文章
- Vue+Django2.0 restframework打造前后端分离的生鲜电商项目（2）
1.restful api介绍 1.前后端分离的优缺点 1.为什么要用前后端分离 1.pc.app.pad多端适应 2.SPA(单页面应用)开发模式开始流行 3.前后端分离职责不清 4.开发效率问题, ...
- Vue+Django2.0 restframework打造前后端分离的生鲜电商项目（3）
1.drf前期准备 1.django-rest-framework官方文档 https://www.django-rest-framework.org/ #直接百度找到的djangorestframe ...
- Vue+Django2.0 restframework打造前后端分离的生鲜电商项目（1）
1.开发环境配置 Windows7 64位旗舰版 python3.6 node.js mysql navicat pycharm webstorm或vscode 2.项目初始化 新版的pycharm很 ...
- web前端Vue+Django rest framework 框架 生鲜电商项目实战视频教程 ☝☝☝
web前端Vue+Django rest framework 框架 生鲜电商项目实战视频教程 web前端Vue+Django rest framework 框架 生鲜电商项目实战视频教程 学习 ...
- web前端Vue+Django rest framework 框架 生鲜电商项目实战✍✍✍
web前端Vue+Django rest framework 框架 生鲜电商项目实战 整个课程都看完了,这个课程的分享可以往下看,下面有链接,之前做java开发也做了一些年头,也分享下自己看这个视频 ...
- 引爆潮流技术 Vue+Django REST framework打造生鲜电商项目
引爆潮流技术Vue+Django REST framework打造生鲜电商项目 整个课程都看完了,这个课程的分享可以往下看,下面有链接,之前做java开发也做了一些年头,也分享下自己看这个视频的感受, ...
- Vue+Django REST framework打造生鲜电商项目
1-1 课程导学 2-1 Pycharm的安装和简单使用 2-2 MySQL和Navicat的安装和使用 2-3 Windows和Linux下安装Python2和Python3 2-4 虚拟环境的安装 ...
- 手把手教你使用VUE+SpringMVC+Spring+Mybatis+Maven构建属于你自己的电商系统之vue后台前端框架搭建——猿实战01
猿实战是一个原创系列文章,通过实战的方式,采用前后端分离的技术结合SpringMVC Spring Mybatis,手把手教你撸一个完整的电商系统,跟着教程走下来,变身猿人找到工作不是 ...
- vue大型电商项目尚品汇（前台篇）day02
现在正式回归,开始好好做项目了,正好这一个项目也开始慢慢的开始起色了,前面的准备工作都做的差不多了. 而且我现在也开始慢慢了解到了一些项目才开始需要的一些什么东西了,vuex.router这些都是必备 ...
随机推荐
- PHP5.6.6上运行 ecshop 2.7.3常见问题处理
ecshop在在PHP5.6.6版本以后,有了很多细微的变化.而ECSHOP官方更新又太慢,发现这些问题后也不及时升级,导致用户安装使用过程中错误百出. 整理一下我遇到的问题希望对你们能有些帮组也为了 ...
- 论文笔记：（2019）LDGCNN : Linked Dynamic Graph CNN-Learning on PointCloud via Linking Hierarchical Features
目录 摘要 一.引言 A．基于视图的方法 B．基于体素的方法 C．基于几何的方法 二.材料 三.方法 A．问题陈述 B．图生成 C．图特征提取 D．变换不变函数 E．LDGCNN架构 F．冻结特征提取 ...
- 自学linux——9.Linux的权限概述
Linux的权限概述 一. 权限概述 1.权限介绍 在多用户(可以不同时)计算机系统的管理中,权限是指某个特定的用户具有特定的系统资源使用权力,像是文件夹.特定系统指令的使用或存储量的限制 ...
- XMAPP搭建DVWA靶机
1 环境搭建 XMAPP+DVWA (我在win10下搭的环境) 更改了xmapp中Apache的两个端口号: dvwa/config中密钥和端口号按自己情况填好: dvwa/config中文件改为 ...
- BUUCTF[强网杯 2019]随便注(堆叠注入)
记一道堆叠注入的题.也是刷BUU的第一道题. ?inject=1' 报错 ?inject=1'--+ //正常 存在注入的.正常查询字段数,字段数为2.在联合查询的时候给了新提示 ?inject=0' ...
- 干了快3年Android了，感觉自己的职业生涯已经快凉了
背景 首先我是个菜鸡,工资也低的一笔. 刚毕业时候在一家国企上班干 app 开发,干了快两年的时候,跳槽到了一家伪大厂干安全.投了不少简历都没有回音,只有这加伪大厂要我就来了.当时说好了会接触一些底层 ...
- 获取元素在页面中位置 getBoundingClientRect()
DOM 原生方法getBoundingClientRect()获取元素相对视口位置 DOMRect 对象包含了一组用于描述边框的只读属性--left.top.right和bottom,单位为像素.除了 ...
- 建立局域网内使用的CentOS7-OpenStack源
by 无若 1. 先建立局域网内使用的CentOS7源 这个参看 http://www.cnblogs.com/gleaners/p/5735472.html 2. 抓取所有OpenStack的包,文 ...
- MySQL-07-information_schema/show
information_schema.tables视图 DESC information_schema.TABLES /** TABLE_SCHEMA ---->库名 TABLE_NAME -- ...
- Redis如何实现分布式锁
今天我们来聊一聊分布式锁的那些事. 相信大家对锁已经不陌生了,我们在多线程环境中,如果需要对同一个资源进行操作,为了避免数据不一致,我们需要在操作共享资源之前进行加锁操作.在计算机科学中,锁(lock ...