开发实例：Spring Boot、MyBatis和Layui打造增删改查项目

news2024/11/14 15:19:59

目录导航

    • 1. 技术栈介绍
      • 1.1 Springboot
      • 1.2 MyBatis
      • 1.3 Layui
    • 2. 开发环境
      • 2.1 前端示例代码
      • 2.2 后端示例代码
      • 2.3 数据库建表语句
    • 3. 项目截图
    • 4. 运行截图
      • 4.1 查询界面
      • 4.2 新增界面
      • 4.3 修改界面
      • 4.4 删除界面
    • 5. 小结
    • 6. 完整代码下载

通过学习这个实例项目，我们将积累点滴技术知识和实践经验，进一步提升我们的开发能力。学习如何构建增删改查功能的完整应用，从数据库访问到前端界面的开发，涵盖了全栈开发的方方面面。此外，我们还将学会处理常见的业务逻辑和数据操作，提高编码质量和效率。通过实践，我们能够加深对软件开发流程和最佳实践的理解，培养解决问题和调试的能力。这些宝贵的经验将使我们更加自信地应对实际项目中的挑战，并在职业生涯中取得更大的成功。

1. 技术栈介绍

1.1 Springboot

Spring Boot（Spring引导）：
Spring Boot是一个简化Java应用程序开发的框架，特别是Web应用程序开发。它通过约定优于配置的方式，提供了构建独立的、生产级应用程序的简化方法。Spring Boot通过提供合理的默认设置和自动配置各种组件，消除了手动配置的需求，使开发人员更加专注于应用程序逻辑。

1.2 MyBatis

MyBatis（MyBatis）：
MyBatis是一种持久化框架，它提供了一种通过SQL查询与关系型数据库进行交互，并将结果映射到Java对象的方式。它简化了数据库访问层，减少了样板代码，并允许开发人员直接编写SQL查询。MyBatis支持各种数据库供应商，并提供了动态SQL、对象映射和事务管理等功能。

1.3 Layui

Layui（layui）：
Layui是一个流行的JavaScript库，用于构建Web界面。它提供了一套全面的UI组件和模块，包括网格布局、表单元素、弹出层等。Layui具有简洁易用的特点，可以快速构建出美观、交互友好的前端界面。

2. 开发环境

类型内容
开发语言Java
框架Spring Boot
前端Layui
JDK版本JDK1.8
数据库MySQL 5.7
数据库工具Navicat15
开发软件IntelliJ IDEA
Maven包Maven3.6.1
浏览器谷歌浏览器

2.1 前端示例代码

首页index.html代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-COMPATIBLE" content="IE=edge,chrome=1">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>增删改查项目实例</title>
    <link rel="stylesheet" type="text/css" href="layui/css/layui.css">
    <script type="text/javascript" src="layui/layui.js"></script>
    <script type="text/javascript" src="scripts/Main.js"></script>
    <style>
        .layui-form-label.layui-required:after{
            content:'*';
            color:red;
            font-weight: bold;
            position: absolute;
            top:5px;
            left:15px;
        }

        .frm {
            margin-top: 20px;
        }

        .div-hide {
            display: none;
        }
    </style>
</head>
<body>
<blockquote class="layui-elem-quote layui-text">
    <table>
        <tr>
            <td>
                <input type="text" id="p_id" placeholder="编号" autocomplete="off" class="layui-input ipt1">
            </td>
            <td width="10">&nbsp;</td>
            <td>
                <input type="text" id="p_name" placeholder="姓名" autocomplete="off" class="layui-input ipt1">
            </td>
            <td width="10">&nbsp;</td>
            <td>
                <button class="layui-btn btn-search"><i class="layui-icon">&#xe615;</i>查询</button>
                <button class="layui-btn layui-btn-normal btn-add"><i class="layui-icon">&#xe654;</i>添加</button>
                <button class="layui-btn layui-btn-warm btn-edit"><i class="layui-icon">&#xe642;</i>修改</button>
                <button class="layui-btn layui-btn-danger btn-del"><i class="layui-icon">&#xe640;</i>删除</button>
            </td>
        </tr>
    </table>
