SpringBoot仅会SSM强撸项目--【JSB项目实战】

简介: SpringBoot仅会SSM强撸项目--【JSB项目实战】CSDN 转过来的,所以格式与内容有些许错误请见谅

SpringBoot系列文章目录

SpringBoot知识范围-学习步骤【JSB系列之000】

@TOC


SpringBoot技术很多很多

韩顺平说:学习JAVA的人有两大难
第一困惑,JAVA能百度到的知识太多太多,完全不知道学啥
第二困惑,就是不知道以什么样的顺序去学,有的时候乱看一堆视频有遗漏,有的时候,两边的视频还有重复。
在这里插入图片描述
然后,再来看一般的springboot 的书籍中内容。
一般是这样。
在这里插入图片描述
一眼看上去直接就晕了。然后这么多东西,哪个是哪个的基础?
直接就懵了。上网查吧?
不上网还好,一上网一查,结果查到的是满天的学习完了JAVA 学到了springboot 工资不到3000。
我还能学下去?
在这里插入图片描述

面对越来越紧的时间,越来越少的知识我要怎么办

假定,你在学校做过了JAVA的小项目了。(我指的是swing,servlet 之类) 可能会点SSM,也可能不会,那我马上就要毕业了,我得搞项目,搞毕设呀。啊!!!

其实,不用急,仅有的这点技术,肯定是可以做项目的。只要你沉下心,这船就有打捞上来的可能。躺就真的沉了。

环境及工具:

本系列环境

环境 win11
工具 idea 2017
jdk 1.8
数据库 mysql5.5
maven 3.2.1
项目导入方式 maven 导入
数据库前端工具 mysql-front (navicat 也可以)

数据库前端工具:mysql-front (navicat 也可以)
主要是这些跟PHPStudy 2018 整合了,所以有的时候懒的打开navicat
关于环境的重要性,直接看上面的《SpringBoot 的项目编译即报错处理--JSB系列之001

项目里可能要用到的技术

前后端分离

这是一个好技术。前后端分离的主要概念就是:后台只需提供API接口,前端调用AJAX实现数据呈现。 现状与分歧. 作为一名前端开发人员,我们应该尝试一些新颖的技术,完善每一个细节,后端的开发人员就无脑疯狂的输出json。
在传统的web应用开发中,大多数的程序员会将浏览器作为前后端的分界线。将浏览器中为用户进行页面展示的部分称之为前端,而将运行在服务器,为前端提供业务逻辑和数据准备的所有代码统称为后端。
难不难工作量是不一定,但是,两边的难度是真的降了。
后端的只用idea community IDEA社区版(Community)版本就足够。前端高级的玩玩webStorm,不行用hbuilder,vscode 好象都能写代码。甚至还有人用editplus ++ , nodepad 之流了,这就有点过份了哈。

json

