保姆级别的一个基于spring boot开发的前后端分离商城教程

最新推荐文章于 2023-08-01 21:22:51 发布
最新推荐文章于 2023-08-01 21:22:51 发布
阅读量183 收藏
点赞数
文章标签： java 开发语言 jvm 面试 spring
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/shy111111111/article/details/130619947
版权

前言

推荐一个基于spring boot开发前后端分离商城，有完整的代码笔记和视频教程，希望对正在找项目练手的同学有所帮助。

1、项目背景

5中常见的电商模式 ==B2B== 、==B2C==、==C2B==、==C2C==、==O2O== ;

  • B2B 模式 Business to Business, 是指商家与商家建立的商业关系， 如：阿里巴巴
  • B2C 模式 ==(图灵商城模式)*== Business to Consumer ， 商家直接把商品卖给用户（个人），既“商对客”模式，也就是场所的商业零售，直接面向消费 者销售产品和服务。如：苏宁易购、京东
  • C2B 模式 Consumer to Business ， 消费者对企业，现有消费者需求产生而后有企业生产
  • C2C 模式 Consumer to Consumer ,客户销售给客户， 如：咸鱼、淘宝
  • O2O 模式 Online To Offline, 线上销售、线下服务。如：饿了么，淘淘票

2、图灵商城架构图

  • 前后端分离 基础版

微服务形成之前的架构形态

前后端分离 ，基于vue的后台管理系统

为什么要使用前后端分离架构：

1.为了后续能够平顺、无障碍进入高级架构师中《微服务三高》架构版。

2.企业中当开发一个新项目时不会一上来就考虑三高、微服务..等特性，一般为了规避成本 风险，会使用开发成本较低，但是后续好扩展好改造的架构

微服务三高架构版

3、前置知识

  • 熟悉springboot及常用第三方框架整合
  • 熟悉SSM 框架使用
  • 熟悉Mysql数据库
  • 熟悉maven、 redis
  • 了解html、css、js
  • 熟练使用idea

4、结构介绍

后端项目

项目演示

专门为前端提供rest接口

后台项目演示：http://localhost:8081/

使用技术

数据库表概览

项目目前有71张数据表，业务逻辑有一定复杂度，当然我们在开发中不一定会全用到， 这里所有的表是我们整个图灵商 城的完整版

数据库表前缀说明

  • cms_*：内容管理模块相关表（暂不关心）
  • oms_*：订单管理模块相关表
  • pms_*：商品模块相关表
  • sms_*：营销模块相关表（暂不关心）
  • ums_*：会员模块相关表

搭建

后端开发环境、工具

a. 环境：jdk1.8 maven3.6+ 、 mysql 、 redis

b. 工具：idea2019（mybatis插件、 lombok插件、translation插件）、 Postman 、Navicat、RedisStudio（github） redisdesktop

i. 实在不会提供2份文档给你：

  1. mall在Linux环境下的部署（基于Docker容 器）.note
  2. mall在windows环境下运行.note

提供后端脚手架

a. 基于SpringBoot+MyBatis-Plus的快速开发脚手架，拥有完整的权限管理功能， 可对接Vue前端，开箱即用。

i. 项目结构

导入提供的脚手架

执行sql脚本：执行sql/tiny.sql

  • 修改本地的数据库 配置信息和 redis配置信息
  • 运行Main方法

后台前端项目

项目演示

后台项目演示：http://localhost:8090/#/login

核心功能：

商品模块

  • 商品管理
  • 商品分类管理
  • 商品类型管理
  • 品牌管理

订单模块

  • 订单管理

使用技术

技术选型

项目布局

src ‐‐ 源码目录
├── api ‐‐ axios网络请求定义
├── assets ‐‐ 静态图片资源文件
├── components ‐‐ 通用组件封装
├── icons ‐‐ svg矢量图片文件
├── router ‐‐ vue‐router路由配置
├── store ‐‐ vuex的状态管理
├── styles ‐‐ 全局css样式
├── utils ‐‐ 工具类
└── views ‐‐ 前端页面
├── home ‐‐ 首页
├── layout ‐‐ 通用页面加载框架
├── login ‐‐ 登录页
├── oms ‐‐ 订单模块页面
├── pms ‐‐ 商品模块页面
└── sms ‐‐ 营销模块页面