</blockquote>
<!--数据表格-->
<table id="PersonTable" class="layui-hide" lay-filter="person-table"></table>
<!--人员表单-->
<div id="box" class="div-hide">
    <form id="PersonForm" class="layui-form frm" lay-filter="person-form">
        <div class="layui-form-item">
            <label class="layui-form-label">编号</label>
            <div class="layui-input-inline">
                <input type="text" id="pid" name="id" required lay-verify="required" placeholder="编号"
                       autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">姓名</label>
            <div class="layui-input-inline">
                <input type="text" name="name" required lay-verify="required" placeholder="姓名"
                       autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">年龄</label>
            <div class="layui-input-inline">
                <input type="text" name="age" required lay-verify="required" placeholder="年龄"
                       autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">性别</label>
            <input name="sex" value="男" title="男" checked type="radio">
            <input name="sex" value="女" title="女" type="radio">
        </div>
        <div>
            <button class="layui-btn form-save layui-hide" lay-submit lay-filter="save"></button>
            <button type="reset" class="layui-btn form-reset layui-hide"></button>
        </div>
    </form>
</div>
</body>
</html>

2.2 后端示例代码

package cn.lj.yy.controller;

import cn.lj.yy.model.Person;
import cn.lj.yy.service.PersonService;
import com.alibaba.fastjson.JSONObject;
import com.github.pagehelper.Page;
import com.github.pagehelper.PageHelper;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;

import javax.servlet.http.HttpServletRequest;
import java.util.HashMap;
import java.util.Map;

@RestController
@RequestMapping(value = "Person")
public class PersonController {

    @Autowired
    private PersonService personService;

    @RequestMapping(value = "getAllPersonList", method = RequestMethod.GET, produces = "application/json;charset=UTF-8")
    public String getAllPersonList(HttpServletRequest request) {
        int pageSize = Integer.parseInt(request.getParameter("limit"));
        int pageNumber = Integer.parseInt(request.getParameter("page"));
        PageHelper.startPage(pageNumber, pageSize);

        String _id = request.getParameter("id");
        int id = 0;
        if (_id != null && !"".equals(_id)) {
            id = Integer.parseInt(_id);
        }
        String name = request.getParameter("name");

        Map params = new HashMap();
        params.put("id", id);
        params.put("name", name);

        Page<Person> data = personService.getAllPersonByPage(params);

        JSONObject jsonObject = new JSONObject();
        jsonObject.put("code", 0);
        jsonObject.put("count", data.getTotal());
        jsonObject.put("data", data);
        return jsonObject.toJSONString();
    }

    @RequestMapping(value = "addPerson", method = RequestMethod.POST, produces = "application/json;charset=UTF-8")
    public String addPerson(Person person) {
        JSONObject jsonObject = new JSONObject();
        if (personService.addPerson(person)) {
            jsonObject.put("success", true);
            jsonObject.put("message", "添加人员信息成功");
        } else {
            jsonObject.put("success", false);
            jsonObject.put("message", "添加人员信息失败");
        }
        return jsonObject.toJSONString();
    }

    @RequestMapping(value = "updatePerson", method = RequestMethod.POST, produces = "application/json;charset=UTF-8")
    public String updatePerson(Person person) {
        JSONObject jsonObject = new JSONObject();
        if (personService.updatePerson(person)) {
            jsonObject.put("success", true);
            jsonObject.put("message", "修改人员信息成功");
        } else {
            jsonObject.put("success", false);
            jsonObject.put("message", "修改人员信息失败");
        }
        return jsonObject.toJSONString();
    }

    @RequestMapping(value = "deletePerson", method = RequestMethod.POST, produces = "application/json;charset=UTF-8")
    public String deletePerson(int id) {
        JSONObject jsonObject = new JSONObject();
        if (personService.deletePerson(id)) {
            jsonObject.put("success", true);
            jsonObject.put("message", "删除人员信息成功");
        } else {
            jsonObject.put("success", false);
            jsonObject.put("message", "删除人员信息失败");
        }
        return jsonObject.toJSONString();
    }
}

2.3 数据库建表语句

建表语句：