JSON(JavaScript Object Notation, JS对象简谱)是一种轻量级的数据交换格式。它基于 ECMAScript(European Computer Manufacturers Association, 欧洲计算机协会制定的js规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写。
这个东东一出来就直接把xml 的这种格式按地上摩擦了。而且可以可读性好,也把一些不可读的数据包形式也给取代了。

其它的必要知识

  • 网页三剑客,这个不用说了
  • JAVA,你总得会idea吧
  • maven 这个也是必须的

上代码

说了这么多了,还是上点正菜。

Controller代码

package com.example.demo.controller;

import com.example.demo.entity.Course;
import com.example.demo.entity.Source;
import com.example.demo.mapper.CourseAvgMapper;
import com.example.demo.mapper.GpaMapper;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import javax.annotation.Resource;
import java.util.List;

@RestController
@RequestMapping("/getCourseAvg")
@CrossOrigin
public class CourseAvgController {
   

    @Resource
    CourseAvgMapper courseAvgMapper;

    @GetMapping("/getDashujuCourse")
    public List<Course> getDashujuCourse() {
   
        List<Course> courseList = courseAvgMapper.getDashujuCourse();
        return courseList;
    }

    @GetMapping("/getJisuanjiyingyongCourse")
    public List<Course> getJisuanjiyingyongCourse() {
   
        List<Course> courseList = courseAvgMapper.getJisuanjiyingyongCourse();
        return courseList;
    }

    @GetMapping("/getRuanjiangongchengCourse")
    public List<Course> getRuanjiangongchengCourse() {
   
        List<Course> courseList = courseAvgMapper.getRuanjiangongchengCourse();
        return courseList;
    }

    @GetMapping("/getRuanjianjishuCourse")
    public List<Course> getRuanjianjishuCourse() {
   
        List<Course> courseList = courseAvgMapper.getRuanjianjishuCourse();
        return courseList;
    }
    @GetMapping("/getWangluogongchengCourse")
    public List<Course> getWangluogongchengCourse() {
   
        List<Course> courseList = courseAvgMapper.getWangluogongchengCourse();
        return courseList;
    }

    @GetMapping("/getWangluojishuCourse")
    public List<Course> getWangluojishuCourse() {
   
        List<Course> courseList = courseAvgMapper.getWangluojishuCourse();
        return courseList;
    }

    @GetMapping("/getWulianwangCourse")
    public List<Course> getWulianwangCourse() {
   
        List<Course> courseList = courseAvgMapper.getWulianwangCourse();
        return courseList;
    }

    @GetMapping("/getXinxiguanliCourse")
    public List<Course> getXinxiguanliCourse() {
   
        List<Course> courseList = courseAvgMapper.getXinxiguanliCourse();
        return courseList;
    }

}
AI 代码解读

直接mapper

先不要service, 至于为啥不用service 那你的业务怎么处理?我是感觉吧,你如果有复杂的业务,直接面条式的写在controller里。
那可能又有人问,那业务的事务怎么保证?我先问一句,你时间这么紧,能少一点就少一点,你一个人用这个系统,一个人连接数据库,其实是没有并发的?本着最简就拼出项目漂亮界面的原则。当然,正式的项目也不会这样子。
当然了,也可以用若依框架,那个也是快速的开发。而且没有这些隐患。问题就是,你得能看懂若依。

package com.example.demo.mapper;

import com.example.demo.entity.Course;
import com.example.demo.entity.Source;
import org.apache.ibatis.annotations.Select;
import org.springframework.stereotype.Component;

import java.util.List;
@Component
public interface CourseAvgMapper {
   

    @Select("select * from course where speciality_id=10112")
    List<Course> getDashujuCourse();

    @Select("select * from course where speciality_id=10201")
    List<Course> getJisuanjiyingyongCourse();//计算机应用

    @Select("select * from course where speciality_id=10108")
    List<Course> getRuanjiangongchengCourse();//软件工程

    @Select("select * from course where speciality_id=10203")
    List<Course> getRuanjianjishuCourse();//软件技术

    @Select("select * from course where speciality_id=10109")
    List<Course> getWangluogongchengCourse();//网络工程

    @Select("select * from course where speciality_id=10202")
    List<Course> getWangluojishuCourse();//网络技术

    @Select("select * from course where speciality_id=10110")
    List<Course> getWulianwangCourse();//物联网

    @Select("select * from course where speciality_id=10111")
    List<Course> getXinxiguanliCourse();//信息管理
}
AI 代码解读

实体类

这里有必要说一下idea2017并不支持lombok,需要自己导入一下,不过如果你不会的话,你完全可以自己写一下get set 反正小项目也写不了多少。idea 2017占的内存是真的少。所以还是有很多的大佬在用。在绝对的速度面前,招数就显得没有那么重要了。

 package com.example.demo.entity;

import lombok.Data;

@Data
public class Course {
   
    private String course_name;//课程名
    private String speciality_id;//专业id
    private String speciality;//专业名
    private String courseAvgScore;//课程平均分

}
AI 代码解读

跑起来

后台

数据库的部分你自己搞定吧,如果到了做毕设还不会数据库,这个还是要下点功夫了。
这么点代码+数据库就能跑起来?没错,他确实是能运行

@SpringBootApplication
@MapperScan("com.example.demo.mapper")
public class DemoApplication {
   

    public static void main(String[] args) {
   
        SpringApplication.run(DemoApplication.class, args);
    }

}
AI 代码解读

用浏览器最原始的方式验证

在浏览器上念出一段神奇的古老埃及法老的字符。

http://localhost:8001/getClassAvg/classDashujuAvg
AI 代码解读

在这里插入图片描述

客户端

直接上最复杂的图表。单表增删改查的例子,自己在我的博客里找吧。
在这里插入图片描述
完整的html代码。

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>学生成绩数据可视化系统</title>
    <link rel="stylesheet" href="css/index.css" />
    <link rel="stylesheet" href="css/center3.css" />
</head>

<body>
    <header>
        <div class="sel">
            <select class="sell">
                <option>
                    <a href="javascript:;">数据科学与大数据技术</a>
                </option>
                <option>
                    <a href="javascript:;">计算机应用技术</a>
                </option>
                <option>
                    <a href="javascript:;">软件工程</a>
                </option>
                <option>
                    <a href="javascript:;">软件技术</a>
                </option>
                <option>
                    <a href="javascript:;">网络工程</a>
                </option>
                <option>
                    <a href="javascript:;">网络技术</a>
                </option>
                <option>
                    <a href="javascript:;">物联网工程</a>
                </option>
                <option>
                    <a href="javascript:;">信息管理与信息系统</a>
                </option>
            </select>
        </div>
        <div class="title">
            <h1>高校学生成绩数据可视化系统</h1>
        </div>
        <div class="time">
            <div class="showTime"></div>
        </div>

    </header>
    <section class="main">
        <!-- column1 -->
        <div class="column">
            <div class="panel bar">
                <h2>班级平均分</h2>
                <div class="chart" id="bar1"></div>
                <div class="panel-footer"></div>
            </div>
            <div class="panel line" >
                <h2>各科平均分</h2>
                <div class="chart" id="line1"></div>
                <div class="panel-footer"></div>
            </div>
            <div class="panel pie">
                <h2>成绩分布</h2>
                <div class="chart" id="pie1"></div>
                <div class="panel-footer"></div>
            </div>
        </div>
        <!-- column2 -->
        <div class="column">
            <!-- 数字模块 -->
            <div class="no"></div>
            <!-- 地图模块 -->
            <div class="map">
                <div class="map1">
                    <!-- 旋转 -->
                    <div class="container">
                        <div class="shape" style="--n: 10;">
                            <div class="shape" style="--n: 9;">
                                <div class="shape" style="--n: 8;">
                                    <div class="shape" style="--n: 7;">
                                        <div class="shape" style="--n: 6;">
                                            <div class="shape" style="--n: 5;"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- /旋转 -->
                </div>
                <div class="map2"></div>
                <div class="map3"></div>
                <div class="chart" id="treeMap"></div>
            </div>
        </div>
        <!-- column3 -->
        <div class="column">
            <div class="panel bar2">
                <h2>绩点排名</h2>
                <div class="chart" id="bar2"></div>
                <div class="panel-footer"></div>
            </div>
            <div class="panel line2">
                <h2>学业预警</h2>
                <div class="chart" id="line2"></div>
                <div class="panel-footer"></div>
            </div>
            <div class="panel pie2">
                <h2>班级绩点</h2>
                <div class="chart" id="pie2"></div>
                <div class="panel-footer"></div>
            </div>
        </div>
    </section>

    <script type="text/javascript" src="js/flexible.js"></script>
    <script type="text/javascript" src="js/echarts.min.js"></script>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
    <script type="text/javascript" src="js/vue.min.js"></script>
    <script type="text/javascript" src="js/bar1.js"></script>
    <script type="text/javascript" src="js/bar2.js"></script>
    <script type="text/javascript" src="js/line1.js"></script>
    <script type="text/javascript" src="js/line2.js"></script>
    <script type="text/javascript" src="js/scatter.js"></script>
    <script type="text/javascript" src="js/linear.js"></script>
    <script type="text/javascript" src="js/gauge.js"></script>
    <script type="text/javascript" src="js/treemap.js"></script>

    <script type="text/javascript">
        var t = null;
        t = setTimeout(time, 1000); 
        function time() {
    
            clearTimeout(t); 
            dt = new Date();
            var y = dt.getFullYear();
            var mt = dt.getMonth() + 1;
            var day = dt.getDate();
            var h = dt.getHours(); 
            var m = dt.getMinutes(); 
            var s = dt.getSeconds();
            document.querySelector(".showTime").innerHTML = '当前时间:' + y + "年" + mt + "月" + day + "-" + h + "时" + m + "分" +
                s + "秒";
            t = setTimeout(time, 1000);    
        }
    </script>
</body>

</html>
AI 代码解读

最后的展示

用hbuilder 直接运行。
为什么这个项目可以这么随意?因为他没有token ,没有 spring security 呀,所以肯定可以直接访问后台了。有如罗大佑老师唱的“穿过你的黑发的我的手”
就是这么的随意,漂亮,任性。

在这里插入图片描述

好,一步成功点亮,关电,拉闸,领盒饭!走人。

总结

提示:IT是一个要多动手的职业,一定要多练不要贪快:
这一部涉及到的知识可以说非常之多。能花一周的时间把这篇文章里的东西弄一个大概并运行出来,也是很不容易的,而且难度也不低,准确一点说,培训机构也能让你似懂非懂的把这个代码跑起来。
做到这一步,你会了springBoot了么?会了,但是现在你会的都是初级基本上就是对付一下简单项目。传的对象复杂了,数据信息多了,都可能会出现这样那样的问题。
还有就是springboot 的缓存,JWT,消息队列,安全机制 ,任务管理其实他们从SSM甚至SSH的时候就有了。只是springboot 一下子全集成过来了。你去看别人的SSM项目 ,这些东西也都有。
所以,程序猿与学员纯在着本质的差别。那么如何提高呢?当然要多读别人的成功项目了。
GITEE上面存在着大量的springboot的项目,英文没有问题的话,可以去github。

配套资源

暂不提供
如果有需要,留言评论区吧

目录
打赏
0
0
0
0
3
分享
相关文章
SpringBoot项目打war包流程
本文介绍了将Spring Boot项目改造为WAR包并部署到外部Tomcat服务器的步骤。主要内容包括:1) 修改pom.xml中的打包方式为WAR;2) 排除Spring Boot内置的Tomcat依赖;3) 添加Servlet API依赖;4) 改造启动类以支持WAR部署;5) 打包和部署。通过这些步骤,可以轻松地将Spring Boot应用转换为适合外部Tomcat服务器的WAR包。
155 64
SpringBoot项目打war包流程
SpringBoot项目打包成war包
通过上述步骤,我们成功地将一个Spring Boot应用打包成WAR文件,并部署到外部的Tomcat服务器中。这种方式适用于需要与传统Servlet容器集成的场景。
30 8
|
2月前
基于springboot+thymeleaf+Redis仿知乎网站问答项目源码
基于springboot+thymeleaf+Redis仿知乎网站问答项目源码
161 36
基于SpringBoot+Vue实现的留守儿童爱心网站设计与实现(计算机毕设项目实战+源码+文档)
博主是一位全网粉丝超过100万的CSDN特邀作者、博客专家,专注于Java、Python、PHP等技术领域。提供SpringBoot、Vue、HTML、Uniapp、PHP、Python、NodeJS、爬虫、数据可视化等技术服务,涵盖免费选题、功能设计、开题报告、论文辅导、答辩PPT等。系统采用SpringBoot后端框架和Vue前端框架,确保高效开发与良好用户体验。所有代码由博主亲自开发,并提供全程录音录屏讲解服务,保障学习效果。欢迎点赞、收藏、关注、评论,获取更多精品案例源码。
81 10
SpringBoot start.aliyun.com创建项目,解决properties乱码的问题
通过确保文件和开发环境的编码一致,配置 Maven 编码,设置 Spring Boot 应用和嵌入式服务器的编码,可以有效解决 properties 文件的乱码问题。以上步骤可以帮助开发者确保在 Spring Boot 项目中正确处理和显示多语言字符,避免因编码问题导致的乱码现象。
46 5
基于SpringBoot+Vue实现的家政服务管理平台设计与实现(计算机毕设项目实战+源码+文档)
面向大学生毕业选题、开题、任务书、程序设计开发、论文辅导提供一站式服务。主要服务:程序设计开发、代码修改、成品部署、支持定制、论文辅导,助力毕设!
62 8
Spring运维之boot项目多环境(yaml 多文件 proerties)及分组管理与开发控制
通过以上措施,可以保证Spring Boot项目的配置管理在专业水准上,并且易于维护和管理,符合搜索引擎收录标准。
90 2
SpringBoot项目的html页面使用axios进行get post请求
SpringBoot项目的html页面使用axios进行get post请求
57 0
|
9月前
|
springboot项目打jar包后,如何部署到服务器
springboot项目打jar包后,如何部署到服务器
479 1
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等