搭建：

环境工具：

  • 安装vscode
  • 安装vscode插件
  • 解压前端开源项目：mall-admin-web-master-前端.zip
  • 在VSCode中选择“文件”--->“打开 文件夹” 选择解压后的项目所在目录
  • 安装nodejs (因为要用npm功能）
  • 该项目为前后端分离项目，访问本地访问接口需搭建后台环境。(已完成http://localhost:8099/)
  • 在VsCode终端窗口中运行命令：npm install,下载相关依赖;

运行项目之前需要将config/dev.env.js文件中的BASE_API改为http://localhost:你的后端项目的端口/

在VsCode终端窗口中运行命令：npm run dev,运行项目;

访问地址：http://localhost:8090 即可打开后台管理系统页面;

前台前端项目

项目演示：http://localhost:8081/

使用技术

完整视频教程

篇幅所限就先写到这里吧，后续的一些开发笔记太长了

需要的同学可以点赞支持一下。
骑着猪追马的程序员
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
保姆级的一个基于spring boot开发的前后端分离商城教程
程序媛小琬的博客
04-22 1189
前言 推荐一个基于spring boot开发前后端分离商城，有完整的代码笔记和视频教程，希望对正在找项目练手的同学有所帮助 一.项目背景 5中常见的电商模式 B2B 、B2C、C2B、C2C、O2O ; B2B 模式 Business to Business, 是指商家与商家建立的商业关系， 如：阿里巴巴 B2C 模式 (图灵商城模式)* Business to Consumer ， 商家直接把商品卖给用户（个人），既“商对客”模式，也就是场所的商业零售，直接面向消费 者销售产品和服务。如：苏宁易购、
macrozheng-mall-admin-web-master_java_web后台_管理后_
10-01
mall-admin-web是一个电商后台管理系统的前端项目，基于Vue+Element实现。 主要包括商品管理、订单管理、会员管理、促销管理
github打开前端样式丢失_介绍一款热门开源电商后台管理系统的Vue前端项目
weixin_39715187的博客
10-21 331
简介mall-admin-web是一个电商后台管理系统的前端项目，基于Vue+Element实现。 主要包括商品管理、订单管理、会员管理、促销管理、运营管理、内容管理、统计报表、财务管理、权限管理、设置等功能。github 地址：https://github.com/macrozheng/mall-admin-webgithub star: 4.7K+最新版本：1.0.0，Apache Licen...
基于Java+SpringBoot+Vue前后端分离电商项目【小米商城】
luckypian
08-01 1744
基于Java+SpringBoot+Vue前后端分离电商项目
mall-admin-web-master.zip
01-26
后台项目
Spring Boot 3 + Vue 3前后端分离保姆级学习型新闻项目
07-12
一套基于时下最新 Java 技术栈 Spring Boot 3 + Vue 3 开发的前后端分离学习型新闻项目，配备保姆级项目开发教程手把手教你从零开始开发上线一个生产级别的 Java 系统。由新闻门户系统、作者后台管理系统、平台后台...
novel 是一套基于时下最新 Java 技术栈 Spring Boot 3 + Vue 3 开发的前后端分离学习型小说项目
最新发布
06-13
novel 是一套基于时下最新 Java 技术栈 Spring Boot 3 + Vue 3 开发的前后端分离学习型小说项目，配备保姆级教程手把手教你从零开始开发上线一套生产级别的 Java 系统，由小说门户系统、作家后台管理系统、平台后台...
novel 是一套基于 Java 技术栈 Spring Boot 3 + Vue 3 开发的前后端分离学习型小说项目
05-29
novel 是一套基于时下最新 Java 技术栈 Spring Boot 3 + Vue 3 开发的前后端分离学习型小说项目，配备保姆级教程手把手教你从零开始开发上线一套生产级别的 Java 系统，由小说门户系统、作家后台管理系统、平台后台...
前后端分离的购物商城项目
04-26
基于 Spring Boot，前后端分离的一个购物商城项目 【项目施工中...欢迎 star】 后台截图 首页 本地开发运行部署 环境准备： nodejs、npm、idea、mysql 下载 zip 直接解压或安装 git 后执行克隆命令 git@github.com:imfing/handgo.git 其他系统 在 MySQL 中创建数据库 handgo 导入项目至 IDEA，将工程中的 handgo.sql导入 MySQL 运行各个系统 后台管理系统 进入后台管理系统目录在命令行中输入 npm run dev 运行。地址为:http://localhost:8080 开发进度 系统 模块名称 地址 开发状态 前台首页系统 handgo-front http://localhost:8889 60% 后台超级管理员系统 handgo-admin http://localhost:8888 30% 个人中心系统 handgo-home http://localhost:8893 10% 单点登录系统 handgo-sso http://localhost:8892
mall商城之前端服务打包-5
贾文超的博客
04-11 593
mall商城
vue项目实战
小蜗牛的博客
03-01 422
node连接服务器 【全栈初体验】Vue+Node+MySQL实现前后端分离开发_艾欢欢的博客-CSDN博客 node项目 1.猫眼电影移动端 在博客‘前端学习三’中项目入门的基础上进行 1.首先上图是测试了跳转，现在正式开发：要展示的是电影列表，这个列表对于正在上映和即将上映都需要，只是请求的数据/调用的接口不同，因此将其设置为一个组件 1.在components中新建一个moviesDetail.vue:其展示的内容是每次点击最上面的正在热映/即将上映触发一个请求进行返回的.
基于Java+SpringBoot+Vue前后端分离商城系统设计与实现
qq_57756904的博客
01-21 5284
作为电子商务最瞩目的商业模式之一，B2C 电子商务近年来的发展尤其迅速，预计到 2018 年世界B2C电子商务交易额将达到2.356万亿美元，如图1.2所示。这一数字也比2012年翻了一倍还多，清晰地表明B2C电子商务在电子商务领域占的比重与整体的发展速度是十分惊人的。
mall-admin web前端分析
weixin_42955958的博客
05-25 1057
登录模块 views>login>index.vue <template> <div> <el-card class="login-form-layout"> <el-form autoComplete="on" :model="loginForm" :rules="loginRules" ref="loginForm"
基于springBoot + vue 实现的前后端分离商城项目
林夕
12-30 2760
7：个人中心可以模拟充值支付效果。8：商品分类管理效果图如下。10：订单管理效果图如下。11：收获地址效果图如下。二：后台主要效果图如下。6：日志管理效果图如下。9：商品管理效果图如下。8：收获地址效果图如下。7：轮播图效果图如下。
【手摸手，带你搭建前后端分离商城系统】01 搭建基本代码框架、生成一个基本API...
Marc1999的博客
10-14 268
【手摸手，带你搭建前后端分离商城系统】01 搭建基本代码框架、生成一个基本API 通过本教程的学习，将带你从零搭建一个商城系统。 当然，这个商城涵盖了很多流行的知识点和技术核心 我可以学习到什么？ SpringBoot 鉴权与认证、token、有关权限的相关的内容。 优雅的利用OSS 上传文件 API 在线生成文档 Redis Redis 基本使用 Redis 缓存存放用户to...
基于Springboot+MybatisPlus+Vue的前后端分离电子商城系统
06-09 918
基于Springboot+MybatisPlus+Vue的前后端分离电子商城系统
基于SpringBoot的前后端分离商城系统
xmt1139057136的专栏
04-18 5001
编辑：业余草来源：https://www.xttblog.com/?p=4973前面分享了一个基于 Python 的电商系统，很多人私信我说，有没有基于 Java 的？所以，我结合前面的...
基于python开发bbs论坛的保姆级教程
05-22
要开发一个BBS论坛，你需要掌握以下技能： 1. Python编程语言 2. Web框架(Flask、Django等) 3. 前端技术(HTML、CSS、JavaScript等) 4. 数据库(MySQL、PostgreSQL、MongoDB等) 下面是一个保姆级的教程，帮助你快速入门开发BBS论坛： 1. 创建虚拟环境 在终端中输入以下命令来创建一个虚拟环境： ```python python -m venv venv ``` 2. 激活虚拟环境 ```python source venv/bin/activate ``` 3. 安装Flask ```python pip install flask ``` 4. 创建Flask应用程序 在项目的根目录下创建一个名为app.py的文件，并添加以下代码： ```python from flask import Flask app = Flask(__name__) @app.route('/') def index(): return 'Hello World!' if __name__ == '__main__': app.run() ``` 5. 运行Flask应用程序 在终端中运行以下命令： ```python export FLASK_APP=app.py flask run ``` 6. 创建数据库模型 安装SQLAlchemy，它是Python中最流行的ORM库之一。在终端中运行以下命令来安装它： ```python pip install sqlalchemy ``` 接下来，在app.py文件中添加以下代码： ```python from flask_sqlalchemy import SQLAlchemy app = Flask(__name__) app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:////tmp/test.db' app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False db = SQLAlchemy(app) class User(db.Model): id = db.Column(db.Integer, primary_key=True) username = db.Column(db.String(80), unique=True, nullable=False) email = db.Column(db.String(120), unique=True, nullable=False) def __repr__(self): return '<User %r>' % self.username ``` 上面的代码定义了一个User模型，它有一个id、一个username和一个email字段。 7. 创建数据库 在终端中运行以下命令来创建数据库： ```python flask db init flask db migrate -m "create user table" flask db upgrade ``` 8. 创建注册页面 在app.py文件中添加以下代码： ```python @app.route('/register', methods=['GET', 'POST']) def register(): if request.method == 'POST': username = request.form['username'] email = request.form['email'] user = User(username=username, email=email) db.session.add(user) db.session.commit() return redirect(url_for('index')) return ''' <form method="post"> <p>Username: <input type="text" name="username"></p> <p>Email: <input type="email" name="email"></p> <p><input type="submit" value="Register"></p> </form> ''' ``` 上面的代码定义了一个/register路由，它允许用户注册。当用户提交表单时，它将创建一个新的User对象并将其添加到数据库中。 9. 创建登录页面 在app.py文件中添加以下代码： ```python @app.route('/login', methods=['GET', 'POST']) def login(): if request.method == 'POST': username = request.form['username'] password = request.form['password'] user = User.query.filter_by(username=username).first() if user and user.password == password: session['user_id'] = user.id return redirect(url_for('index')) else: flash('Invalid username or password') return ''' <form method="post"> <p>Username: <input type="text" name="username"></p> <p>Password: <input type="password" name="password"></p> <p><input type="submit" value="Login"></p> </form> ''' ``` 上面的代码定义了一个/login路由，它允许用户登录。当用户提交表单时，它将检查用户名和密码是否匹配。 10. 创建论坛页面 在app.py文件中添加以下代码： ```python @app.route('/forum') def forum(): return render_template('forum.html') ``` 上面的代码定义了一个/forum路由，它将渲染一个名为forum.html的模板文件。 11. 创建论坛模板 在项目的根目录下创建一个名为templates的文件夹，并在其中创建一个名为forum.html的文件。在forum.html文件中添加以下代码： ```html <!doctype html> <html> <head> <title>Forum</title> </head> <body> <h1>Forum</h1> {% for post in posts %} <h3>{{ post.title }}</h3> <p>{{ post.content }}</p> {% endfor %} </body> </html> ``` 上面的代码定义了一个简单的模板文件，它将渲染名为posts的变量。 12. 运行应用程序 在终端中运行以下命令： ```python flask run ``` 现在你可以在浏览器中访问你的BBS论坛了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值