/*
 Navicat Premium Data Transfer

 Source Server         : localhost
 Source Server Type    : MySQL
 Source Server Version : 50734
 Source Host           : localhost:3306
 Source Schema         : yy2

 Target Server Type    : MySQL
 Target Server Version : 50734
 File Encoding         : 65001

 Date: 24/05/2023 21:52:51
*/

SET NAMES utf8mb4;
SET FOREIGN_KEY_CHECKS = 0;

-- ----------------------------
-- Table structure for person
-- ----------------------------
DROP TABLE IF EXISTS `person`;
CREATE TABLE `person`  (
  `id` int(10) UNSIGNED NOT NULL AUTO_INCREMENT,
  `name` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
  `age` int(11) NULL DEFAULT NULL,
  `sex` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
  PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 8 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = COMPACT;

-- ----------------------------
-- Records of person
-- ----------------------------
INSERT INTO `person` VALUES (1, '学生1', 18, '男');
INSERT INTO `person` VALUES (2, '学生3', 18, '女');
INSERT INTO `person` VALUES (3, '学生5', 20, '男');
INSERT INTO `person` VALUES (4, '学生6', 19, '女');
INSERT INTO `person` VALUES (6, '管理员', 22, '男');
INSERT INTO `person` VALUES (7, 'Rucoding', 18, '女');

SET FOREIGN_KEY_CHECKS = 1;

在这里插入图片描述

3. 项目截图

在这里插入图片描述

4. 运行截图

4.1 查询界面

在这里插入图片描述

4.2 新增界面

在这里插入图片描述

4.3 修改界面

在这里插入图片描述

4.4 删除界面

在这里插入图片描述

5. 小结

通过Spring Boot、MyBatis和Layui实现增删改查项目实例，我们可以学到以下内容：

  1. 使用Spring Boot简化Java应用程序开发：Spring Boot提供了一种简化的开发方式，通过自动配置和默认设置，减少了繁琐的手动配置，使开发人员能更专注于业务逻辑的实现。

  2. 数据库访问与映射：使用MyBatis，可以学习如何编写SQL查询，并将查询结果映射到Java对象中。MyBatis提供了一些高级特性，如动态SQL和事务管理，可以提升数据库访问的灵活性和可靠性。

  3. 前端界面开发：通过Layui，可以学习如何使用现代化的JavaScript库构建美观、交互友好的前端界面。Layui提供了丰富的UI组件和模块，可以快速搭建出符合用户期望的界面。

整个项目实例结合了Spring Boot、MyBatis和Layui的优势，展示了一个完整的增删改查功能的实现过程。可以通过这个实例了解如何将这些技术整合在一起，提高开发效率，并构建出功能完善、易于维护的Web应用程序。

6. 完整代码下载

下载传送门

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/564660.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

[HarekazeCTF2019]baby_rop2

[HarekazeCTF2019]baby_rop2

小白垃圾笔记&#xff0c;不建议阅读。 这道题学到了两个思想吧&#xff1a; 1.一个是有的函数泄露libc打印不写出来。 2.另一个是printf函数的利用吧。 3.栈对齐好像是只有system有。 分析下题目吧&#xff1a; 64位 绕过nx 本来以为第10行&#xff0c;有坑呢。结果好像是…
阅读更多...
简单三招教你音频怎么翻译

简单三招教你音频怎么翻译

随着世界全球化的加速发展和文化交流的增多&#xff0c;音频翻译这项技术变得越来越重要。在国际商务和学术会议中&#xff0c;语言的沟通至关重要。不同国家或地区的参与者会用不同的语言进行交流&#xff0c;这时候&#xff0c;使用音频翻译就可以帮助他们更好地沟通&#xf…
阅读更多...
2023年最强测试工程师Linux面试题及答案

2023年最强测试工程师Linux面试题及答案

前言&#xff1a; 大家好&#xff0c;前段时间有很多朋友给我私信留言&#xff1a;在面试软件测试工作时&#xff0c;部分的liunx的问题答不上来&#xff0c;于是雷叔快马加鞭&#xff0c;连夜给大家整理了一份关于linux的面试题&#xff0c;请看好了。 正文&#xff1a; 1.三…
阅读更多...
算法分析基础

算法分析基础

问题&#xff1a;如何比较不同算法的性能&#xff1f; 分析算法的运行时间 算法分析的原则 归纳基本操作 如:运算、赋值、比较 统一机器性能 假设基本操作代价均为1 统一机器性能后&#xff0c;算法运行时间依赖于问题输入规模与实例 相同输入规模&#xff0c…
阅读更多...
python神经网络实现手写数字识别实验

python神经网络实现手写数字识别实验

手写数字识别实验是机器学习中最常见的一个示例&#xff0c;可以有很多种办法实现&#xff0c;最基础的其实就是利用knn算法&#xff0c;根据数字图片对应矩阵与经过训练的数字进行距离计算&#xff0c;最后这个距离最短&#xff0c;那么就认为它是哪个数字。 这里直接通过神经…
阅读更多...
项目的延伸

项目的延伸

目录 推送模块 1.表 1.1 表字段 1.2 字段类型 1.3 索引 1.4 关联查询 2.参数的含义 3.以技术流的维度讲业务逻辑 4.redis 4.1基础知识 5.设计模式 5.1策略模式 5.2工厂模式 6.遇到的问题 6.1稳定性 7.锁 即时通讯模块 1.表 1.1 表字段 1.2 字段类型 1.3 索…
阅读更多...
关于队头阻塞的一些笔记

关于队头阻塞的一些笔记

一、队头阻塞&#xff08;Head-of-Line Blocking&#xff0c;HOL&#xff09; 看到队头&#xff0c;联想到了数据结构课程中学到的队列&#xff0c;队列的一个特点就是FIFO&#xff08;First In First Out&#xff09;&#xff0c;即先进入队列的数据先出队列。所以&#xff0…
阅读更多...
【Linux高级 I/O（6）】存储映射 I/O进阶应用（附代码示例）

【Linux高级 I/O（6）】存储映射 I/O进阶应用（附代码示例）

mprotect()函数 使用系统调用 mprotect()可以更改一个现有映射区的保护要求&#xff0c;其函数原型如下所示&#xff1a; #include <sys/mman.h>int mprotect(void *addr, size_t len, int prot);参数 prot 的取值与 mmap()函数的 prot 参数的一样&#xff0c;m…
阅读更多...
Pycharm 配置jupyter notebook 且Windos 安装vim编辑器

Pycharm 配置jupyter notebook 且Windos 安装vim编辑器

请记住要想让你的python成功安装jupyter notebook &#xff0c;你的python最好使用p大于等于python3.7 最好不要在python2大版本中安装jupyternotebook 这个会报错&#xff0c;需要你改一些配置文件&#xff0c;除非你想挑战一下自己&#xff0c;不过后面我会尝试在python2大版…
阅读更多...
NeRF-VAE：将场景看作一个分布【ICML‘2021】

NeRF-VAE：将场景看作一个分布【ICML‘2021】

文章目录 GQN网络介绍Amortized InferenceNeRF-VAE GQN网络介绍 论文标题&#xff1a;Neural scene representation and rendering 作者&#xff1a;S. M. Ali Eslami, Danilo Jimenez Rezende, et al. 期刊&#xff1a;Science 发表时间&#xff1a;2018/06/15 该文章提出…
阅读更多...
单视觉L2市场「鲶鱼」来了，掀起数据反哺高阶新打法

单视觉L2市场「鲶鱼」来了，掀起数据反哺高阶新打法

作者 | 张祥威编辑 | 德新 智驾方案的降本行动仍在推进。 早年&#xff0c;单视觉L2市场的玩家以Mobileye、博世为主&#xff0c;后来国内智驾公司加入&#xff0c;共同推动 1V、1R1V、nR1V等不同的方案兴起&#xff0c;L2近乎成为车辆的必备功能。 当下&#xff0c;在行业降低…
阅读更多...
认识linux文件系统/文件夹名字解释

认识linux文件系统/文件夹名字解释

linux系统因为其高效、直接的底层操作而被很多代码开发者使用&#xff0c;谈及linux&#xff0c;大家普遍的印象就是黑乎乎的终端命令行&#xff0c;后来基于linux系统开发出来的具有可视化桌面的ubuntu版本&#xff0c;让大家的使用体验兼顾了windows系统的直观性可linux系统代…
阅读更多...
YOLOV5使用(一): docker跑通，详解TensorRT下plugin的onnx

YOLOV5使用(一): docker跑通，详解TensorRT下plugin的onnx

yolov5的工程使用(以人员检测为案例) 使用ubuntu为案例 docker run --gpus all -it -p 6007:6006 -p 8889:8888 --name my_torch -v $(pwd):/app easonbob/my_torch1-pytorch:22.03-py3-yolov5-6.0使用端口映射功能也就是说打开jupyter lab的指令是 http://localhost:8889/l…
阅读更多...
windows先的conda环境复制到linux环境

windows先的conda环境复制到linux环境

如果是迁移的环境一致&#xff1a;同是windows或同是linux直接用这个命令即可&#xff1a; conda create -n new_env_name --clone old_env_path 如果是window的环境迁移到linux这种跨环境就不能用上面的方法&#xff0c;网上这方面的资料也很多&#xff0c;记录一下我的…
阅读更多...
小蝌蚪找妈妈：Python之作用域链与 LEGB 原则

小蝌蚪找妈妈：Python之作用域链与 LEGB 原则

文章目录 参考描述作用域对象全局作用域globals() 局部作用域locals() 包含作用域内置作用域builtins 模块builtins 模块与 \_\_builtins__builtins is \_\_builtins__??? \_\_builtins__ 与内置作用域赶不走的 \_\_builtins__ 作用域链作用域链 与 LEGB 原则狗急跳墙之法 参…
阅读更多...
【Go语言从入门到实战】基础篇

【Go语言从入门到实战】基础篇

Go语言从入门到实战 — 基础篇 First Go Program 编译 & 运行 基本程序结构 应用程序入口 package mainimport "fmt"func main() {fmt.Println("Hello World") }退出返回值 package mainimport ("fmt""os" )func main() {fmt.Pr…
阅读更多...
哪个产品功能重要？KANO模型帮你

哪个产品功能重要？KANO模型帮你

哪个产品功能重要&#xff1f;KANO模型来帮你 模型工具可以协助思考和系统化改进 KANO模型是小日本一个教授提出 趣讲大白话&#xff1a;往往&#xff0c;怎么思考&#xff0c;比思考什么重要 【趣讲信息科技175期】 **************************** 东京理工大学教授狩野纪昭(No…
阅读更多...
【医学图像】图像分割系列.2 （diffusion）

【医学图像】图像分割系列.2 （diffusion）

介绍几篇使用diffusion来实现医学图像分割的论文&#xff1a;DARL&#xff08;ICLR2023&#xff09;&#xff0c;MedSegDiff&#xff08;MIDL2023&#xff09;& MedSegDiff-V2&#xff08;arXiv2023&#xff09;&#xff0c;ImgX-DiffSeg&#xff08;arXiv2023&#xff09;…
阅读更多...
CTF 2015: Search Engine-fastbin_dup_into_stack

CTF 2015: Search Engine-fastbin_dup_into_stack

参考&#xff1a; [1]https://gsgx.me/posts/9447-ctf-2015-search-engine-writeup/ [2]https://blog.csdn.net/weixin_38419913/article/details/103238963(掌握利用点&#xff0c;省略各种逆向细节) [3]https://bbs.kanxue.com/thread-267876.htm&#xff08;逆向调试详解&am…
阅读更多...
web功能测试方法大全—完整！全面！（纯干货，建议收藏哦~）

web功能测试方法大全—完整！全面！（纯干货，建议收藏哦~）

本文通过六个部分为大家梳理了web功能测试过程中&#xff0c;容易出现的遗漏的部分&#xff0c;用以发掘自己工作中的疏漏。&#xff08;纯干货&#xff0c;建议收藏哦~&#xff09; 一、输入框 1、字符型输入框 2、数值型输入框 3、日期型输入框 4、信息重复 在一些需要命…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023