跨入新世界的大门-javaweb小项目-整合web所学知识-关于CRUD的基础操作

170 阅读6分钟

这是我的第一篇掘金博客,开启掘金写作之路。

前言

  1. 这是我的第一篇博客,原本想着第一篇博客是搞个自己介绍,接下来的目标啥的,想了想还是直接上内容把,简单介绍一下,本人大一,在广州,一个二本,专业是计算机,希望可以在掘金这个网站分享自己在学习过程中的思考与对技术的理解把,我也会开始陆陆续续把我所学的内容进行一个整理,上传到我的博客中,也会对一些技术进行对比的学习,觉得写博客是一个很好的学习的方法,可以和一群人一起学,而且可以让自己学的更透,一堆笔记摆在那,去整理一下真的会有新的发现,一套视频看了看的第二遍都比第一遍更有感觉。希望大佬可以多指导我一下。

  2. 先介绍一下本次博客的内容把,如标题所见,本次博客的内容是关于web的一个案例,来源于b站中的黑马的web课程,相关资源我会放到最后,希望感兴趣的小伙伴,如果你正好在学web前后,可以拿去练练手,之所以选择web这个内容作为第一篇博客,也是因为我对这个案例的流程啥的还不是很清楚,学的话,我已经学到了boot,在接下来的几篇博客中,我都会发一些这个实战的案例,这一次是web的案例,接下来就是spring+springmvc的一个案例,再然后就是ssm整合的一个案例,最后就是boot整合ssmp的一个案例,这是接下来的这4篇,争取在4月全部完成。

  3. 接下来马上进入本次博客的干货部分啦,介绍步骤的过程中我为了方便进行代码的截图,我会把源代码及资料放在最后,由于是第一次写博客,不足的地方肯定很多,希望各位大佬指出,我会不断改进,希望一起共同进步。

项目整体概述

项目简介

项目就是利用web所有的知识完成品牌数据的增删改查操作

涉及技术

由于这次的分享重心在于案例本身,技术的详细内容在本篇中就不详细展开,只讲一下,此项目中需要使用的知识

  1. 数据库基本增删改查
  2. JDBC
  3. Maven工程
  4. Mybatis
  5. 前端HTML,CSS,JS,Ven,Element等
  6. Tomcat
  7. Servlet
  8. Request&Response
  9. JSP
  10. 会话跟踪技术
  11. Filter,;Listener,ajax,JSON
  12. MVC模式和三层架构的思想

项目分析

MVC模式和三层架构

MVC模式

  • MVC是一种分层开发的模式,其中:
  • M:Model,业务模型,处理业务
  • V:View,视图,界面展示
  • C:Controller,控制器,处理请求,调用模型和视图

image.png

三层架构

  • 数据访问层:对数据库的CRUD基本操作
  • 业务逻辑层:对业务逻辑进行封装,组合数据访问层中基本功能,形成复杂的业务逻辑功能
  • 表现层:接收请求,封装数据,调用业务逻辑层,响应数据

image.png

实现功能

  1. 查询所有
  2. 新增品牌
  3. 修改品牌
  4. 删除品牌
  5. 批量删除
  6. 分页查询
  7. 条件查询

环境准备

这里是项目开始的准备工作,资料啥的到时候我放在最后,需要的伙伴看完直接去拿就行

  • 将brand-case模块导入idea中
  • 执行资料中提供的tb_brand.sql脚本

image.png

这是一个开始前大致的一个项目目录,

分模块完成项目开发

查询所有功能

文字描述:从Dao层出发,提供一个查询所有的方法selectAll,返回一个List集合,泛型为Brand对象。在service层中,调用BrandMapper,使用BrandMapper中的selectAll方法完成查询操作。在前端页面中,页面加载完成后发送异步请求到web层,在web层中调用service进行数据的查询,将得到的List集合数据转为JSON格式,再响应JSON格式的数据到brand.html页面,将数据设置到模型上即可 image.png

步骤一:编写sql语句

注意:实体对象中的属性名称与数据库表中的名称不一致,如brandName与brand_name 所有需要使用ResultMap进行映射 image.png

image.png

image.png

image.png

步骤二:编写service层

注意

  1. 使用Mybatis中mapper代理的方式进行开发时,BrandMapper与BrandMapper.xml应配置在同一目录下
  2. 设置SQL映射文件的namespace属性为Mapper接口全限定名
  3. 查询操作,无需提交事务 image.png

image.png

image.png

image.png

image.png

步骤三:编写web/controller层

注意

  1. 由于是列表数据,其中存在中文,所有需要进行设置response的消息头
  2. @WebServlet中的路径,首字母改为小写!!!
  3. 调用service进行查询
  4. service层为什么使用代理开发,因为在web层调用service层进行数据查询时,不用对每一个内容进行new,只需修改所属类即可,到后面spring中,后面的new的内容可以直接省略,spring自动完成查询。 image.png

步骤四:编写前端页面代码

注意

  1. 使用axios之前,将axios对应的js文件引入
  2. emmmmm,前端代码,不是很熟悉呀,希望有大佬指出要点 image.png

新增品牌功能

前面4个功能基本思路差不多,我就不每一个都详细展开咯(因为我都可以自己去慢慢的写出来),相信大佬你看了第一个新增后就可以一通百通了,冲!!!

image.png

步骤一:编写sql语句

注意 其实没啥注意的,单词别写错了把你,小心哦,不然查bug很痛苦 image.png

步骤二:编写service层

注意

  1. 增加数据需要进行提交事务的操作
  2. 在BrandSercice接口中定义add()添加数据的业务逻辑方法
  3. 在BrandServiceImol中重写add()方法,实现业务逻辑 image.png

image.png

步骤三:编写web/controller层

注意

  1. 一次响应结束后,response对象就会被销毁,所有不需要手动关流

image.png

步骤四:编写前端页面代码

image.png

image.png

结尾

后续功能我在后续再进行整理把,就这2个功能,已经把我实现的够呛了,感觉自己的基础太不扎实了,好烦,整理整理这就麻了,希望大佬可以给点建议,我现在就是属于那种已经学到boot了,但把前面的web呀,spring呀,springmvc这些呀,顺口将个大概出来我都做不到,前面的se,jdbc知识也很生疏。这也是我为什么要来写博客的原因之一了,希望可以在掘金把我的java路全部给展示出来。 后面的模块我会尽快更新咯,我先把资源给大家拿出来把,这里我就只拿出这个综合案例的资料,想要全部资料的伙伴也可以留言哦!

资源

链接:pan.baidu.com/s/1Ouus8x6-… 提取码:ulrq --来自百度网盘超级会员V2的分享